Customizing appearance of user-control property in 'Properties' panel [modified]

[Prasoon Chaudhary]

I've created a user-control to change border of an item. It is working fine with the following code. When the control is selected, this property appears under 'Miscellaneous' tab in 'Expression Blend/Visual Studio' Properties. But, to write value for this property, I need to type "Thick" / "Thin" etc. in space there. Can I define possible values as "Thick" / "Thin"/ "Thinner"/"None", so that they appear in a 'ComboBox'? Just like it appear in 'Visibility' and others? I guess, this is something to do with 'TypeConverter'. I am new to C# and WPF. It would be nice, if reply comes with code for this specific problem, instead of generic one.

namespace Counters
{

public partial class TestControl: UserControl
{

	private string \_borderType = "Thick";
	
	public TestControl()
	{
		this.InitializeComponent();
	}

//
    //Add a property now :: BorderType
    //
    public static readonly DependencyProperty BorderTypeProperty = 
    DependencyProperty.Register("BorderType", typeof(string), typeof(TestControl),
    new UIPropertyMetadata("Thick", new PropertyChangedCallback(BorderTypeChangedCallBack)));

    public string BorderType
    {
        get { return \_borderType; }
        set
        {
            \_borderType = value;
			
			if (\_borderType=="Thick")
			{
				//Code
			}
			else if (\_borderType=="Thin")
			{

				//Code
			}
			else if (\_borderType=="Thinner")
			{

				//Code
			}
			else if (\_borderType=="None")
			{

				//Code
			}
			else
			{

				//Code
			}
        }
    }
	
    static void BorderTypeChangedCallBack(DependencyObject property, DependencyPropertyChangedEventArgs args)
    {
        TestControl textCounter = (TestControl)property;
        textCounter.BorderType = (string)args.NewValue;
    }

}

}

modified on Wednesday, April 7, 2010 4:27 AM

[Sevententh]

Does this help?

<StackPanel>
    <ComboBox Margin="5" x:Name="myComboBoxThickness" >
        <ComboBoxItem Content="Thick" />
        <ComboBoxItem Content="Thin" />
        <ComboBoxItem Content="Thinner" />
        <ComboBoxItem Content="None" />
    </ComboBox>
    <Border x:Name="ThisBorder" >
        <Border.Style>
            <Style>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ElementName=myComboBoxThickness, Path=SelectedItem.Content}" Value="Thick">
                        <Setter Property="Border.BorderThickness" Value="10"/>
                        <Setter Property="Border.BorderBrush" Value="Aqua"/>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding ElementName=myComboBoxThickness, Path=SelectedItem.Content}" Value="Thin">
                        <Setter Property="Border.BorderThickness" Value="5"/>
                        <Setter Property="Border.BorderBrush" Value="Green"/>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding ElementName=myComboBoxThickness, Path=SelectedItem.Content}" Value="Thinner">
                        <Setter Property="Border.BorderThickness" Value="2"/>
                        <Setter Property="Border.BorderBrush" Value="Yellow"/>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding ElementName=myComboBoxThickness, Path=SelectedItem.Content}" Value="None">
                        <Setter Property="Border.BorderThickness" Value="0"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Border.Style>
        <TextBlock Text="This is a test arena!!!!!!!!!!!!" />
        
    </Border>
</StackPanel>

[Prasoon Chaudhary]

Thanks for your reply. But here I need something related to user-control. 'BorderType' is a custom made property of that control. And this property appears in 'properties' panel along with other properties(e.g. Opacity/Visibility etc), when one selects that user-control. Everything is fine with current code. But, I need to type the value of 'BorderType' in 'Properties' panel. I am looking for a way, where I can choose the value from combo-box.

[Sevententh]

Oh OK, I did something similar with a control for visibility of the Toolbar. It would be the very similar. You need to set yourself up a public Enum for your types of Border

public enum BorderTypes
{
    // Summary:
    //     Display the border as thick.
    Thick = 0,
    //
    // Summary:
    //     Display the border as thin.
    Thin = 1,
    //
    // Summary:
    //     Display the border as thinner.
    Thinner = 2,
    //
    // Summary:
    //     Do not display the border.
    None= 3,
}

Now I think this should work for you (fingers crossed)

    #region BorderThicknessProperty DP

    /// <summary>
    /// Bound Data Dependency Property
    /// </summary>
    public static readonly DependencyProperty myBorderThicknessProperty =
        DependencyProperty.Register("myBorderThickness", typeof(BorderTypes), typeof(TestControl),
            new FrameworkPropertyMetadata(BorderTypes.Thick, new PropertyChangedCallback(OnBorderThicknessPropertyChanged)));

    /// <summary>
    /// Gets or sets the Bound Data property.  
    /// </summary>
    public BorderTypes myBorderThickness
    {
        get { return (BorderTypes)GetValue(myBorderThicknessProperty); }
        set { SetValue(myBorderThicknessProperty, value); }
    }

    /// <summary>
    /// Handles changes to the ToolbarVisibility property.
    /// </summary>
    private static void OnBorderThicknessPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        BorderTypes ds = (BorderTypes)e.NewValue;
        //Use a switch to set the thickness
        switch (ds)
        {
            case BorderTypes.Thick :
                {
                    ((TestControl)d).<_Name of your control here to set the border thickness on_\>.BorderThickness = 10;
                }
                break;
        }
    }

    #endregion

modified on Thursday, April 8, 2010 4:16 AM

[Prasoon Chaudhary]

Perfect! This works. Many thanks...