在WP8的XAML中的用户控件中设置自定义样式按钮的内容

Question

在WP8 / XAML / C＃中，我为新型按钮创建了一个用户控件。 我添加了一个名为Text的依赖项属性，该属性用于设置按钮的文本。 当我第一次设置按钮时，此方法有效。 例如

<ui:JapanButton x:Name="JapanButton1" Text="Japan"></ui:JapanButton>

文字已正确设置为“日本”。

稍后，当我单击另一个按钮时，我想在C＃中更改此按钮的文本。 例如，我想使用

JapanButton1.Text = "Not Japan";

但是，这不会更新按钮上的文本。 因此，似乎在用户控件的绑定中做错了什么。 这是该控件的XAML和C＃代码。

<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:telerikPrimitives="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Primitives"
    x:Class="UI.JapanButton"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    d:DesignHeight="100" d:DesignWidth="480">
    <UserControl.Resources>
        <telerikPrimitives:NegativeConverter x:Key="NegativeConverter"/>
        <Style x:Key="JapanButtoStyle" TargetType="Button">
            <Setter Property="Background" Value="OrangeRed"/>
            <Setter Property="Foreground" Value="Black"/>
            <Setter Property="Margin" Value="0"/>
            <Setter Property="FontSize" Value="40"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid Margin="{TemplateBinding Margin}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="ButtonBackground" Background="{TemplateBinding Background}" CornerRadius="16" BorderBrush="#434045" BorderThickness="2">
                                <ContentControl x:Name="ContentContainer" Content="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5">
                                    <ContentControl.RenderTransform>
                                        <RotateTransform Angle="{Binding ElementName=RotateTransformButton,Path=Angle,Converter={StaticResource NegativeConverter}}"></RotateTransform>
                                    </ContentControl.RenderTransform>
                                </ContentControl>
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Button x:Name="ButtonJapan" Style="{StaticResource JapanButtoStyle}" Margin="3" Foreground="WhiteSmoke" Background="#9C2222">

        </Button>
    </Grid>
</UserControl>

用户控件后面的C＃代码

using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;

namespace UI
{
    public partial class JapanButton : UserControl
    {
        public static readonly DependencyProperty TextProperty =
            DependencyProperty.Register("Text", typeof(string), typeof(JapanButton), null);

        public string Text
        {
            get { return (string)GetValue(TextProperty); }
            set { SetValue(TextProperty, value); }
        }

        public double FontSize
        {
            get { return (double)GetValue(FontSizeProperty); }
            set { SetValue(FontSizeProperty, value); }
        }

        public JapanButton()
        {
            InitializeComponent();

            Loaded += OnLoaded;
        }

        private void OnLoaded(object sender, RoutedEventArgs routedEventArgs)
        {
            var bindingTitle = new Binding();
            bindingTitle.Source = Text;
            ButtonJapan.SetBinding(ContentControl.ContentProperty, bindingTitle);

            var bindingFontSize = new Binding();
            bindingFontSize.Source = FontSize;
            ButtonJapan.SetBinding(FontSizeProperty, bindingFontSize);
        }
    }
}

非常感谢您的帮助。

Answer 1

您没有使用NotifyPropertyChanged API来告知UI Text或FontSize属性已更改。 我的建议是实际删除绑定，并仅使用更改处理程序按以下方式手动更新控件属性：

http://msdn.microsoft.com/zh-cn/library/ms597502(v=vs.95).aspx

    public static readonly DependencyProperty TextProperty =
        DependencyProperty.Register("Text", typeof(string), typeof(JapanButton), new PropertyMetadata(OnTextChanged));

    private static void OnTextChanged(DependencyProperty d, DependencyPropertyChangedEventArgs e)
    {
        (d as JapanButton).ButtonJapan.Content = Text;
    }