责任编辑主要如是说采用 MAUI 合作开发Android应用领域时,怎样更改和处置 UI 天然资源:应用领域英语名称,辅助工具栏,主轴色调,输入框,闪屏。
1. 大背景
平时较为讨厌看短篇小说,但不晓得从何时能起,早已找不出一个单纯的邻近地区短篇小说随身听了。也能认知,即便无法只靠关爱水力,新浪网天然资源也即使了,我邻近地区的 TXT 你也给我加电视广告也就吓人了吧。单纯的随身听却是仅靠自己了,以后用 AppCan 和 APICloud 的混和合作开发设计做过。上周在介绍 MAUI,就继续做个小辅助工具权当吧。标识符带队没写,但此基础 UI 和辅助工具栏什么的要给先搞出来,脸面工夫我先做足咯。
2. 天然资源增设
2.1 工程项目建立
工程项目建立他们这儿优先选择 .NET MAUI Blazor 应用领域,即使我真的采用 Web 控制技术来设计 UI 界直面我而言会更方便快捷和随手许多。这儿须要附加特别注意的是,工程项目英语名称这儿可很大千万别用英语,要不然是不是出的错你都不晓得。
工程项目建立2.2 应用领域英语名称
对应用领域英语名称的修正,如想表明英语,而不是建立时增设的英语,则只须要在特性中的“已共享资源 MAUI”进行修正方可。
应用领域程序的 ID 即是聚合的Android包 ID,版也会在 APK 重要信息中展现。
应用领域此基础重要信息接着聚合应用领域,采用Android电子设备增容他们可以辨认出,包ID 和英语名称早已修正顺利完成。
APK另外在工程项目文件中,也有几个配置重要信息,他们可以一起改掉:
<!– Display name –><ApplicationTitle>悦读</ApplicationTitle><!– App Identifier –><ApplicationId>com.sangsq.yuereader</ApplicationId>如果你通过 Windows 增容界面,想修正应用领域英语名称和包重要信息,则须要在Platforms/windows目录下增设Package.appxmanifest。
Windows2.3 应用领域辅助工具栏
MAUI APP 的应用领域辅助工具栏增设天然资源是在Resources/AppIcon目录下,他们可以看到这儿采用的是 SVG 矢量图片格式:
•appicon.svg 纯色辅助工具栏大背景•appiconfg.svg 辅助工具栏的主体内容
借助 SVG 图像的矢量特性,无需维护特定于平台或特定于电子设备的各种不同分辨率的图像。他们可以采用 Adobe illustrator 来设计,最后导出 SVG 格式方可。
根据我让老婆调整了 N 版设计的经验来看,这个辅助工具栏的主体最好是上下左右各留出 25% 的空间,这样最后辅助工具栏展现的效果才会好许多。
appicon更改辅助工具栏当然是最简单的了,只须要修正辅助工具栏文件方可。
在工程项目文件中他们可以看到,关于 APP 辅助工具栏这一块的配置:
<!– App Icon –><MauiIconInclude=“Resources\AppIcon\appicon.svg”ForegroundFile=“Resources\AppIcon\appiconfg.svg”Color=“#512BD4”/>上面的 Color 是大背景重新着色用的,他们这儿没有用到,可以直接去掉。
2.4 应用领域闪屏
在工程项目文件中闪屏配置重要信息如下:
<!– Splash Screen –><MauiSplashScreenInclude=“Resources\Splash\splash.svg”Color=“#512BD4”BaseSize=“128,128”/>上面的 BaseSize 是为了在不同屏幕尺寸和密度的电子设备上进行适应,其取值为 8 的倍数。系统为适用于不同的屏幕,会进行缩放。当然,也可以将 Resize 增设为 false 不进行自动调整。
这儿他们可以直接采用 App 的辅助工具栏来增设,更改天然资源路径。Color 也更改为应用领域的主轴色。
<!– Splash Screen –><MauiSplashScreenInclude=“Resources\AppIcon\appiconfg.svg”Color=“#F80”BaseSize=“128,128”/>特别注意:只更改配置重要信息,特别是修正天然资源文件的情况下,增容可能会出现编译的失败,可以清理后重试;调试过程中,真机的闪屏可能不会表明出 appiconfg.svg 图片,重新打开一下应用领域就可以看到其实早已更改顺利完成了。
2.5 沉浸式输入框
Android的沉浸式输入框颜色增设默认是 MAUI 的蓝色,增设文件在 Platforms\Android\Resources\values\colors.xml ,这个 xml 文件内容如下:
<?xml version=“1.0” encoding=“utf-8”?><resources><colorname=“colorPrimary”>#512BD4</color><colorname=“colorPrimaryDark”>#2B0B98</color><colorname=“colorAccent”>#2B0B98</color></resources>这儿他们将 colorPrimary 改为他们应用领域的主体颜色方可。其他两个是稍微深色一点的色调,输入框采用第二个颜色 Dark。
输入框