WPF將顏色系結到橢圓并自動更新

我有Ellipse一個RadialGradientBrush，其中顏色系結到顏色Light和Dark：

<Grid x:Name="gridEllipse">
  <Ellipse x:Name="ellipseMPCenter">
    <Ellipse.Fill>
      <RadialGradientBrush GradientOrigin="50,50" Center="50,50" Radius="1">
        <RadialGradientBrush.GradientStops>
          <GradientStop Color="{Binding Light}" Offset="0"/>
          <GradientStop Color="{Binding Dark}" Offset="1"/>
        </RadialGradientBrush.GradientStops>
      </RadialGradientBrush>
    </Ellipse.Fill>
  </Ellipse>
</Grid>

這是我的代碼：

    public class UserControlLED : UserControl, INotifyPropertyChanged
    {
        private readonly Color colorGreenLight = Color.FromRgb(61, 214, 0);
        private readonly Color colorGreenDark = Color.FromRgb(10, 92, 1);
        private readonly Color colorRedLight = Color.FromRgb(235, 0, 0);
        private readonly Color colorRedDark = Color.FromRgb(130, 0, 0);

        private Color light;

        public Color Light
        {
            get
            {
                return light;
            }

            set
            {
                light = value;
                OnPropertyChanged(nameof(Light));
            }
        }

        private Color dark;

        public Color Dark
        {
            get
            {
                return dark;
            }

            set
            {
                dark = value;
                OnPropertyChanged(nameof(Dark));
            }
        }


        public UserControlLED()
        {
            InitializeComponent();

            Light = colorGreenLight;
            Dark = colorGreenDark;

            gridEllipse.DataContext = this;
        }

        private async void BtStartClicked(object sender, RoutedEventArgs args)
        {
            Light = colorRedLight;
            Dark = colorRedDark;
        }

        public event EventHandler<PropertyChangedEventArgs> PropertyChanged;

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

使用此代碼，Ellipse即使我按下按鈕，它也會顯示為綠色。當我DataContext再次在按鈕單擊事件中設定時，沒有任何反應。或者我需要把它放在 OnPropertyChanged 方法中嗎？但這仍然不起作用。

我需要在何時何地設定 DataContext？

uj5u.com熱心網友回復：

修復 RadialGradientBrush 的Center屬性并使用RelativeSourceBindings：

<Ellipse.Fill>
    <RadialGradientBrush Center="0.5,0.5">
        <RadialGradientBrush.GradientStops>
            <GradientStop
                Color="{Binding Light,
                    RelativeSource={RelativeSource AncestorType=UserControl}}"
                Offset="0"/>
            <GradientStop
                Color="{Binding Dark,
                    RelativeSource={RelativeSource AncestorType=UserControl}}"
                Offset="1"/>
        </RadialGradientBrush.GradientStops>
    </RadialGradientBrush>
</Ellipse.Fill>

不實作INotifyPropertyChanged，但將屬性宣告為依賴屬性：

public static readonly DependencyProperty LightProperty =
    DependencyProperty.Register(
        nameof(Light), typeof(Color), typeof(UserControlLED),
        new PropertyMetadata(Colors.White));

public static readonly DependencyProperty DarkProperty =
    DependencyProperty.Register(
        nameof(Dark), typeof(Color), typeof(UserControlLED),
        new PropertyMetadata(Colors.Black));

public Color Light
{
    get { return (Color)GetValue(LightProperty); }
    set { SetValue(LightProperty, value); }
}

public Color Dark
{
    get { return (Color)GetValue(DarkProperty); }
    set { SetValue(DarkProperty, value); }
}

不要顯式設定DataContext，因為當您系結控制元件的屬性時，這會破壞標準系結機制，例如

<local:UserControlLED Light="{Binding SomeColor}" .../>

標籤：小白 数据绑定 颜色 通知属性已更改 数据上下文

上一篇：WPFFormC#提交按鈕到excel

下一篇：設定UserControl的特定子項的錯誤模板