当前位置：文江博客话题详情

不同的按钮状态使用不同的字体

发布于 2024-12-18 16:37:37 字数 122 浏览 6 评论 0原文

我在 Silverlight 中使用切换按钮控件。请告诉我如何为其选中和未选中状态使用不同的字体系列。我尝试使用 Expression Blend 编辑切换按钮模板，但无法使其工作。请帮忙。

谢谢，奥马尔·贾韦德

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

风柔一江水 2024-12-25 16:37:37

您可以使用转换器并将 Button 内 TextBlock 的 FontFamily 属性绑定到按钮的 IsChecked 状态。

<ToggleButton
    x:Name="tb">
    <ToggleButton.Resources>
        <converters:BooleanToFontFamily
            x:Key="BooleanToFontFamily" />
    </ToggleButton.Resources>
    <TextBlock
        FontFamily="{Binding IsChecked, ElementName='tb', Converter={StaticResource BooleanToFontFamily}, ConverterParameter='Segoe WP Semibold,Segoe WP SemiLight'}"
        Text="Some Text" />
</ToggleButton>

C# 中的转换器大致如下所示：

public class BooleanToFontFamily : IValueConverter
{
    public object Convert(
        object value,
        Type targetType,
        object parameter,
        CultureInfo culture)
    {
        var b = (bool)value;
        var families = ((string)parameter).Split(',');
        return new FontFamily(b ? families[1] : families[0]);
    }

    public object ConvertBack(
        object value,
        Type targetType,
        object parameter,
        CultureInfo culture)
    {
        throw new NotSupportedException();
    }
}

虽然就我个人而言 - 我会继续尝试使该模板正常工作 - 可能与 VisualStateManager 处理到“已检查”状态的转换有关。

You can use a converter and bind the FontFamily property of the TextBlock inside the Button to the IsChecked state of the button.

<ToggleButton
    x:Name="tb">
    <ToggleButton.Resources>
        <converters:BooleanToFontFamily
            x:Key="BooleanToFontFamily" />
    </ToggleButton.Resources>
    <TextBlock
        FontFamily="{Binding IsChecked, ElementName='tb', Converter={StaticResource BooleanToFontFamily}, ConverterParameter='Segoe WP Semibold,Segoe WP SemiLight'}"
        Text="Some Text" />
</ToggleButton>

And the converter in C# would look rouguhly like this:

public class BooleanToFontFamily : IValueConverter
{
    public object Convert(
        object value,
        Type targetType,
        object parameter,
        CultureInfo culture)
    {
        var b = (bool)value;
        var families = ((string)parameter).Split(',');
        return new FontFamily(b ? families[1] : families[0]);
    }

    public object ConvertBack(
        object value,
        Type targetType,
        object parameter,
        CultureInfo culture)
    {
        throw new NotSupportedException();
    }
}

Though personally - I would keep trying to get that template to work - probably something to do with the VisualStateManager handling the transition to "Checked" state.

回复收藏 0 原文

静水深流 2024-12-25 16:37:37

最简单的方法是使用内置行为 ChangePropertyAction。由于您已经提到您已安装了 Expression Blend，因此只需转到资源面板并输入“ChangePropertyAction”，然后将此行为拖放到 ToggleButton 顶部即可。

之后，您只需指定在哪个事件触发后您想要更改什么。有关如何使用此行为的更多信息，请参阅这篇文章。

一些示例代码

    <ToggleButton Content="ToggleButton" FontFamily="Arial" HorizontalAlignment="Center" VerticalAlignment="Center">
        <i:Interaction.Triggers>
            <i:EventTrigger EventName="Checked">
                <ei:ChangePropertyAction PropertyName="FontFamily">
                    <ei:ChangePropertyAction.Value>
                        <FontFamily>Arial Black</FontFamily>
                    </ei:ChangePropertyAction.Value>
                </ei:ChangePropertyAction>
            </i:EventTrigger>
            <i:EventTrigger EventName="Unchecked">
                <ei:ChangePropertyAction PropertyName="FontFamily">
                    <ei:ChangePropertyAction.Value>
                        <FontFamily>Arial</FontFamily>
                    </ei:ChangePropertyAction.Value>
                </ei:ChangePropertyAction>
            </i:EventTrigger>
        </i:Interaction.Triggers>
    </ToggleButton>

The easist way would be to use a built-in behaivor ChangePropertyAction. Since you have mentioned that you have Expression Blend installed, just go to the Asset Panel and type in 'ChangePropertyAction', then drag and drop this behavior on top of your ToggleButton.

After that you just need to specify after which event fires you want to change what. For more information regarding how to use this behavior, please see this post.

Some example code

    <ToggleButton Content="ToggleButton" FontFamily="Arial" HorizontalAlignment="Center" VerticalAlignment="Center">
        <i:Interaction.Triggers>
            <i:EventTrigger EventName="Checked">
                <ei:ChangePropertyAction PropertyName="FontFamily">
                    <ei:ChangePropertyAction.Value>
                        <FontFamily>Arial Black</FontFamily>
                    </ei:ChangePropertyAction.Value>
                </ei:ChangePropertyAction>
            </i:EventTrigger>
            <i:EventTrigger EventName="Unchecked">
                <ei:ChangePropertyAction PropertyName="FontFamily">
                    <ei:ChangePropertyAction.Value>
                        <FontFamily>Arial</FontFamily>
                    </ei:ChangePropertyAction.Value>
                </ei:ChangePropertyAction>
            </i:EventTrigger>
        </i:Interaction.Triggers>
    </ToggleButton>

回复收藏 0 原文

~没有更多了~