Avalonia MessageBox 无边框对话框实现（自定义控件）-优快云博客

本文链接：https://blog.youkuaiyun.com/rotion135/article/details/139151680

自定义实现一个无边框的对话框，先来看看效果

Demo程序下载（开箱即用）：https://download.youkuaiyun.com/download/rotion135/89048937

接下来介绍实现方式：

因为要全屏的效果，所以它是一个窗口（Window）用灰色透明为底色，内容显示用白色背景

所以其实是用弹出一个窗口，然后点击按钮后，关闭窗口，将选择的结果返回给业务流程

XMAL界面代码：

<Window
    x:Class="LS.AvaloniaClient.UserControls.LSNoBorderMessageBox"
    xmlns="https://github.com/avaloniaui"
    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"
    Title="LSNoBorderMessageBox"
    d:DesignHeight="450"
    d:DesignWidth="800"
    Background="Transparent"
    BorderBrush="Transparent"
    BorderThickness="0"
    CanResize="False"
    ExtendClientAreaChromeHints="NoChrome"
    ExtendClientAreaTitleBarHeightHint="-1"
    ExtendClientAreaToDecorationsHint="True"
    KeyDown="LSNoBorderMessageBox_PreviewKeyDown"
    ShowInTaskbar="False"
    WindowStartupLocation="CenterScreen"
    WindowState="Maximized"
    mc:Ignorable="d">
    <Grid>
        <Border Background="Black" Opacity="0.2" />
        <Grid Height="300" Background="White">
            <Grid
                Width="550"
                Height="300"
                HorizontalAlignment="Center"
                VerticalAlignment="Center">
                <Grid.RowDefinitions>
                    <RowDefinition />
                    <RowDefinition Height="2*" />
                    <RowDefinition />
                </Grid.RowDefinitions>
                <TextBlock
                    x:Name="title"
                    Grid.Row="0"
                    VerticalAlignment="Center"
                    FontSize="40"
                    FontWeight="Bold" />
                <TextBlock
                    x:Name="mesage"
                    Grid.Row="1"
                    VerticalAlignment="Center"
                    FontSize="30"
                    TextWrapping="Wrap" />

                <Grid Grid.Row="2">
                    <Button
                        x:Name="singleBtn"
                        Width="150"
                        Height="50"
                        HorizontalAlignment="Right"
                        VerticalAlignment="Center"
                        Click="ComfirmButton_Click"
                        IsVisible="False">
                        <Button.Template>
                            <ControlTemplate>
                                <Grid>
                                    <Border
                                        Background="SkyBlue"
                                        BorderBrush="Black"
                                        BorderThickness="3" />
                                    <TextBlock
                                        HorizontalAlignment="Stretch"
                                        VerticalAlignment="Stretch"
                                        Text="" />
                                    <TextBlock
                                        HorizontalAlignment="Center"
                                        VerticalAlignment="Center"
                                        FontSize="23"
                                        Text="{Binding $parent[Button].Content}" />
                                </Grid>
                            </ControlTemplate>
                        </Button.Template>
                    </Button>


                    <StackPanel
                        x:Name="doubleBtn"
                        HorizontalAlignment="Right"
                        VerticalAlignment="Center"
                        Orientation="Horizontal">
                        <Button
                            x:Name="comfirmBtn"
                            Width="150"
                            Height="50"
                            HorizontalAlignment="Right"
                            VerticalAlignment="Center"
                            Click="ComfirmButton_Click">
                            <Button.Template>
                                <ControlTemplate>
                                    <Grid>
                                        <Border
                                            Background="SkyBlue"
                                            BorderBrush="Black"
                                            BorderThickness="3" />
                                        <TextBlock
                                            HorizontalAlignment="Stretch"
                                            VerticalAlignment="Stretch"
                                            Text="" />
                                        <TextBlock
                                            HorizontalAlignment="Center"
                                            VerticalAlignment="Center"
                                            FontSize="23"
                                            Text="{Binding $parent[Button].Content}" />
                                    </Grid>
                                </ControlTemplate>
                            </Button.Template>
                        </Button>
                        <Button
                            x:Name="cancelBtn"
                            Width="150"
                            Height="50"
                            Margin="30,0,0,0"
                            HorizontalAlignment="Right"
                            VerticalAlignment="Center"
                            Click="CancelButton_Click">
                            <Button.Template>
                                <ControlTemplate>
                                    <Grid>
                                        <Border
                                            Background="White"
                                            BorderBrush="Black"
                                            BorderThickness="3" />
                                        <TextBlock
                                            HorizontalAlignment="Stretch"
                                            VerticalAlignment="Stretch"
                                            Text="" />
                                        <TextBlock
                                            HorizontalAlignment="Center"
                                            VerticalAlignment="Center"
                                            FontSize="23"
                                            Text="{Binding $parent[Button].Content}" />
                                    </Grid>
                                </ControlTemplate>
                            </Button.Template>
                        </Button>
                    </StackPanel>

                </Grid>
            </Grid>

        </Grid>
    </Grid>
</Window>

CS 代码：

传入标题及内容，显示方式-单按钮/双按钮对应的按钮显示文本

 public partial class LSNoBorderMessageBox : Window
 {
     /// <summary>
     /// 消息结果
     /// </summary>
     public bool DialogResult { get; set; }

     /// <summary>
     /// 消息窗口 
     /// </summary>
     /// <param name="title">标题</param>
     /// <param name="message">消息内容</param>
     /// <param name="showType">显示方式  1- 单按钮   2-双按钮 </param>
     public LSNoBorderMessageBox(string title = "提示", string message = "", string comfirm = "确认", string cancel = "取消", int showType = 1)
     {
         InitializeComponent();

         this.title.Text = title;
         this.mesage.Text = message;
         this.singleBtn.Content = comfirm;
         this.comfirmBtn.Content = comfirm;
         this.cancelBtn.Content = cancel;
         if (showType > 1)
         {
             singleBtn.IsVisible = false;
             doubleBtn.IsVisible = true;
         }
         else
         {
             singleBtn.IsVisible = true;
             doubleBtn.IsVisible = false;
         }
     }

     private void LSNoBorderMessageBox_PreviewKeyDown(object? sender, KeyEventArgs e)
     {
         if (e.Key == Key.Enter)
         {
             DialogResult = true;
             this.Close();
         }
         else if (e.Key == Key.Escape)
         {
             DialogResult = false;
             this.Close();
         }
     }

     private void CancelButton_Click(object? sender, RoutedEventArgs e)
     {
         DialogResult = false;
         this.Close();
     }

     private void ComfirmButton_Click(object? sender, RoutedEventArgs e)
     {
         DialogResult = true;
         this.Close();
     }


    
 }

在项目中的使用示例：

 #region 对话框

 private bool isPopup = false;
 /// <summary>
 /// 弹出单按钮对话框 永远返回true
 /// </summary>
 /// <param name="title"></param>
 /// <param name="message"></param>
 /// <returns></returns>
 public async Task<bool> Popup(string title = "提示", string message = "", string comfirm = "确认")
 {
     if (isPopup)
         return true;
     isPopup = true;
     bool res = true;
     LogOperate.ClickLog(string.Format("弹窗(未点击)-{0}", message));
     LSNoBorderMessageBox box = new LSNoBorderMessageBox(title, message, comfirm, "", 1);
     await box.ShowDialog(VM_MainWindow.Instance.GetMainWindow());
     res = box.DialogResult == true;
     LogOperate.ClickLog(string.Format("弹窗-{0}-{1}", comfirm, message));
     isPopup = false;
     return res;
 }

 /// <summary>
 /// 弹出双按钮对话框
 /// </summary>
 /// <param name="title"></param>
 /// <param name="message"></param>
 /// <returns></returns>
 public async Task<bool> Popup2(string title = "提示", string message = "", string comfirm = "确认", string cancel = "取消")
 {
     bool res = true;

     LogOperate.ClickLog(string.Format("弹窗(未点击)-{0}", message));
     LSNoBorderMessageBox box = new LSNoBorderMessageBox(title, message, comfirm, cancel, 2);
     await box.ShowDialog(VM_MainWindow.Instance.GetMainWindow());
     res = box.DialogResult == true;
     LogOperate.ClickLog(string.Format("弹窗-{0}-{1}", res ? comfirm : cancel, message));
     return res;
 }

 #endregion