当前位置：首页 > article >正文

【Maui】注销用户，采用“手势”点击label弹窗选择

article 2025/1/23 5:44:00

文章目录

前言
一、问题描述
二、解决方案
三、软件开发（源码）
- 3.1 方法一：前端绑定
- 3.2 方法二：后端绑定
- 3.3 注销用户的方法
四、项目展示

前言

.NET 多平台应用 UI (.NET MAUI) 是一个跨平台框架，用于使用 C# 和 XAML 创建本机移动和桌面应用。
使用 .NET MAUI，可从单个共享代码库开发可在 Android、iOS、macOS 和 Windows 上运行的应用。

.NET MAUI 是一款开放源代码应用，是 Xamarin.Forms 的进化版，从移动场景扩展到了桌面场景，并从头重新生成了 UI 控件，以提高性能和可扩展性。如果以前使用过 Xamarin.Forms 来生成跨平台用户界面，那么你会注意到它与 .NET MAUI 有许多相似之处。但也有一些差异。通过使用 .NET MAUI，可使用单个项目创建多平台应用，但如果有必要，可以添加特定于平台的源代码和资源。 .NET MAUI 的主要目的之一是使你能够在单个代码库中实现尽可能多的应用逻辑和 UI 布局。

一、问题描述

移动端顶部标题栏，右侧显示用户账户，点击用户账户时，可以调出弹窗切换账号。

二、解决方案

采用手势实现，手势有两种绑定形势，一种在前端采用GestureRecognizers属性；二种在后端采用GestureRecognizers.Add()。

三、软件开发（源码）

3.1 方法一：前端绑定

文件名：MainPage.xaml

            <Label Text="{Binding UserComb}"
                   TextColor="White"
                   HorizontalOptions="Center"
                   VerticalOptions="Center"
                   Grid.Column="2"
                   x:Name="UserNameLabel">
                <Label.GestureRecognizers>
                    <TapGestureRecognizer Tapped="OnUserCombClicked" />
                </Label.GestureRecognizers>
            </Label>

3.2 方法二：后端绑定

文件名：MainPage.xaml.cs

            // 添加点击事件
            var UserTapGestureRecognizer = new TapGestureRecognizer();
            UserTapGestureRecognizer.Tapped += OnUserCombClicked;
            UserNameLabel.GestureRecognizers.Add(UserTapGestureRecognizer);

3.3 注销用户的方法

逻辑层代码没有，全在ViewModel构造函数中，进行了数据初始化。
逻辑如果要使用可以使用如下方法

   private async void OnUserCombClicked(object sender, EventArgs e)
   {
       string[] userOptions = { "注销用户" };
       string selectedOption = await DisplayActionSheet("当前用户", "取消", null, userOptions);
       if (selectedOption == "注销用户")
       {
           Global.LogOut();
           await Navigation.PushAsync(new LoginPage());
       }
   }