WPF自定义MessageBox控件及使用Storyboard动画

WPF自定义MessageBox控件及使用Storyboard动画

定义一个自己的消息类(MyMessageBox)，并建立与系统MessageBox.Show()方法相同的几个方法

本人只用到2个方法，如下：

XAML:

动画：

        <Storyboard x:Key="startanimation" Storyboard.TargetName="gird">
            <DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="00:00:00" From="1.0" To="0.0"></DoubleAnimation>
        </Storyboard>
        <Storyboard x:Key="stopanimation" Storyboard.TargetName="gird">
            <DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="00:00:00" From="0.0" To="1.0"></DoubleAnimation>
        </Storyboard>

<Grid>
        <Grid x:Name="grid1">
            <Grid.RowDefinitions>
                <RowDefinition Height="1*"></RowDefinition>
                <RowDefinition Height="4*"></RowDefinition>
                <RowDefinition Height="2*"></RowDefinition>
            </Grid.RowDefinitions>
            <Grid Grid.Row="0" Background="#F5A623">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding MessagesCaption}" VerticalAlignment="Center" Width="365" FontSize="14" Foreground="#B9FFFFFF" FontFamily="微软雅黑" Padding="20,0,0,0"></TextBlock>
                    <Image Width="20" Height="20" ToolTip="关闭">
                        <Image.Resources>
                            <Style TargetType="{x:Type Image}">
                                <Setter Property="Source" Value="../Resource/Image/close.png"></Setter>
                                <Style.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter Property="Source" Value="../Resource/image/close1.png"></Setter>
                                    </Trigger>
                                </Style.Triggers>
                            </Style>
                        </Image.Resources>
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="MouseLeftButtonDown">
                                <i:InvokeCommandAction Command="{Binding CloseWindowCommand}" CommandParameter="{Binding ElementName=mymessage}"></i:InvokeCommandAction>
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </Image>
                </StackPanel>
            </Grid>
            <Grid Grid.Row="1" Background="#FBFBFB">
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
                    <TextBlock Text="{Binding MessagesText}" Foreground="#F5A623" FontSize="14" FontFamily="微软雅黑" VerticalAlignment="Center" Margin="0,0,20,0"></TextBlock>
                    <Image Source="../Resource/Image/question.png" Width="40" Height="40"></Image>
                </StackPanel>
            </Grid>
            <Grid Grid.Row="2" Background="#F8F8F8">
                <StackPanel  Orientation="Horizontal" HorizontalAlignment="Center">
                    <Button Content="是(Y)" Style="{StaticResource btn}" Click="Sure_Click"></Button>
                    <Button Content="否(N)" Style="{StaticResource btn}" Click="No_Click" Margin="20,0,20,0"></Button>
                    <Button Content="取消"  Style="{StaticResource btn}" Click="Cancel_Click"></Button>
                </StackPanel>
            </Grid>
        </Grid>

        <Grid x:Name="grid2">
            <Grid.RowDefinitions>
                <RowDefinition Height="1*"></RowDefinition>
                <RowDefinition Height="4*"></RowDefinition>
                <RowDefinition Height="2*"></RowDefinition>
            </Grid.RowDefinitions>
            <Grid Grid.Row="0" Background="#F5A623">
                <StackPanel Orientation="Horizontal">
                    <TextBlock VerticalAlignment="Center" Width="365" FontSize="14" Foreground="#B9FFFFFF" FontFamily="微软雅黑" Padding="20,0,0,0"></TextBlock>
                    <Image Width="20" Height="20" ToolTip="关闭">
                        <Image.Resources>
                            <Style TargetType="{x:Type Image}">
                                <Setter Property="Source" Value="../Resource/Image/close.png"></Setter>
                                <Style.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter Property="Source" Value="../Resource/image/close1.png"></Setter>
                                    </Trigger>
                                </Style.Triggers>
                            </Style>
                        </Image.Resources>
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="MouseLeftButtonDown">
                                <i:InvokeCommandAction Command="{Binding CloseWindowCommand}" CommandParameter="{Binding ElementName=mymessage}"></i:InvokeCommandAction>
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </Image>
                </StackPanel>
            </Grid>
            <TextBlock Grid.Row="1" Grid.RowSpan="2" Text="{Binding MessagesText}" Foreground="#F5A623" FontSize="14" FontFamily="微软雅黑" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock>
        </Grid>
    </Grid>

后台：

        private void WindowLoaded(Window win)
        {
            fields.MessagesText = MyMessageBoxShow.messageboxtext;
            fields.MessagesCaption = MyMessageBoxShow.caption;
            int i = MyMessageBoxShow.i;

            for(int j = 1; j <= 2; j++)
            {
                if (j == i)
                    continue;
                Storyboard storyboard = Resources["startanimation"] as Storyboard;
                storyboard.SetCurrentValue(Storyboard.TargetNameProperty, $"grid{j}");
                BeginStoryboard(Resources["startanimation"] as Storyboard);
            }
        }

        private void Sure_Click(object sender, RoutedEventArgs e)
        {
            MyMessageBoxShow.mgbutton = MessageBoxResult.OK;
            this.Close();
        }

        private void No_Click(object sender, RoutedEventArgs e)
        {
            MyMessageBoxShow.mgbutton = MessageBoxResult.No;
            this.Close();
        }

        private void Cancel_Click(object sender, RoutedEventArgs e)
        {
            MyMessageBoxShow.mgbutton = MessageBoxResult.Cancel;
            this.Close();
        }

消息类：

public class MyMessageBoxShow

{

 

        public MyMessageBoxShow()
        {

        }
        public static MessageBoxResult Show(Window owner, string messageboxtext, string caption)
        {
            MyMessageBoxShow.i = 1;
            MyMessageBoxShow.messageboxtext = messageboxtext;
            MyMessageBoxShow.caption = caption;            

            MyMessageBox mgBox = new MyMessageBox();
            mgBox.Owner = owner;
            mgBox.ShowDialog();
            return mgbutton;
        }

        private static void Show(string messageboxtext)
        {
            MyMessageBoxShow.i = 2;
            MyMessageBoxShow.messageboxtext = messageboxtext;
        }

}

 

效果：

注意：

注意消息标题的绑定和文本内容的绑定需要在窗口show之前，也就是windowload()方法里面进行绑定

本人只写了一部分，后续有时间再进行补充，有不懂的朋友可加qq1733318151备注，相互交流，谢谢关注！