Color Picker ComoBox in WPF VB.NET

Color Picker ComoBox in WPF VB.NET

Color Picker ComoBox in WPF C#

  This example explains How to populate WPF Supported Colors into ComboBox.
and then select each color in the Combobox ,it Draws a Rectangle with selected one.

Step 1)  Add ComboBox and one Rectangle to XAML Page/UserControl

        <Rectangle Fill="black"  Grid.Row="2" Grid.Column="0"
                   Grid.ColumnSpan="2"
                   HorizontalAlignment="Left"
                   Height="100" Stroke="Black"
                   VerticalAlignment="Top" Width="300"
                   x:Name="Rectangle1"
                   />
        <ComboBox HorizontalAlignment="Left" VerticalAlignment="Top"
                  Width="158"
                  x:Name="colorCombo" SelectionChanged="colorCombo_SelectionChanged"
                  ItemsSource="{Binding}" Grid.Row="1" Grid.Column="01"
                   Height="22"
                  >
        </ComboBox>

Step 2) Add SelectionChanged Event handler for ComboBox

Step 3) Fill Combobox with Colors
Before that, as you seen in the Image,Item in the combo box has 2 elements
                  1.Rectangle
                  2.TextBlock
So Putting these UI elements in StatckPanel with Orientation Horizontal.

i.e Each Combobox element is one StackPanel

Private Sub ColorPickerComboBoxDemo_Loaded(sender As Object, e As RoutedEventArgs)
    Try

        Dim colorProp As System.Reflection.PropertyInfo() = GetType(Colors).GetProperties()
        listOfColor = New [String](colorProp.Length - 1) {}
        Dim i As Integer = 0
        For Each pi As System.Reflection.PropertyInfo In colorProp
            colorCombo.Items.Add(GetStackPanel(pi.Name))
        Next
    Catch ex As Exception
        MessageBox.Show(ex.Message)
    End Try
End Sub


Private Function GetStackPanel(strColor As [String]) As StackPanel
    Dim ColorsStack As New StackPanel()
    ColorsStack.Orientation = Orientation.Horizontal
    Dim rect As New Rectangle()
    rect.Width = 20
    rect.Height = 20
    Dim newColor As Color = DirectCast(ColorConverter.ConvertFromString(strColor), Color)
    rect.Fill = New SolidColorBrush(newColor)
    'rect.Stroke = 2;
    Dim blk As New TextBlock()
    blk.Text = strColor
    ColorsStack.Children.Add(rect)
    ColorsStack.Children.Add(blk)
    Return ColorsStack
End Function

Step 4)   Filling Rectangle in ComoBox SelectionIndexChanged Event Handler

Private Sub colorCombo_SelectionChanged(sender As Object, e As SelectionChangedEventArgs)
    'Stack Panel has 2 elements one small colored rect
    'Another one TextBlock.
    Dim selPanel As StackPanel = TryCast(colorCombo.SelectedValue, StackPanel)
    Dim txtBlk As TextBlock = TryCast(selPanel.Children(1), TextBlock)
    Dim newColor As Color = DirectCast(ColorConverter.ConvertFromString(txtBlk.Text), Color)
    Rectangle1.Fill = New SolidColorBrush(newColor)
End Sub

Step 5) Run the Application

OUTPUT

Tags:Color Picker ComoBox in WPF VB.NET VB.NET XAML .net 4.5,using a combobox to select a color,Combo color picker wpf, ColorPicker WPF VB.NET,WPF color picker combobox,WPF Combobox, WPF Rectangle,WPF ComboBox SelectionChanged,CustomFont in WPF,WPF ComboBox DataContext.