在XAML WP8中的用户控件中的自定义按钮中显示Click事件

时间:2013-11-20 09:24:52

标签: c# xaml windows-phone-8

我有一个带有自定义/自定义样式按钮的用户控件。到目前为止,我使用Tap事件来调用click操作。但是,Tap似乎“太慢了”。因此,当我连续两次单击按钮太快时,只有第一次点击才会触发事件。当我在屏幕上有两个按钮并且我连续点击它们时,会发生同样的情况。我想这与Tap事件有关(似乎只有当我的手指从屏幕上抬起时才会触发)。

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

这就是我想在用户控件中公开按钮的Click事件但不知道如何操作的原因。

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

以下是我目前的情况:

<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);
        }
    }
}

1 个答案:

答案 0 :(得分:5)

首先,在UserControl中创建自定义Click事件:

public event EventHandler Click;

然后,订阅按钮的Click事件:

public JapanButton()
{
    InitializeComponent();

    Loaded += OnLoaded;

    ButtonJapan.Click += ButtonClick;
}

最后,在事件处理程序中,引发自定义Click事件:

private void ButtonClick(object sender, RoutedEventArgs e)
{
    var eventHandler = this.Click;

    if (eventHandler != null)
    {
        eventHandler(this, e);
    }
}