定时器Button

 

废话少说，直接上干货！

此Button点击实现发送验证码，为了避免用户重复点击，要求点击一次后锁定60秒；翠花，上代码！

 

 

1，Button样式：

    <Style x:Key="Button_YanzhenStyle" TargetType="Button">
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="BorderBrush" Value="#CED5E0"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Padding" Value="5,3"/>
        <Setter Property="Margin" Value="1"/>
        <Setter Property="MinWidth" Value="20"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static RGBCtrl:RGBGlobalResource.MainBrushKey}}"/>
        <Setter Property="Background" Value="#c2c3c9"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid x:Name="Root" Background="{TemplateBinding Background}">
                        <Border x:Name="backborder" Background="Transparent" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}"/>
                        <Border x:Name="overborder" Margin="{TemplateBinding BorderThickness}" BorderThickness="0" Background="{DynamicResource {x:Static RGBCtrl:RGBGlobalResource.MainBrushKey}}" Visibility="Collapsed" Opacity="0.9"/>
                        <Border x:Name="checkborder" BorderThickness="0" Background="{DynamicResource {x:Static RGBCtrl:RGBGlobalResource.MainBrushKey}}" Visibility="Collapsed"/>
                        <ContentPresenter  Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="Opacity" TargetName="Root" Value="0.4"/>
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Visibility" TargetName="overborder" Value="{StaticResource Visible}"/>
                            <Setter Property="Foreground" Value="White"/>
                        </Trigger>
                        <Trigger Property="IsPressed" Value="True">
                            <Setter Property="Visibility" TargetName="checkborder" Value="{StaticResource Visible}"/>
                            <Setter Property="Visibility" TargetName="backborder" Value="{StaticResource Collapsed}"/>
                            <Setter Property="Foreground" Value="White"/>
                        </Trigger>
                    </ControlTemplate.Triggers>

                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

 

2，前台代码：

                                <Button Height="30" x:Name="Button_yanzhen" Click="Button_yanzhen_Click" Content="获取验证码" Margin="14,0,0,0"  Style="{StaticResource Button_YanzhenStyle}"/>

 

 

3，后台代码：

        private DispatcherTimer innerTimer;

 private void SetTimer()
        {
            this.innerTimer = new DispatcherTimer(TimeSpan.FromSeconds(1.0),
                DispatcherPriority.Loaded, new EventHandler(this.InnerTimerCallback), this.Dispatcher);
            this.innerTimer.Start();
        }

 private void Button_yanzhen_Click(object sender, RoutedEventArgs e)
        {

            if(!IsWait)
            {

                if (CheckIsEmpty(IconTextBox_iphone.Text) || !CheckIsNumber(IconTextBox_iphone.Text) || !CheckIsPhoneNum(IconTextBox_iphone.Text))
                {
                    MessageToolTip.Show("请先输入正确的手机号码。");
                    return;
                }
                else
                {
                    LotteryApp.CurLotteryApp.RequestServer_GetVCode(new PostReqesutCallBackInfo(ResponseServer, null));
                }
                Button_yanzhen.IsEnabled = false;
                IsWait = true;
                SetTimer();
            }
        }

        private void InnerTimerCallback(object obj, EventArgs arg)
        {
            TimeWait();
        }

        int i = 59;
        private void TimeWait()
        {
            this.Dispatcher.BeginInvoke(
                new Action(() =>
                {
                    Button_yanzhen.Content = "等待（" + i.ToString() + " S)";
                    if (i == 0)
                    {
                        Button_yanzhen.IsEnabled = true;
                        Button_yanzhen.Content = "获取验证码";
                        this.innerTimer.Stop();
                        IsWait = false;
                        i = 59;
                        return;
                    }
                }
                ));
            i--;
          
        }

 

4，理清思路

  4.1定义一个定时器，一秒钟执行一次刷新按钮内容的方法；

 private DispatcherTimer innerTimer;
  private void SetTimer()
        {
            this.innerTimer = new DispatcherTimer(TimeSpan.FromSeconds(1.0),
                DispatcherPriority.Loaded, new EventHandler(this.InnerTimerCallback), this.Dispatcher);
            this.innerTimer.Start();
        }

 

  4.2 定时器执行方法：

     private void InnerTimerCallback(object obj, EventArgs arg)
        {
            TimeWait();
        }

        int i = 59;
        private void TimeWait()
        {
            this.Dispatcher.BeginInvoke(
                new Action(() =>
                {
                    Button_yanzhen.Content = "等待（" + i.ToString() + " S)";
                    if (i == 0)
                    {
                        Button_yanzhen.IsEnabled = true;
                        Button_yanzhen.Content = "获取验证码";
                        this.innerTimer.Stop();
                        IsWait = false;
                        i = 59;
                        return;
                    }
                }
                ));
            i--;
           
        }

 

这里要注意以下，定时器创建一个线程，要在这个线程中刷新主线程下创建的UI,这涉及到跨线程操作，用到：

this.Dispatcher.BeginInvoke(
                new Action(() =>
                {
                    Button_yanzhen.Content = "等待（" + i.ToString() + " S)";
                    if (i == 0)
                    {
                        Button_yanzhen.IsEnabled = true;
                        Button_yanzhen.Content = "获取验证码";
                        this.innerTimer.Stop();
                        IsWait = false;
                        i = 59;
                        return;
                    }
                }
                ));

 

想要深入了解的点击 --> WPF -- 线程闲篇

 

5，看看效果;

 

 

 

 

点击后，实现倒计时

当然，后台代码有点乱，后期再做整理！