2015-09-10 3 views
1

Я хочу создать пользовательский набор цветов, например, в Visual Studio или Blend или здесь (http://www.codeproject.com/Articles/779105/Color-Canvas-and-Color-Picker-WPF-Toolkit). И у меня есть проблема. Я не знаю, как создать цветной холст, как по ссылке выше. (может быть, это не холст, это что-то еще) Я выгляжу как холст с очень необычным градиентом ... и я понятия не имею, как это сделать в xaml. Я попытался нарисовать его в Visual Studio, но не повезло .... Любая помощь будет оценена.Как создать цветной холст для выбора цвета (wpf)

Заранее спасибо

+1

Почему вы не можете просто использовать, что один или взять исходный код и изменить его для ваших требований? –

+0

@GlenThomas, отличная идея, но я не могу найти ее исходный код .... –

+0

[Здесь] (http://wpftoolkit.codeplex.com/SourceControl/latest) является источником того же самого выбора цвета –

ответ

3

Оттенок бар может быть создан с помощью регулярного LinearGradientBrush. Панель «Уровень/насыщенность» может быть выполнена с помощью LinearGradientBrush соответствующего цвета вдоль оси X, а другая - маской непрозрачности вдоль Y, при этом вся черточка на черном фоне.

<Window.Resources> 

    <!-- Change this to any pure hue i.e. no more than 2 rgb components set and at least 1 set to FF --> 
    <Color x:Key="CurrentColor">#00FF00</Color> 

    <LinearGradientBrush x:Key="HueBrush" StartPoint="0,0" EndPoint="0,1"> 
     <LinearGradientBrush.GradientStops> 
      <GradientStop Color="#FF0000" Offset="0" /> 
      <GradientStop Color="#FFFF00" Offset="0.167" /> 
      <GradientStop Color="#00FF00" Offset="0.333" /> 
      <GradientStop Color="#00FFFF" Offset="0.5" /> 
      <GradientStop Color="#0000FF" Offset="0.667" /> 
      <GradientStop Color="#FF00FF" Offset="0.833" /> 
      <GradientStop Color="#FF0000" Offset="1" /> 
     </LinearGradientBrush.GradientStops> 
    </LinearGradientBrush> 

    <VisualBrush x:Key="LevelSaturationBrush" TileMode="None"> 
     <VisualBrush.Visual> 
      <Canvas Background="Black" Width="1" Height="1" SnapsToDevicePixels="True"> 
       <Rectangle Width="1" Height="1" SnapsToDevicePixels="True"> 
        <Rectangle.Fill> 
         <LinearGradientBrush StartPoint="0,0" EndPoint="1,0"> 
          <LinearGradientBrush.GradientStops> 
           <GradientStop Color="White" Offset="0" /> 
           <GradientStop Color="{DynamicResource CurrentColor}" Offset="1" /> 
          </LinearGradientBrush.GradientStops> 
         </LinearGradientBrush> 
        </Rectangle.Fill> 
        <Rectangle.OpacityMask> 
         <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
          <LinearGradientBrush.GradientStops> 
           <GradientStop Color="#FFFFFFFF" Offset="0"/> 
           <GradientStop Color="#00FFFFFF" Offset="1"/> 
          </LinearGradientBrush.GradientStops> 
         </LinearGradientBrush> 
        </Rectangle.OpacityMask> 
       </Rectangle> 
      </Canvas> 
     </VisualBrush.Visual> 
    </VisualBrush> 

</Window.Resources> 

<StackPanel Orientation="Horizontal"> 
    <Rectangle Fill="{StaticResource LevelSaturationBrush}" Width="200" Height="200" Margin="10" Stroke="Black" StrokeThickness="1" SnapsToDevicePixels="True" /> 
    <Rectangle Fill="{StaticResource HueBrush}" Width="20" Height="200" Margin="10" Stroke="Black" StrokeThickness="1" SnapsToDevicePixels="True" /> 
</StackPanel> 

Результат:

enter image description here

+0

Спасибо! Это я ищу. Мне нужно проверить это. –

Смежные вопросы