Hi all, I know you've probably seen this many times before and I apologize but I've been reading around the internet and cannot find one simple solution to this.
I'm trying to make a user control that looks like this:
I understand I'm going to need dependency properties for this, which will be the following:
- Client name (string)
- Client text status (string)
- Status (Enum - Online, Offline)
- Selected (bool - this will set the tick icon)
I've started making the control and this is what I have so far, it works but I'm unsure if some of the background code should be XAML or not?
XAML
<UserControl x:Class="ControlTest.MyControl" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" mc:Ignorable="d" d:DesignHeight="34" d:DesignWidth="395" Height="34" Width="395"><Grid Background="#FFF8F8F8"><Grid.ColumnDefinitions><ColumnDefinition Width="34*" /><ColumnDefinition Width="361*" /></Grid.ColumnDefinitions><Label Content="Demo Text" HorizontalAlignment="Left" Margin="8,8,0,7" Name="lblClient" Grid.Column="1" Padding="0" HorizontalContentAlignment="Left" VerticalContentAlignment="Center" /><Ellipse Height="8" Margin="0,0,0,0" Name="elipStatus" Width="8" Fill="#FF44C137"><Ellipse.Stroke><SolidColorBrush /></Ellipse.Stroke></Ellipse></Grid></UserControl>
C#
using System; using System.Collections.Generic; using System.Text; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; namespace ControlTest { /// <summary> /// Interaction logic for MyControl.xaml /// </summary> public partial class MyControl : UserControl { public MyControl() { InitializeComponent(); } public string ClientText { get { return (string)GetValue(InfoTextProperty); } set { SetValue(InfoTextProperty, value); } } public static readonly DependencyProperty InfoTextProperty = DependencyProperty.Register( "ClientText", typeof(string), typeof(MyControl), new FrameworkPropertyMetadata("Demo Text", new PropertyChangedCallback(ChangeText))); private static void ChangeText(DependencyObject source, DependencyPropertyChangedEventArgs e) { (source as MyControl).UpdateText(e.NewValue.ToString()); } private void UpdateText(string NewText) { lblClient.Content = NewText; } } }
Questions
1) Should I change the UpdateText() function to be using XAML instead - maybe on the label have: Content="{Binding Path=ClientText}"
The issue with that though is that it doesn't update the designer when I change the property on the control itself within my window. It does however change the text when I run the application - is there any way to solve this or is it best left
as behind code?
2) This is probably the biggest issue I'm having. I want to be able to do something like this.
<Trigger Property="Status" Value="Online"><Setter TargetName="elipStatus" Property="Fill" Value="#44c137" /></Trigger><Trigger Property="Status" Value="Offline"><Setter TargetName="elipStatus" Property="Fill" Value="#cd4848" /></Trigger>
I know that doesn't work because I tried it in the <UserControl.Triggers> because it can't find the custom property. I was wondering, should I make this a CustomControl instead? I know how to do it that way, but wasn't sure what control this would
extend. Or should I use c# code to change the ellipse fill when the value is change?
Any clarifications on this would be greatly appreciated. I'm sorry for hte long thread, thanks
Ben :)