MAUI之Android及Windows跨平台开发之初体验

项目文件

点击此处下载 源代码

注：

• 本项目利用VS2022开发环境、.NET9框架
  
• Android框架:
  最小框架：Android9.0(API Level 28 - Pie)
  目的框架：Android15.0(API Level 35)
  
• Windows框架：
  最小框架：10.0.17763.0
  目的框架：10.0.19041.0
  
• 如无法编译等情况出现，请确保VS2022是最新的且MAUI工作负载等环境已安装
  
• VS2022在调试Windows桌面应用程序(包罗MAUI、WinUI3、UWP)时，暂不支持设计器视图，请利用热重载功能
  

配置页面

MainPage XAML代码

1. <?xml version="1.0" encoding="utf-8" ?>
2. <ContentPage
3.     x:
4.     xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
5.     xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
6.     <ContentPage.Resources>
7.         <x:String x:Key="WebSite">https://www.cnblogs.com/cncc</x:String>
8.     </ContentPage.Resources>
9.     <Grid>
10.         <Grid.RowDefinitions>
11.             <RowDefinition Height="50" />
12.             <RowDefinition Height="5" />
13.             <RowDefinition Height="40" />
14.             <RowDefinition Height="5" />
15.             <RowDefinition Height="*" />
16.         </Grid.RowDefinitions>
17.         <Grid Grid.Row="0" Margin="5">
18.             <Grid.ColumnDefinitions>
19.                 <ColumnDefinition Width="1*" />
20.                 <ColumnDefinition Width="5" />
21.                 <ColumnDefinition Width="1*" />
22.                 <ColumnDefinition Width="5" />
23.                 <ColumnDefinition Width="1*" />
24.             </Grid.ColumnDefinitions>
25.             <Button
26.                 Grid.Column="0"
27.                 Clicked="Button1_Clicked"
28.                 Text="主页" />
29.             <Button
30.                 Grid.Column="2"
31.                 Clicked="Button2_Clicked"
32.                 IsEnabled="{Binding Source={x:Reference CnxyWebView}, Path=CanGoBack}"
33.                 Text="后退" />
34.             <Button
35.                 Grid.Column="4"
36.                 Clicked="Button3_Clicked"
37.                 IsEnabled="{Binding Source={x:Reference CnxyWebView}, Path=CanGoForward}"
38.                 Text="前进" />
39.         </Grid>
40.         <Entry
41.             x:Name="UrlLabel"
42.             Grid.Row="2"
43.             Margin="5,0,5,0"
44.             IsReadOnly="True"
45.             SemanticProperties.HeadingLevel="Level1"
46.             Text="{StaticResource WebSite}" />
47.         <ScrollView Grid.Row="4">
48.             <WebView
49.                 x:Name="CnxyWebView"
50.                 Navigated="CnxyWebView_Navigated"
51.                 Source="{StaticResource WebSite}"
52.                 VerticalOptions="Fill" />
53.         </ScrollView>
54.     </Grid>
55. </ContentPage>

复制代码

Toast关照

利用了CommunityToolkit.Maui类库(此项针对Android有效)，需在MauiProgram.cs文件中配置，代码如下：

1. //必须先在Nuget安装CommunityToolkit.Maui包才能使用
2. //增加了启用Toast通知，使用CommunityToolkit.Maui命名空间
3. using CommunityToolkit.Maui;
4. using Microsoft.Extensions.Logging;
6. namespace MauiApp1
7. {
8.     public static class MauiProgram
9.     {
10.         public static MauiApp CreateMauiApp()
11.         {
12.             var builder = MauiApp.CreateBuilder();
13.             builder
14.                 //增加此行代码
15.                 .UseMauiCommunityToolkit()
17.                 .UseMauiApp<App>()
18.                 .ConfigureFonts(fonts =>
19.                 {
20.                     fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
21.                     fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
22.                 });
24. #if DEBUG
25.                     builder.Logging.AddDebug();
26. #endif
28.             return builder.Build();
29.         }
30.     }
31. }

复制代码

增长MyToast.cs文件，用以实际的关照调用，代码如下：

1. using CommunityToolkit.Maui.Alerts;
2. using CommunityToolkit.Maui.Core;
4. namespace MauiApp1
5. {
6.     internal class MyToast
7.     {
8.         public static void Show(string message)
9.         {
10.             var toast = Toast.Make(message, ToastDuration.Long);
11.             toast.Show();
12.         }
13.     }
14. }

复制代码

MainPage后置代码

1. namespace MauiApp1
2. {
3.     public partial class MainPage : ContentPage
4.     {
5.         public MainPage()
6.         {
7.             InitializeComponent();
8.         }
9.         private BroswerStatus broswerStatus;
10.         private void Announce(WebNavigationResult result)
11.         {
12.             string message = string.Empty;
13.             bool netWorkNoError = false;
14.             if ((netWorkNoError = result == WebNavigationResult.Success) && broswerStatus == BroswerStatus.Home)
15.             {
16.                 message = "已回到主页";
17.             }
18.             else
19.             {
20.                 if(!netWorkNoError)message = "无法网络，请检查！";
21.             }
22.             if(string.IsNullOrEmpty(message)) return;
23.             MyToast.Show(message);
24.             broswerStatus = BroswerStatus.None;
25.         }
26.         private void Button1_Clicked(object sender, EventArgs e)
27.         {
28.             if (!(this.Resources["WebSite"] is string webSite)) return;
29.             broswerStatus = BroswerStatus.Home;
30.             CnxyWebView.Source = webSite;
31.         }
33.         private void Button2_Clicked(object sender, EventArgs e)
34.         {
35.             if (!CnxyWebView.CanGoBack) return;
36.             broswerStatus = BroswerStatus.Back;
37.             CnxyWebView.GoBack();
38.         }
40.         private void Button3_Clicked(object sender, EventArgs e)
41.         {
42.             if (!CnxyWebView.CanGoForward) return;
43.             broswerStatus = BroswerStatus.Forward;
44.             CnxyWebView.GoForward();
45.         }
47.         private void CnxyWebView_Navigated(object sender, WebNavigatedEventArgs e)
48.         {
49.             UrlLabel.Text = e.Url;
50.             Announce(e.Result);
51.         }
53.         enum BroswerStatus
54.         {
55.             None,
56.             Home,
57.             Back,
58.             Forward
59.         }
60.     }
61. }

复制代码

VS2022编辑界面

Android调试界面

利用vivo x fold 3物理装备，如下：
外屏：

--------------------------分割线--------------------------
内屏：

Windows调试界面

可安装或可执行程序

Windows桌面应用程序: win10-x64.7z

密码:30qn

Android 程序包: net9.0-android35.0.7z

密码:1n8z

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。

继续阅读请点击广告