Question

了解一些usercontrol交互有点问题：

我已经建立了这个颜色选择器。我有四个滑块可以改变红色，绿色和白色的颜色。蓝色（RGB及所有）以及不透明度（alpha）。当我来回滑动这些时，我从previewColor Rectangle获得实时响应（当我滑动任何滑块时，矩形的填充颜色会发生变化）。所有这些元素都在我的用户控件中。

在我的主窗口中，我有两个有意义的元素，一个空白画布和一个“更改画布”按钮。理想情况下，当我在用户控件中使用滑块并找到我喜欢的颜色时，我只需单击ChangeCanvas按钮，画布背景就会改变以匹配previewRectangle的当前颜色。

问题在于我无法弄清楚如何将previewRectangle的当前颜色绑定到我的画布将接受的按钮操作。有没有办法通过按钮动作将我的画布背景绑定到我的矩形的填充？或者将color属性从usercontrol传递到主窗口是否更好？

主窗口XAML＆amp;代码

<Window x:Class="C_ShapeCanvasV2.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:schafec="clr-namespace:C_ShapeCanvasV2.SControl"
    Title="ColorCanvas" Height="393" Width="729">
<Grid Background="Gray">
    <Canvas Name="MainCanvas" MouseLeftButtonDown="MainCanvas_MouseLeftButtonDown" ClipToBounds="True" MouseRightButtonDown="MainCanvas_MouseRightButtonDown" Background="White"  HorizontalAlignment="Left" Height="363" VerticalAlignment="Top" Width="305"/>
    <!-- user control -->
    <schafec:ColorControls x:Name="colorControls" Margin="330,21,23,189"/>
    <!-- user control -->
    <Button Name="ChangeCanvas" Click="ChangeCanvas_Click" Content="Change Canvas" HorizontalAlignment="Left" Margin="456,209,0,0" VerticalAlignment="Top" Width="158" />
    <Button Name="clearButton" Click="clearButton_Click" Content="Clear" HorizontalAlignment="Left" Margin="498,236,0,0" VerticalAlignment="Top" Width="75"/>

</Grid>

namespace C_ShapeCanvasV2
{

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();  
    }       
    //---------------------------------------------------------------------------------------------//


    private void ChangeCanvas_Click(object sender, RoutedEventArgs e)
    {
        //attempted -- not working
        //MainCanvas.Background = new SolidColorBrush(clr);
    }

    private void clearButton_Click(object sender, RoutedEventArgs e)
    {
        MainCanvas.Children.Clear();
        MainCanvas.Background = new SolidColorBrush(Colors.White);
    }

}
}

UserControl XAML＆amp;代码

 <UserControl x:Class="C_ShapeCanvasV2.SControl.ColorControls"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Height="153" Width="368">
<Grid Name="mainGrid" Background ="Gray" Margin="0,6,0,-6">


<!-- just an image under the previewRectangle to provide contrast for opacity purposes -->
    <Rectangle Name="underImage" HorizontalAlignment="Left" Height="58" Margin="24,52,0,0" Stroke="Black" VerticalAlignment="Top" Width="64">
        <Rectangle.Fill>
            <ImageBrush ImageSource ="/C_ShapeCanvasV2;component/Images/ops.png"/>
        </Rectangle.Fill>
    </Rectangle>


<!-- PreviewColor Rectangle -->
    <Rectangle Name="previewColor" HorizontalAlignment="Left" Height="58" Margin="24,52,0,0" Stroke="Black" VerticalAlignment="Top" Width="64"/>

    <Slider Name="redSlider" Minimum="0" ValueChanged="redSlider_ValueChanged" IsSnapToTickEnabled="True" Maximum="255" TickFrequency="1" HorizontalAlignment="Left" Margin="211,36,0,0" VerticalAlignment="Top" Width="104"/>
    <Slider Name="greenSlider" Minimum="0" ValueChanged="greenSlider_ValueChanged" IsSnapToTickEnabled="True" Maximum="255" TickFrequency="1"  HorizontalAlignment="Left" Margin="211,61,0,0" VerticalAlignment="Top" Width="104"  />
    <Slider Name="blueSlider"  Minimum="0" ValueChanged="blueSlider_ValueChanged" IsSnapToTickEnabled="True" Maximum="255" TickFrequency="1"  HorizontalAlignment="Left" Margin="211,86,0,0" VerticalAlignment="Top" Width="104"/>
    <Slider Name="alphaSlider" Minimum="0" ValueChanged="alphaSlider_ValueChanged" IsSnapToTickEnabled="True" Maximum="255" TickFrequency="1"  HorizontalAlignment="Left" Margin="211,111,0,0" VerticalAlignment="Top" Width="104"/>

    <Label Content="Red" HorizontalAlignment="Left" Margin="112,34,0,0" VerticalAlignment="Top"/>
    <Label Content="Green" HorizontalAlignment="Left" Margin="112,57,0,0" VerticalAlignment="Top"/>
    <Label Content="Blue" HorizontalAlignment="Left" Margin="112,82,0,0" VerticalAlignment="Top"/>
    <Label Content="Alpha" HorizontalAlignment="Left" Margin="112,107,0,0" VerticalAlignment="Top"/>

    <Label Name="redLabel" Content="{Binding ElementName= redSlider, Path=Value}" HorizontalAlignment="Left" Margin="318,32,0,0" VerticalAlignment="Top"/>
    <Label Name="greenLabel" Content="{Binding ElementName= greenSlider, Path=Value}" HorizontalAlignment="Left" Margin="318,59,0,0" VerticalAlignment="Top"/>
    <Label Name="blueLabel" Content="{Binding ElementName= blueSlider, Path=Value}" HorizontalAlignment="Left" Margin="318,82,0,0" VerticalAlignment="Top"/>
    <Label Name="alphaLabel" Content="{Binding ElementName= alphaSlider, Path=Value}" HorizontalAlignment="Left" Margin="318,107,0,0" VerticalAlignment="Top"/>

</Grid>

namespace C_ShapeCanvasV2.SControl
{
    public partial class ColorControls : UserControl
    {
        public Color clr;

    public ColorControls()
    {
        InitializeComponent();
    }

    private void changeColorSystem()
    {
        clr = Color.FromArgb(Convert.ToByte(alphaSlider.Value), Convert.ToByte(redSlider.Value), Convert.ToByte(greenSlider.Value), Convert.ToByte(blueSlider.Value));
        previewColor.Fill = new SolidColorBrush(clr);
    }

    //public void setColor(Color g)
    //{ 
    //    Color c = g;
    //}

    //public Color getColor()
    //{
    //    return clr;
    //}

    private void alphaSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        changeColorSystem();
    }

    private void blueSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        changeColorSystem();
    }

    private void greenSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        changeColorSystem();
    }

    private void redSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        changeColorSystem();
    }
}
}

Answer 1

在我看来这不会很干净，但这段代码应该可行：

private void ChangeCanvas_Click(object sender, RoutedEventArgs e)
{
   MainCanvas.Background = colorControls.previewColor.Fill;
}

你应该真正了解MVVM架构，以更干净/可测试的方式完成它。

希望它有所帮助。

如何从User Control绑定或获取属性

1 个答案: