激情六月丁香婷婷|亚洲色图AV二区|丝袜AV日韩AV|久草视频在线分类|伊人九九精品视频|国产精品一级电影|久草视频在线99|在线看的av网址|伊人99精品无码|午夜无码视频在线

高校合作1:010-59833514 ?咨詢電話:400-810-1418 服務(wù)與監(jiān)督電話:400-810-1418轉(zhuǎn)接2

你想一套UI,全終端發(fā)布嗎?也許MAUI能幫你

發(fā)布時(shí)間:2024-01-04 11:16:49 瀏覽量:174次

windows 安卓 蘋果預(yù)覽圖

MAUI介紹

隨著MAUI正式版的發(fā)布,一直想用MAUI來寫點(diǎn)東西或者實(shí)現(xiàn)一個(gè)小的項(xiàng)目來學(xué)習(xí)這個(gè)微軟發(fā)布的心再次躁動起來。前面預(yù)覽版也有過搭建測試過,但都因?yàn)槟承┎恢虻腂UG而,進(jìn)行的坎坎坷坷。正式版的發(fā)布,期望能夠使用起來能夠。。。爽爽。。。

好了來看下MAUI的簡介:

.NET 多平臺應(yīng)用程序 UI (.NET MAUI) 是一個(gè)跨平臺框架,用于使用 C# 和 XAML 創(chuàng)建本機(jī)移動和桌面應(yīng)用程序, 使用 .net MAUI,可以開發(fā)可在 Android、iOS、macOS 上運(yùn)行的應(yīng)用,Windows 以及從單個(gè)共享代碼庫運(yùn)行的應(yīng)用。

看到這里大家感覺有點(diǎn)意思了吧。是個(gè)框架,能多端部署應(yīng)用。

Blazor Hybrid 支持內(nèi)置于 .NET 多平臺應(yīng)用 UI (.NET MAUI) 框架。.NET MAUI 包含 BlazorWebView 控件,該控件運(yùn)行將 Razor 組件呈現(xiàn)到嵌入式 Web View 中。通過結(jié)合使用 .NET MAUI 和 Blazor,可以跨移動設(shè)備、桌面設(shè)備和 Web 重復(fù)使用一組 Web UI 組件。

下面來看下我搭建的測試工程:




文件夾說明:

Data 文件夾:接口或者數(shù)據(jù)的訪問層。

Pages 文件夾:存放前端頁面razor。

Platforms文件夾:包含的平臺層。這個(gè)我理解為可創(chuàng)建和運(yùn)行的內(nèi)置平臺層庫。(不知道理解的對嗎?,有不同理解的朋友,可以放在評論區(qū)。)

Resources 資源文件夾,沒啥可說的。

Shared 文件夾: UI共享層。寫過apsx 的可能感覺他是母版頁或者前端框架結(jié)構(gòu)層。

wwwroot 文件夾:發(fā)布資源層。

_Imports.razor 全局控制導(dǎo)入層。


MAUI 數(shù)據(jù)訪問層到UI層流程

我個(gè)人一直認(rèn)為學(xué)習(xí)一項(xiàng)技術(shù),最快的辦法,就是先搞懂流程。大的框架掌握了,去接觸細(xì)節(jié)。從細(xì)節(jié)上完善對流程的認(rèn)識,才是學(xué)好和掌握一項(xiàng)技術(shù)的方式和方法。

  1. 流程那我們就看下它的流程咯。。

我們就看它的數(shù)據(jù)是如何展示出來的:


就看Fetch Data頁面。

打開NavMenu.razor 文件查看他的Href 鏈接



進(jìn)入pages 查看


可以看到原始頁面是從這里聯(lián)過來的。


再看下數(shù)據(jù)是如何過來的:

		<tbody>
			@foreach (var forecast in forecasts)
			{
				<tr>
					<td>@forecast.Date.ToShortDateString()</td>
					<td>@forecast.TemperatureC</td>
					<td>@forecast.TemperatureF</td>
					<td>@forecast.Summary</td>
				</tr>
			}
		</tbody>

是從forecasts 對象來的。

@code {
	private WeatherForecast[] forecasts;

	protected override async Task OnInitializedAsync()
	{
		forecasts = await ForecastService.GetForecastAsync(DateTime.Now);
	}
}

forecasts 是從
ForecastService.GetForecastAsync 獲取來的.看下方法實(shí)現(xiàn):

        private static readonly string[] Summaries = new[]
        {
        "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"
    };

        public Task<WeatherForecast[]> GetForecastAsync(DateTime startDate)
        {
            return Task.FromResult(Enumerable.Range(1, 5).Select(index => new WeatherForecast
            {
                Date = startDate.AddDays(index),
                TemperatureC = Random.Shared.Next(-20, 55),
                Summary = Summaries[Random.Shared.Next(Summaries.Length)]
            }).ToArray());
        }

ForecastService 里的GetForecastAsync 隨機(jī)生成了測試數(shù)據(jù)返回來數(shù)組對象。

總結(jié):



多終端發(fā)布

點(diǎn)擊運(yùn)行選擇運(yùn)行平臺:


等待自動生成多終端的應(yīng)用即可。


下一篇文章:MAUI 做個(gè)安卓APP

可以先看些視頻預(yù)覽效果:

重播
播放
00:00 / 00:00 直播
00:00
進(jìn)入全屏
50
    點(diǎn)擊按住可拖動視頻

    熱門課程推薦

    熱門資訊

    請綁定手機(jī)號

    x

    同學(xué)您好!

    您已成功報(bào)名0元試學(xué)活動,老師會在第一時(shí)間與您取得聯(lián)系,請保持電話暢通!
    確定