Как я могу преобразовать значения трех ползунков в цвет?
Я пытаюсь создать пользовательский элемент управления, который позволит пользователю определять цвет в WPF. Я делал это раньше в WinForms, но в WPF это не так просто. Я также впервые имею дело с мультиконвертером.
Элемент управления имеет 3 ползунка - вот так:
<Slider x:Name="sdrRed" Height="32" LargeChange="5" SmallChange="1" Maximum="255" Width="321" TickPlacement="Both"/>
Единственное отличие - это имя для каждого - sdrRed, sdrGreen и sdrBlue.
Это многозначный преобразователь:
public class ByteToColorConverter : IMultiValueConverter
{
public object Convert( object[ ] values, Type targetType, object parameter, System.Globalization.CultureInfo culture ) {
return Color.FromArgb( (byte)values[0], (byte)values[1], (byte)values[2], (byte)values[3]);
}
public object[ ] ConvertBack( object value, Type[ ] targetTypes, object parameter, System.Globalization.CultureInfo culture ) {
Color C = ( Color )value;
return new object[ ] { C.A, C.R, C.G, C.B };
}
}
Это насколько я смог получить - я не смог найти пример того, как действовать.
Кроме того - как я могу передать значения на мультиконвертер, которые являются статическими, чтобы я мог определить цвет только с одним ползунком (скажем, чтобы я мог определить оттенки красного, синего или зеленого)?
РЕДАКТИРОВАТЬ
Для некоторой ясности; Сам элемент управления будет иметь свойство зависимости:
private static readonly DependencyProperty
_Color = DependencyProperty.Register( "Color", typeof( Color ), typeof( ColorDefiner ), new PropertyMetadata( Colors.Black ) );
public Color Color {
get { return ( Color )this.GetValue( ColorDefiner._Color ); }
set { this.SetValue( ColorDefiner._Color, value ); }
}
Этот элемент управления передает преобразованное значение цвета в эту привязку, чтобы другие цвета могли быть связаны с ним. Я надеюсь, что это проясняет ситуацию.
2 ответа
Прежде всего, я бы порекомендовал внести следующие изменения в ваш ByteToColorConverter:
public class DoubleToColorConverter : IMultiValueConverter
{
public object Convert(object[] values, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
// Values bound to sliders are going to be doubles.
return Color.FromScRgb((float)(double)values[0], (float)(double)values[1], (float)(double)values[2], (float)(double)values[3]);
}
public object[] ConvertBack(object value, Type[] targetTypes, object parameter, System.Globalization.CultureInfo culture)
{
Color C = (Color)value;
return new object[] { (double)C.ScA, (double)C.ScR, (double)C.ScG, (double)C.ScB };
}
}
Я переключился с байтов на двойники, поскольку значение ползунка, к которому вы пытаетесь привязать, будет возвращать / принимать только двойные значения. (float)(double) литой является распаковка значений в массиве.
С этим XAML я смог заставить работать базовый цветовой микшер ARGB. Обратите внимание, что я изменил значения Min/Max на слайдере, теперь мы больше не имеем дело с байтами.
<StackPanel>
<Slider x:Name="sdrAlpha" Height="32" LargeChange="0.5" SmallChange="0.1" Minimum="0" Maximum="1" Width="321" TickPlacement="Both"/>
<Slider x:Name="sdrRed" Height="32" LargeChange="0.5" SmallChange="0.1" Minimum="0" Maximum="1" Width="321" TickPlacement="Both"/>
<Slider x:Name="sdrGreen" Height="32" LargeChange="0.5" SmallChange="0.1" Minimum="0" Maximum="1" Width="321" TickPlacement="Both"/>
<Slider x:Name="sdrBlue" Height="32" LargeChange="0.5" SmallChange="0.1" Minimum="0" Maximum="1" Width="321" TickPlacement="Both"/>
<Border x:Name="colourBorder" Height="200" HorizontalAlignment="Stretch">
<Border.Background>
<SolidColorBrush>
<SolidColorBrush.Color>
<MultiBinding Converter="{StaticResource colorConverter}">
<Binding ElementName="sdrAlpha" Path="Value" Mode="TwoWay" />
<Binding ElementName="sdrRed" Path="Value" Mode="TwoWay" />
<Binding ElementName="sdrGreen" Path="Value" Mode="TwoWay" />
<Binding ElementName="sdrBlue" Path="Value" Mode="TwoWay" />
</MultiBinding>
</SolidColorBrush.Color>
</SolidColorBrush>
</Border.Background>
</Border>
</StackPanel>
Если вы хотите привязать один слайдер к конвертеру, вы можете обновить конвертер, чтобы проверить количество значений в values[] массив. Вы могли бы, возможно, использовать ConverterParameter передать цвет, который вы хотите, чтобы этот слайдер воздействовал... что-то вроде этого:
<MultiBinding Converter="{StaticResource colorConverter}" ConverterParameter="Red">
<Binding ElementName="sdrRed" Path="Value" Mode="TwoWay" />
</MultiBinding>
Хорошо, я хочу поблагодарить всех за помощь; Я наконец смог найти решение - в случае, если кто-то заинтересован или наткнулся на это, это также хороший урок в MVVM (может быть, я не знаю...).
Тем не мение:
Это MVVM, который я реализовал:
public class ColorViewModel : INotifyPropertyChanged {
public event PropertyChangedEventHandler PropertyChanged;
private Color _Color = Colors.Black;
public double A {
get { return this.Color.ScA; }
set {
this._Color.ScA = ( float )value;
if ( this.PropertyChanged != null ) {
this.PropertyChanged( this, new PropertyChangedEventArgs( "A" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "Color" ) );
}
}
}
public double R {
get { return this.Color.ScR; }
set {
this._Color.ScR = ( float )value;
if ( this.PropertyChanged != null ) {
this.PropertyChanged( this, new PropertyChangedEventArgs( "R" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "Red" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "Color" ) );
}
}
}
public double G {
get { return this.Color.ScG; }
set {
this._Color.ScG = ( float )value;
if ( this.PropertyChanged != null ) {
this.PropertyChanged( this, new PropertyChangedEventArgs( "G" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "Green" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "Color" ) );
}
}
}
public double B {
get { return this._Color.ScB; }
set {
this._Color.ScB = ( float )value;
if ( this.PropertyChanged != null ) {
this.PropertyChanged( this, new PropertyChangedEventArgs( "B" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "Blue" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "Color" ) );
}
}
}
public Color Color {
get { return this._Color; }
set {
this._Color = value;
if ( this.PropertyChanged != null )
this.AllChanged( );
}
}
public Color Red { get { return Color.FromScRgb( 1.0F, ( float )this.R, 0.0F, 0.0F ); } }
public Color Green { get { return Color.FromScRgb( 1.0F, 0.0F, ( float )this.G, 0.0F ); } }
public Color Blue { get { return Color.FromScRgb( 1.0F, 0.0F, 0.0F, ( float )this.B ); } }
private void AllChanged( ) {
this.PropertyChanged( this, new PropertyChangedEventArgs( "A" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "R" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "G" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "B" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "Red" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "Green" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "Blue" ) );
this.PropertyChanged( this, new PropertyChangedEventArgs( "Color" ) );
}
}
Это контрольный класс:
public partial class ColorDefiner : UserControl {
public static readonly DependencyProperty
_Color = DependencyProperty.Register( "Color", typeof( Color ), typeof( ColorDefiner ) );
public Color Color {
get { return ( Color )this.GetValue( ColorDefiner._Color ); }
set { this.SetValue( ColorDefiner._Color, value ); }
}
private ColorViewModel CVM { get { return this.DataContext as ColorViewModel; } }
public ColorDefiner( ) {
InitializeComponent( );
Binding B = new Binding( "Color" ) { Source = this.DataContext };
this.SetBinding( ColorDefiner._Color, B );
}
}
Это XAML для пользовательского элемента управления (да, я сделал это с помощью UserControl; для этого требовался контекст данных, и я действительно не хочу с этим спорить в пользовательском элементе управления - на самом деле это будет только мой собственный личный контроль для моего собственного использования в любом случае):
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:Components="clr-namespace:WPFTools.Components"
xmlns:Controls="clr-namespace:WPFTools.Controls"
x:Class="WPFTools.Controls.ColorDefiner"
mc:Ignorable="d"
Width="100" Height="100" FontFamily="Arial" FontWeight="Bold">
<UserControl.DataContext>
<Controls:ColorViewModel/>
</UserControl.DataContext>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20"/>
<RowDefinition Height="5"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Viewbox HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Components:WPFGLabel Text="A" StrokeThickness="0.5" TextAlignment="Right" Stroke="#99000000">
<Components:WPFGLabel.Fill>
<SolidColorBrush Color="{Binding Color}"/>
</Components:WPFGLabel.Fill>
</Components:WPFGLabel>
</Viewbox>
<Viewbox HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="1">
<Components:WPFGLabel Text="R" StrokeThickness="0.5" TextAlignment="Right" Stroke="#99000000">
<Components:WPFGLabel.Fill>
<SolidColorBrush Color="{Binding Red, Mode=OneWay}"/>
</Components:WPFGLabel.Fill>
</Components:WPFGLabel>
</Viewbox>
<Viewbox HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="2">
<Components:WPFGLabel Text="G" StrokeThickness="0.5" TextAlignment="Right" Stroke="#99000000">
<Components:WPFGLabel.Fill>
<SolidColorBrush Color="{Binding Green, Mode=OneWay}"/>
</Components:WPFGLabel.Fill>
</Components:WPFGLabel>
</Viewbox>
<Viewbox HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="3">
<Components:WPFGLabel Text="B" StrokeThickness="0.5" TextAlignment="Right" Stroke="#99000000" RenderTransformOrigin="-7.272,0.575">
<Components:WPFGLabel.Fill>
<SolidColorBrush Color="{Binding Blue, Mode=OneWay}"/>
</Components:WPFGLabel.Fill>
</Components:WPFGLabel>
</Viewbox>
<Viewbox HorizontalAlignment="Stretch" Grid.Row="2" VerticalAlignment="Stretch">
<Slider Orientation="Vertical" TickPlacement="Both" LargeChange="0.1" Maximum="1" SmallChange="0.01" TickFrequency="0.02" Height="90" TabIndex="0" Value="{Binding A, Mode=TwoWay}"/>
</Viewbox>
<Viewbox HorizontalAlignment="Stretch" Grid.Row="2" Grid.Column="1" VerticalAlignment="Stretch">
<Slider Orientation="Vertical" TickPlacement="Both" LargeChange="0.1" Maximum="1" SmallChange="0.01" TickFrequency="0.02" Height="90" TabIndex="1" Value="{Binding R, Mode=TwoWay}"/>
</Viewbox>
<Viewbox HorizontalAlignment="Stretch" Grid.Row="2" Grid.Column="2" VerticalAlignment="Stretch">
<Slider Orientation="Vertical" TickPlacement="Both" LargeChange="0.1" Maximum="1" SmallChange="0.01" TickFrequency="0.02" Height="90" TabIndex="2" Value="{Binding G, Mode=TwoWay}"/>
</Viewbox>
<Viewbox HorizontalAlignment="Stretch" Grid.Row="2" Grid.Column="3" VerticalAlignment="Stretch">
<Slider Orientation="Vertical" TickPlacement="Both" LargeChange="0.1" Maximum="1" SmallChange="0.01" TickFrequency="0.02" Height="90" Value="{Binding B, Mode=TwoWay}"/>
</Viewbox>
</Grid>
</UserControl>
Я связал цвет кисти надписей с соответствующими цветами в модели представления (А получил все). I Двусторонняя привязка значения каждого ползунка к соответствующему значению в модели представления, а в коде я привязал свойство зависимости к свойству цвета модели представления. Я проверил это, и это сработало.
Еще раз спасибо всем за помощь.