Avalonia MessageBox 无边框对话框实现 (自定义控件)

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

接下来介绍实现方式:

因为要全屏的效果,所以它是一个窗口(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

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Avalonia是一种用于构建跨平台用户界面的开源框架。导航控件是Avalonia中的一种重要控件,用于在不同页面之间进行导航操作。 Avalonia的导航控件允许我们在应用程序中创建多个页面,并且能够在这些页面之间进行平滑的切换。导航控件提供了一种结构化的方式来组织和管理应用程序的不同界面。通过导航控件,我们可以通过简单的命令或代码逻辑来实现页面的导航和跳转。 导航控件通常由两个主要组件组成:导航器和页面容器。导航器负责维护当前页面的状态,并提供导航操作的方法和事件。页面容器用于显示和管理不同的页面。当我们进行页面导航时,导航器会负责加载、显示和销毁页面。 对于使用Avalonia导航控件的应用程序,我们可以在页面间使用导航器提供的方法来切换页面,这样可以实现应用程序的整体流程控制。例如,我们可以使用导航控件在登录页面和主页面之间进行导航,或者在主页面的不同子页面之间进行导航。 此外,Avalonia导航控件还可以与其他控件一起使用,以实现更复杂的用户界面。例如,我们可以将导航控件和菜单控件结合使用,以创建具有导航功能的应用程序菜单。我们也可以将导航控件和数据绑定一起使用,以实现基于数据驱动的页面导航。 总而言之,Avalonia导航控件是一种实用的工具,可以帮助我们在Avalonia应用程序中有效地管理和导航页面,提供良好的用户体验。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Rotion_深

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值