使用 Brush 设置 <StackPanel> 背景色

Question

所以我创建了一个包含滑块、滚动条和 IntegerUpDown 的设计，它们都绑定在一起同时移动并具有相同的值。我有一个，每个 ARGB 一个。我在中间有一个 stackPanel，修改任何工具时 BackgroundColor 应该改变。

据我所知，我只需要知道其中一个工具值，以便通过它们提供的数据设置背景...但是我该如何实现呢？

到目前为止我已经编码了：

public partial class MainWindow : Window
{
    SolidColorBrush brush;

    public MainWindow()
    {
        InitializeComponent();

        brush = new SolidColorBrush();
        brush.Color = Color.FromArgb(0, 0, 0, 0);
        stkColor.Background = brush;
    }

    private void scbScrollA_Scroll(object sender, System.Windows.Controls.Primitives.ScrollEventArgs e)
    {
        brush.Color.A = scbScrollA.Value(); //doesn't work
    }

    private void scbScrollR_Scroll(object sender, System.Windows.Controls.Primitives.ScrollEventArgs e)
    {

    }

    private void scbScrollG_Scroll(object sender, System.Windows.Controls.Primitives.ScrollEventArgs e)
    {

    }

    private void scbScrollB_Scroll(object sender, System.Windows.Controls.Primitives.ScrollEventArgs e)
    {

    }
}

正如我所说，仅通过了解滚动数据，因为我将绑定与所有其他工具一起使用，我可以设置颜色并在每次修改任何数据时刷新。

我拥有的绑定：

<xctk:IntegerUpDown Grid.Column="7" Grid.Row="0" x:Name="iudB" Increment="10" Minimum="0" Maximum="255"
                                Value="{Binding ElementName=scbScrollB, Path=Value}"
                                />

<ScrollBar Grid.Column="1" Grid.Row="6" Grid.RowSpan="2" Width="Auto" Orientation="Horizontal" 
                   Minimum="0" Maximum="255" x:Name="scbScrollB" 
                   Scroll="scbScrollB_Scroll" SmallChange="1" 
                   LargeChange="10" Value="{Binding ElementName=sliderB, Path=Value}"
                   />

<Slider 
                Grid.Column="6" Grid.Row="1" Grid.RowSpan="1"
                Orientation="Vertical"
                LargeChange="10" 
                Maximum="255" 
                SmallChange="1" 
                TickPlacement="TopLeft" 
                Minimum="0" 
                TickFrequency="25"
                x:Name="sliderB"
                />

滑块没有绑定，因为据我所知它们是双向的。 None 个给出了错误。

Answer 1

为颜色的四个分量创建一个具有四个字节属性的视图模型，并为生成的颜色值创建一个 Color 属性。

public class ViewModel : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    private byte alpha;
    private byte red;
    private byte green;
    private byte blue;

    private void NotifyPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }

    private void SetColorComponent(ref byte field, byte value, string propertyName)
    {
        if (field != value)
        {
            field = value;
            NotifyPropertyChanged(propertyName);
            NotifyPropertyChanged(nameof(Color));
        }
    }

    public byte Alpha
    {
        get { return alpha; }
        set { SetColorComponent(ref alpha, value, nameof(Alpha)); }
    }

    public byte Red
    {
        get { return red; }
        set { SetColorComponent(ref red, value, nameof(Red)); }
    }

    public byte Green
    {
        get { return green; }
        set { SetColorComponent(ref green, value, nameof(Green)); }
    }

    public byte Blue
    {
        get { return blue; }
        set { SetColorComponent(ref blue, value, nameof(Blue)); }
    }

    public Color Color
    {
        get { return Color.FromArgb(alpha, red, green, blue); }
    }
}

将视图模型的实例分配给 window 的 DataContext，并将 Sliders、ScrollBars 等绑定到视图模型属性。

<Window ...>
    <Window.DataContext>
        <local:ViewModel/>
    </Window.DataContext>
    <StackPanel>
        <StackPanel.Background>
            <SolidColorBrush Color="{Binding Color}"/>
        </StackPanel.Background>

        <Slider Minimum="0" Maximum="255" Value="{Binding Alpha}"/>
        <Slider Minimum="0" Maximum="255" Value="{Binding Red}"/>
        <Slider Minimum="0" Maximum="255" Value="{Binding Green}"/>
        <Slider Minimum="0" Maximum="255" Value="{Binding Blue}"/>

        <ScrollBar Minimum="0" Maximum="255" Value="{Binding Alpha}" Orientation="Horizontal"/>
        <ScrollBar Minimum="0" Maximum="255" Value="{Binding Red}" Orientation="Horizontal"/>
        <ScrollBar Minimum="0" Maximum="255" Value="{Binding Green}" Orientation="Horizontal"/>
        <ScrollBar Minimum="0" Maximum="255" Value="{Binding Blue}" Orientation="Horizontal"/>
    </StackPanel>
</Window>

使用 Brush 设置 <StackPanel> 背景色

Setting a <StackPanel> background color with Brush

wpf

brush