开发者

Silverlight Change Style property from referencing object

I have a <Style x:Key="ToggleButtonStyle" TargetType="ToggleButton"> and it has a TextBlock in it. I want a ToggleButton to be able to change the Text property of the TextBlock when it references the style. How can I do this?

My style is as follows

 <Style x:Key="ReturnToggleButton" TargetType="ToggleButton">
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="BorderBrush" Value="#FF999999"/>
    <Setter Property="Background" Value="#FFECECEB"/>
    <Setter Property="Foreground" Value="#FF999999"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Padding" Value="3"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ToggleButton">
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Center" Background="Transparent">
                    <VisualStateManager.VisualStateGroups>
                     ...   
                    </VisualStateManager.VisualStateGroups>
                    <TextBlock x:Name="text1" TextWrapping="Wrap" Text="Open" Foreground="#FF35393D" HorizontalAlignment="Left" VerticalAlignment="Top" FontSize="10" FontFamily="Verdana"/>
                    <Border x:Name="border1" BorderBrush="#FF999999" BorderThickness="1" CornerRadius="1" Height="14" Width="36" Margin="6,0" Background="Transparent">
                                    <TextBlock x:Name="text2 TextWrapping="Wrap" Text="9:30" Foreground="#FF999999" HorizontalAlignment="Left" VerticalAlignment="Top" FontSize="10" Fon开发者_高级运维tFamily="Verdana"/>
                </StackPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

I need to be able to set the Text property of text1 and text2


This the approach I would take.

Create a new "Silverlight Templated Control" called "DualTextToggleButton" and change the base class from "Control" to "ToggleButton".

Add two DependencyProperties called "Text1" and "Text2" (you probably want to use better names than than I'm chosing here). Now open the Themes/Generic.xaml file and replace the Default style for DualTextToggleButton with style you are currently using. Like so:-

 <Style TargetType="local:DualTextToggleButton">
    <Setter Property="Text1" Value="Open" />
    <Setter Property="Text2" Value="9:30" />
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="BorderBrush" Value="#FF999999"/>
    <Setter Property="Background" Value="#FFECECEB"/>
    <Setter Property="Foreground" Value="#FF999999"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Padding" Value="3"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ToggleButton">
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Center" Background="Transparent">
                    <VisualStateManager.VisualStateGroups>
                     ...   
                    </VisualStateManager.VisualStateGroups>
                    <TextBlock x:Name="text1" TextWrapping="Wrap" Text="{TemplateBinding Text1}" Foreground="#FF35393D" HorizontalAlignment="Left" VerticalAlignment="Top" FontSize="10" FontFamily="Verdana"/>
                    <Border x:Name="border1" BorderBrush="#FF999999" BorderThickness="1" CornerRadius="1" Height="14" Width="36" Margin="6,0" Background="Transparent">
                                    <TextBlock x:Name="text2 TextWrapping="Wrap" Text="{TemplateBinding Text2}" Foreground="#FF999999" HorizontalAlignment="Left" VerticalAlignment="Top" FontSize="10" FontFamily="Verdana"/>
                </StackPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Note the use of TemplateBinding and the addition of Text1 and Text2 setters. Your template could probably do with more TemplateBinding usage where appropriate, at the moment most of the setters are doing absolutely nothing since the ControlTemplate ignores them.

Now you can create an instance of this control in Xaml like this:-

 <local:DualTextToggleButton Text1="Closed" Text2="17:00" />

Or you do this via Style:-

 <Style x:Key="SomeDualTextToggleButtonStyle">
    <Setter Property="Text1" Value="Closed" />
    <Setter Property="Text2" Value="17:00" />
 </Style>

Or you could use DataBinding:-

 <ListBox ItemsSource="{Binding ListOfModelItems}">
     <ListBox.ItemStyle>
        <DataTemplate>
            <local:DualTextToggleButton Text1="{Binding State}" Text2="{Binding TimeOfDay}"
                IsChecked="{Binding Enabled, Mode=TwoWay}" />
        </DataTemplate>  
     </ListBox.ItemStyle>
 </ListBox ItemsSource="{Binding ListOfModelItems}">
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜