
<UserControl x:Class="Platform.Controls.ComponentContainer.ColorPicker"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             d:DesignHeight="340"
             d:DesignWidth="510"
             mc:Ignorable="d">
    <UserControl.Resources>
        <DrawingBrush x:Key="CheckerboardBrush"
                      AlignmentX="Left"
                      AlignmentY="Top"
                      Stretch="None"
                      TileMode="Tile"
                      Viewport="0,0,10,10"
                      ViewportUnits="Absolute">
            <DrawingBrush.Drawing>
                <DrawingGroup>
                    <GeometryDrawing Brush="sc# 1,1,1">
                        <GeometryDrawing.Geometry>
                            <RectangleGeometry Rect="0,0,10,10" />
                        </GeometryDrawing.Geometry>
                    </GeometryDrawing>
                    <GeometryDrawing Brush="sc# 0.5,0.5,0.5">
                        <GeometryDrawing.Geometry>
                            <RectangleGeometry Rect="0,0,5,5" />
                        </GeometryDrawing.Geometry>
                    </GeometryDrawing>
                    <GeometryDrawing Brush="sc# 0.5,0.5,0.5">
                        <GeometryDrawing.Geometry>
                            <RectangleGeometry Rect="5,5,5,5" />
                        </GeometryDrawing.Geometry>
                    </GeometryDrawing>
                </DrawingGroup>
            </DrawingBrush.Drawing>
        </DrawingBrush>
    </UserControl.Resources>

    <Grid Background="White">
        <Grid.RowDefinitions>
            <RowDefinition Height="35" />
            <RowDefinition Height="230" />
            <RowDefinition Height="70" />
        </Grid.RowDefinitions>

        <StackPanel Grid.Row="0"
                    Height="35"
                    HorizontalAlignment="Stretch"
                    Background="Black"
                    Orientation="Horizontal">
            <Label VerticalAlignment="Center"
                   Content="调色器"
                   FontWeight="Bold"
                   Foreground="White" />
            <Image x:Name="ImgSqaure1"
                   Width="20"
                   Height="20"
                   Margin="45,0,0,0"
                   MouseLeftButtonDown="Swatch_MouseLeftButtonDown"
                   Source="/Platform.Controls;component/Resource/ColorSwatchSquare.png"
                   ToolTip="Square swatch1" />
            <Image x:Name="ImgSqaure2"
                   Width="20"
                   Height="20"
                   Margin="5,0,0,0"
                   MouseLeftButtonDown="Swatch_MouseLeftButtonDown"
                   Source="/Platform.Controls;component/Resource/ColorSwatchSquare2.png"
                   ToolTip="Square swatch2" />
            <Image x:Name="ImgCircle1"
                   Width="20"
                   Height="20"
                   Margin="5,0,0,0"
                   MouseLeftButtonDown="Swatch_MouseLeftButtonDown"
                   Source="/Platform.Controls;component/Resource/ColorSwatchCircle.png"
                   ToolTip="Circle swatch1" />
        </StackPanel>

        <Grid Grid.Row="1"
              Height="230"
              VerticalAlignment="Top">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="170" />
                <ColumnDefinition Width="170" />
                <ColumnDefinition Width="170" />
            </Grid.ColumnDefinitions>

            <!--  Colorbox, Column1  -->
            <Grid Grid.Row="0"
                  Grid.Column="0"
                  Margin="10,30,0,0">
                <Border Width="154"
                        Height="154"
                        HorizontalAlignment="Center"
                        VerticalAlignment="Top"
                        Background="White"
                        BorderBrush="Black"
                        BorderThickness="2" />
                <Image x:Name="ColorImage"
                       Width="150"
                       Height="150"
                       Margin="2"
                       HorizontalAlignment="Center"
                       VerticalAlignment="Top"
                       Source="/Platform.Controls;component/Resource/ColorSwatchSquare.png" />

                <Canvas x:Name="CanvImage"
                        Width="150"
                        Height="150"
                        Margin="2"
                        HorizontalAlignment="Center"
                        VerticalAlignment="Top"
                        Background="Transparent"
                        MouseDown="CanvImage_MouseDown"
                        MouseMove="CanvImage_MouseMove"
                        MouseUp="CanvImage_MouseUp">
                    <Ellipse x:Name="ellipsePixel"
                             Canvas.Left="0"
                             Canvas.Top="0"
                             Width="10"
                             Height="10"
                             Fill="White"
                             Stroke="Black" />
                </Canvas>
            </Grid>

            <!--  Preview, Column1  -->
            <StackPanel Grid.Column="1" Orientation="Vertical">
                <Label Margin="5,0,0,0"
                       HorizontalAlignment="Left"
                       VerticalAlignment="Center"
                       Content="颜色预览:"
                       FontWeight="Bold"
                       Foreground="Black" />

                <Border Width="154"
                        Height="154"
                        Margin="4,5,10,0"
                        HorizontalAlignment="Left"
                        Background="{StaticResource CheckerboardBrush}"
                        BorderBrush="Black"
                        BorderThickness="2">
                    <InkPresenter Name="previewPresenter"
                                  Width="150"
                                  Height="150"
                                  Margin="0"
                                  Strokes="AOcBAxdIEESAgYAERYQBGwIAJAFGhAEbAgAkAQUBOBkgMgkA9P8CAekiOkUzCQD4nwIBWiA6RTgIAP4DAAAAgH8RAACAPx8JEQAAAAAAAPA/CpYBNIfm3uajgcQgUUiUkjUelEal0KkUBh0HichlM1mtJotZp9JodDl8jk8ZgcBiUOjUYl08m0+l0+lFCjksjESAh+kg6auNwaEwSBQiEQyLRKTRiVSiUSSORyLQ6JQSBIPFYnKZTL5fOZfMZXL4/H47DYLBYHFoJLIpEo9GgIP3OB5PlxLCJiZmU1MISSi4SJiS74+D4+4o" />
                </Border>

            </StackPanel>

            <!--  TextBoxes, Column2  -->
            <StackPanel Grid.Column="2" Orientation="Vertical">
                <StackPanel Margin="0,30,0,0" Orientation="Horizontal">
                    <Label Margin="5,0,0,0"
                           HorizontalAlignment="Left"
                           VerticalAlignment="Center"
                           Content="A"
                           FontWeight="Bold"
                           Foreground="Black" />
                    <Border Width="50"
                            Height="30"
                            Background="LightGray"
                            BorderBrush="Black"
                            BorderThickness="2"
                            CornerRadius="5">
                        <TextBox x:Name="txtAlpha"
                                 Margin="5,1,5,1"
                                 Background="LightGray"
                                 BorderBrush="Transparent"
                                 BorderThickness="0"
                                 IsReadOnly="True" />
                    </Border>
                    <Border Width="50"
                            Height="30"
                            Margin="10,0,0,0"
                            Background="LightGray"
                            BorderBrush="Black"
                            BorderThickness="2"
                            CornerRadius="5">
                        <TextBox x:Name="txtAlphaHex"
                                 Margin="5,1,5,1"
                                 Background="LightGray"
                                 BorderBrush="Transparent"
                                 BorderThickness="0"
                                 IsReadOnly="True" />
                    </Border>
                </StackPanel>

                <StackPanel Margin="0,5,0,0" Orientation="Horizontal">
                    <Label Margin="5,0,0,0"
                           HorizontalAlignment="Left"
                           VerticalAlignment="Center"
                           Content="R"
                           FontWeight="Bold"
                           Foreground="Black" />
                    <Border Width="50"
                            Height="30"
                            Background="LightGray"
                            BorderBrush="Black"
                            BorderThickness="2"
                            CornerRadius="5">
                        <TextBox x:Name="txtRed"
                                 Margin="5,1,5,1"
                                 Background="LightGray"
                                 BorderBrush="Transparent"
                                 BorderThickness="0"
                                 IsReadOnly="True" />
                    </Border>
                    <Border Width="50"
                            Height="30"
                            Margin="10,0,0,0"
                            Background="LightGray"
                            BorderBrush="Black"
                            BorderThickness="2"
                            CornerRadius="5">
                        <TextBox x:Name="txtRedHex"
                                 Margin="5,1,5,1"
                                 Background="LightGray"
                                 BorderBrush="Transparent"
                                 BorderThickness="0"
                                 IsReadOnly="True" />
                    </Border>
                </StackPanel>

                <StackPanel Margin="0,5,0,0" Orientation="Horizontal">
                    <Label Margin="5,0,0,0"
                           HorizontalAlignment="Left"
                           VerticalAlignment="Center"
                           Content="G"
                           FontWeight="Bold"
                           Foreground="Black" />
                    <Border Width="50"
                            Height="30"
                            Background="LightGray"
                            BorderBrush="Black"
                            BorderThickness="2"
                            CornerRadius="5">
                        <TextBox x:Name="txtGreen"
                                 Margin="5,1,5,1"
                                 Background="LightGray"
                                 BorderBrush="Transparent"
                                 BorderThickness="0"
                                 IsReadOnly="True" />
                    </Border>
                    <Border Width="50"
                            Height="30"
                            Margin="10,0,0,0"
                            Background="LightGray"
                            BorderBrush="Black"
                            BorderThickness="2"
                            CornerRadius="5">
                        <TextBox x:Name="txtGreenHex"
                                 Margin="5,1,5,1"
                                 Background="LightGray"
                                 BorderBrush="Transparent"
                                 BorderThickness="0"
                                 IsReadOnly="True" />
                    </Border>
                </StackPanel>

                <StackPanel Margin="0,5,0,0" Orientation="Horizontal">
                    <Label Margin="5,0,0,0"
                           HorizontalAlignment="Left"
                           VerticalAlignment="Center"
                           Content="B"
                           FontWeight="Bold"
                           Foreground="Black" />
                    <Border Width="50"
                            Height="30"
                            Background="LightGray"
                            BorderBrush="Black"
                            BorderThickness="2"
                            CornerRadius="5">
                        <TextBox x:Name="txtBlue"
                                 Margin="5,1,5,1"
                                 Background="LightGray"
                                 BorderBrush="Transparent"
                                 BorderThickness="0"
                                 IsReadOnly="True" />
                    </Border>
                    <Border Width="50"
                            Height="30"
                            Margin="10,0,0,0"
                            Background="LightGray"
                            BorderBrush="Black"
                            BorderThickness="2"
                            CornerRadius="5">
                        <TextBox x:Name="txtBlueHex"
                                 Margin="5,1,5,1"
                                 Background="LightGray"
                                 BorderBrush="Transparent"
                                 BorderThickness="0"
                                 IsReadOnly="True" />
                    </Border>
                </StackPanel>

                <StackPanel Margin="0,5,0,0" Orientation="Horizontal">
                    <Border Width="112"
                            Height="30"
                            Margin="22,0,0,0"
                            Background="LightGray"
                            BorderBrush="Black"
                            BorderThickness="2"
                            CornerRadius="5">
                        <TextBox x:Name="txtAll"
                                 Margin="5,1,5,1"
                                 Background="LightGray"
                                 BorderBrush="Transparent"
                                 BorderThickness="0"
                                 IsReadOnly="True" />
                    </Border>
                </StackPanel>
            </StackPanel>
        </Grid>

        <!--  AlphaSlider  -->
        <Border x:Name="AlphaBorder"
                Grid.Row="2"
                Grid.ColumnSpan="2"
                Height="60"
                Margin="10,5,10,5"
                BorderBrush="Black"
                BorderThickness="2"
                CornerRadius="5">
            <Slider x:Name="AlphaSlider"
                    Margin="5"
                    VerticalAlignment="Center"
                    LargeChange="25"
                    Maximum="255"
                    Minimum="0"
                    Orientation="Horizontal"
                    SmallChange="1"
                    ValueChanged="AlphaSlider_ValueChanged"
                    Value="255" />
        </Border>
    </Grid>
</UserControl>

