Silverlight Fieldset Control

I've been missing the classic Fieldset of HTML in Silverlight and I couldn't find any solutions on the web. How do I go about building on开发者_开发技巧e?

I figured I'll build one.

It's probably not the best way to solve it but it works and I just thought I'd share it because it feels like others might be looking for the same thing.

Simple solution though, you can set FontSize, Foreground and title of the legend.

Markup:

<Controls:Fieldset BorderBrush="#FFcccccc" Legend="LegendHeader" LegendFontSize="14" LegendForeground="Green">
   <Button Content="Button" />
</Controls:Fieldset>

Control Style:

<Style TargetType="Controls:Fieldset">
    <Setter Property="Padding" Value="10"/>
    <Setter Property="Margin" Value="10"/>
    <Setter Property="BorderBrush" Value="#FFcccccc"/>
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="LegendFontSize" Value="14"/>
    <Setter Property="LegendForeground" Value="Black"/>
    <Setter Property="FontSize" Value="14"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Controls:Fieldset">
                <Grid x:Name="LayoutRoot" Margin="{TemplateBinding Margin}">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="5"/>
                        <ColumnDefinition Width="20"/>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="5"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="5"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>

                    <Border BorderThickness="1,1,0,0" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" CornerRadius="5,0,0,0"/>
                    <Border Grid.Column="1" BorderThickness="0,1,0,0" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}"/>
                    <Border Grid.Column="3" BorderThickness="0,1,0,0" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}"/>
                    <Border Grid.Column="4" BorderThickness="0,1,1,0" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" CornerRadius="0,5,0,0"/>
                    <Border Grid.ColumnSpan="5" Grid.Row="1" BorderThickness="1,0,1,1" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" CornerRadius="0,0,5,5"/>
                    <Border Background="{TemplateBinding Background}" Margin="0,1,0,0" Grid.Column="2"/>
                    <Grid  Grid.Column="2" Margin="10,-30,10,-30">
                        <TextBlock HorizontalAlignment="Left" VerticalAlignment="Center" FontSize="{TemplateBinding LegendFontSize}" Foreground="{TemplateBinding LegendForeground}" Text="{TemplateBinding Legend}"/>
                    </Grid>
                    <Border Background="{TemplateBinding Background}" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="3"/>
                    <ContentPresenter
                        Grid.Column="1" 
                        Grid.ColumnSpan="3" 
                        Grid.Row="1"
                        Margin="{TemplateBinding Padding}" 
                        HorizontalAlignment="Stretch"
                        VerticalAlignment="Stretch"
                        Content="{TemplateBinding Content}" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

And class:

Public Class Fieldset
    Inherits ContentControl

    Public Sub New()
    End Sub

    Public Shared ReadOnly LegendProperty As DependencyProperty = DependencyProperty.
        Register("Legend", GetType(String), GetType(Fieldset), New PropertyMetadata(AddressOf OnLegendChanged))

    Private Shared Sub OnLegendChanged(ByVal d As DependencyObject, ByVal e As DependencyPropertyChangedEventArgs)
        Dim fieldset = TryCast(d, Fieldset)
        fieldset.Legend = e.NewValue.ToString()
    End Sub

    Public Property Legend As String
        Get
            Return Me.GetValue(LegendProperty).ToString()
        End Get
        Set(ByVal value As String)
            MyBase.SetValue(LegendProperty, value)
        End Set
    End Property

    Public Shared ReadOnly LegendFontSizeProperty As DependencyProperty = DependencyProperty.
        Register("LegendFontSize", GetType(Double), GetType(Fieldset), New PropertyMetadata(AddressOf OnLegendFontSizeChanged))

    Private Shared Sub OnLegendFontSizeChanged(ByVal d As DependencyObject, ByVal e As DependencyPropertyChangedEventArgs)
        Dim fieldset = TryCast(d, Fieldset)
        fieldset.LegendFontSize = CDbl(e.NewValue)
    End Sub

    Public Property LegendFontSize As Double
        Get
            Return CDbl(Me.GetValue(LegendFontSizeProperty))
        End Get
        Set(ByVal value As Double)
            MyBase.SetValue(LegendFontSizeProperty, value)
        End Set
    End Property

    Public Shared ReadOnly LegendForegroundProperty As DependencyProperty = DependencyProperty.
        Register("LegendForeground", GetType(SolidColorBrush), GetType(Fieldset), New PropertyMetadata(AddressOf OnLegendForegroundChanged))

    Private Shared Sub OnLegendForegroundChanged(ByVal d As DependencyObject, ByVal e As DependencyPropertyChangedEventArgs)
        Dim fieldset = TryCast(d, Fieldset)
        fieldset.LegendForeground = DirectCast(e.NewValue, SolidColorBrush)
    End Sub

    Public Property LegendForeground As SolidColorBrush
        Get
            Return DirectCast(Me.GetValue(LegendForegroundProperty), SolidColorBrush)
        End Get
        Set(ByVal value As SolidColorBrush)
            MyBase.SetValue(LegendForegroundProperty, value)
        End Set
    End Property
End Class

I apologize for the VB.NET code.

As I said, probably lots of better solutions but here goes.

I am aware of two options:

1. Use a free third-party Fieldset control:
   http://www.vectorlight.net/silverlight/controls/fieldset.aspx
   http://www.vectorlight.net/silverlight/controls/fieldset/reference.aspx

2. Consider using a DataForm, with additional form-specific functionality:
   http://www.silverlightshow.net/items/Creating-Rich-Data-Forms-in-Silverlight-3-Introduction.aspx