How to create a simple LED Control - WPF

**Kevinst** · Nov 24 '09, 11:17 PM

Hi!

Let's say I wanted to create a very simple control that is nothing but a LED. That LED can be active or inactive. Depending on that state its color changes.

What is WPFs best practice to do so? Because I dont like the control the way it is right now at all.

LEDControl.xaml :

Code:

<UserControl x:Class="WpfPanelClient.Views.LEDControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" SnapsToDevicePixels="True" Margin="4">
    
    <Ellipse Name="ledEllipse" Width="{Binding Path=ActualHeight, ElementName=ledEllipse}" Stroke="Black" Fill="{Binding Fill, Mode=OneWay}"/>
</UserControl>

LEDControl.xaml .cs:

Code:

    public partial class LEDControl : UserControl, INotifyPropertyChanged
    {
        public static DependencyProperty IsActiveProperty = DependencyProperty.Register("IsActive", typeof (bool),
                                                                                        typeof (LEDControl),
                                                                                        new PropertyMetadata(
                                                                                            new PropertyChangedCallback(
                                                                                                OnChangedIsActive)));

        private Brush fill;

        public LEDControl()
        {
            InitializeComponent();
            DataContext = this;
            IsActive = false;
        }

        public bool IsActive
        {
            get { return (bool) GetValue(IsActiveProperty); }
            set { SetValue(IsActiveProperty, value); }
        }

        public Brush FillActive { get; set; }

        private Brush fillInActive;
        public Brush FillInActive
        {
            get { return fillInActive; }
            set { fillInActive = value;
                Fill = value; }
        }

        public Brush Fill
        {
            get { return fill; }
            set
            {
                fill = value;
                OnPropertyChanged("Fill");
            }
        }

        #region INotifyPropertyChanged Members

        public event PropertyChangedEventHandler PropertyChanged;

        #endregion

        private static void OnChangedIsActive(DependencyObject dependencyObject,
                                              DependencyPropertyChangedEventArgs eventArgs)
        {
            var active = (bool) eventArgs.NewValue;
            var control = ((LEDControl) dependencyObject);

            control.Fill = active ? control.FillActive : control.FillInActive;
        }

        private void OnPropertyChanged(string property)
        {
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs(property));
        }
    }

View:

Code:

            <Controls:LEDControl x:Name="ledControl" Grid.Column="3" Grid.Row="1"  FillActive="LightGreen" FillInActive="Black" IsActive="False"/>

Thanks!

Kevin