ToggleButtonの背景にUserControlのカラープロパティをバインドできません

Question

私はそれを取得できません... 、colorpickerを含むポップアップを開くためにトグルボタンで作られた簡単なUserControlを作った。

トグル背景色の色名を書き込む場合にのみ、ポップアップの開閉に問題はありません。

ただし、UserControlのColorプロパティをバインドしようとすると、ポップアップが閉じられたときに選択した色が表示され、トグルボタンは表示されず、まったく動作しません。

私はそれがこのような単純なと思ったので、私はsomwhere詳細が欠落している必要があります。

<ToggleButton 
    x:Name="OpenColorPicker" 
    Style="{DynamicResource ToggleColorPickerStyle}" 
    Background="{Binding DataContext.SelectedColor, ElementName=ColorPickerWidget, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" 
    /> 

残念ながらここではありません。..

がフルXAMLファイルです：

<UserControl 
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" 
mc:Ignorable="d" 
x:Class="CMiX.ColorSelector" 
xmlns:colorPicker="clr-namespace:ColorPicker;assembly=ColorPicker" 
xmlns:local="clr-namespace:CMiX" 
Height="Auto" Width="Auto" d:DesignWidth="44.533" d:DesignHeight="24.933" 
x:Name="ColorPickerWidget"> 

<UserControl.Resources> 
    <SolidColorBrush x:Key="BaseDarkColor" Color="#FF323232"/> 
    <local:ColorToBrushConverter x:Key="ColorToBrush"/> 
    <Style x:Key="ToggleColorPickerStyle" TargetType="{x:Type ToggleButton}"> 
     <Setter Property="FocusVisualStyle"> 
      <Setter.Value> 
       <Style> 
        <Setter Property="Control.Template"> 
         <Setter.Value> 
          <ControlTemplate> 
           <Rectangle Margin="2" SnapsToDevicePixels="True" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </Setter.Value> 
     </Setter> 
     <Setter Property="Background" Value="Red"/> 
     <Setter Property="BorderBrush" Value="Transparent"/> 
     <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
     <Setter Property="BorderThickness" Value="0"/> 
     <Setter Property="HorizontalContentAlignment" Value="Center"/> 
     <Setter Property="VerticalContentAlignment" Value="Center"/> 
     <Setter Property="Padding" Value="1"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type ToggleButton}"> 
        <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True"> 
         <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
        </Border> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</UserControl.Resources> 

<Grid> 
    <ToggleButton x:Name="OpenColorPicker" Style="{DynamicResource ToggleColorPickerStyle}" Background="{Binding DataContext.SelectedColor, ElementName=ColorPickerWidget, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/> 
    <Popup x:Name="PopupColorPicker" SnapsToDevicePixels="True" AllowsTransparency="True" IsOpen="{Binding IsChecked, ElementName=OpenColorPicker}" StaysOpen="True" Placement="Right"> 
     <Border Margin="20, 20, 0, 20" Padding="5"> 
      <colorPicker:ColorPicker x:Name="ColorPicker" Background="{StaticResource BaseDarkColor}" Width="420" Height="210" SelectedColor="{Binding DataContext.SelectedColor, ElementName=ColorPickerWidget, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"> 
       <colorPicker:ColorPicker.Effect> 
        <DropShadowEffect BlurRadius="20" Opacity="1" Direction="0"/> 
       </colorPicker:ColorPicker.Effect> 
      </colorPicker:ColorPicker> 
     </Border> 
    </Popup> 
</Grid> 

ColorPickerWidgetと呼ばれるUserControlには、このty：

public static readonly DependencyProperty 
SelectedColorProperty = DependencyProperty.Register("SelectedColor", typeof(Color), typeof(ColorSelector)); 
public Color SelectedColor 
{ 
    get { return (Color)GetValue(SelectedColorProperty); } 
    set { SetValue(SelectedColorProperty, value); } 
} 

このコンバータで

<ToggleButton x:Name="OpenColorPicker" Background="{Binding SelectedColor, ElementName=ColorPicker, Converter={StaticResource ColorToBrush}}"/> 

：

が、私はこの試みた__あなたに

を

EDITありがとう

public class ColorToBrushConverter : IValueConverter 
{ 
    SolidColorBrush _red = new SolidColorBrush(), 
        _green = new SolidColorBrush(), 
        _blue = new SolidColorBrush(), 
        _alpha = new SolidColorBrush(), 
        _all = new SolidColorBrush(); 

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
     var color = (Color)value; 
     switch ((string)parameter) 
     { 
      case "r": 
       _red.Color = Color.FromRgb(color.R, 0, 0); 
       return _red; 
      case "g": 
       _green.Color = Color.FromRgb(0, color.G, 0); 
       return _green; 
      case "b": 
       _blue.Color = Color.FromRgb(0, 0, color.B); 
       return _blue; 
      case "a": 
       _alpha.Color = Color.FromArgb(color.A, 
       128, 128, 128); 
       return _alpha; 
      case "all": 
       _all.Color = Color.FromArgb(color.A, color.R, color.G, color.B); 
       return _all; 

     } 
     return Binding.DoNothing; 
    } 

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
     throw new NotImplementedException(); 
    } 
} 

しかし、同じ問題を、ボタンの背景がない色を取得します。

Answer 1

ToggleButton.Backgroundへのバインディングにはいくつか問題があります。まず、ColorPickerのDataContext.SelectedColorにバインドしています。 DataContextはビューモデルです。 ToggleButtonと同じものがおそらく同じDataContextです。だからあなたはそれを見つけるためにColorPickerに行く必要はありません。しかし、ColorPickerでは、SelectedColorをviewmodelプロパティにバインドしていないため、おそらく誤解のようです。その束縛の中でDataContextを取り除くと、野生のガチョウの追跡にどこにもバインディングを送りません。

あなたは名前が間違っています。カラーピッカーの名前を"ColorPicker"としましたが、バインディングに"ColorPickerWidget"を探すように指示しました。そしてMode=TwoWayはToggleButtonがそれをBackgroundに変更することができず、カラーピッカーに色を戻すことができないので、無意味です。しかし、背景色はとにかく色ではありません。それはBrushです。それはおそらくうまくいかないでしょう。

そして、それはBrushを期待していますので、あなたがブラシに色を変換するコンバータを必要としています。あなたがそれらを文字列"Green"または"#882266aa"のようなものを与えることができますので、XAMLでBrush性質は非常に方向感覚を失わされている、と彼らが働きます。彼らはBrushにこれらの文字列を変換し、背後TypeConverterに関連付けられているので、しかし、それはです。あなたがプロパティにColor値をバインドしている場合しかし、それは動作しません。直感的にはわかりません。

このバインディングはToggleButton.Backgroundで機能しますか？

Background="{Binding SelectedColor, ElementName=ColorPicker, Converter={StaticResource ColorToBrush}}"