超越基础知识：.NET MAUI中UI处理的最佳做法

目录

1. 想要添加边框？不使用框架——使用边框

2. 使用Horizontal/VerticalStackLayout而不是StackLayout

3. 避免在Horizontal/VerticalStackLayout中使用AndExpand

4.不要使用RelativeLayout

5. 桌面应用程序：需要更多信息？使用工具提示增强

6. 在不同的地方使用相同的十六进制颜色？将它们添加到Color.xaml

---

要从Xamarin Forms迁移到.NET MAUI？这些提示是给你的！

👋 嗨，你好！你准备好学习一些令人兴奋的.NET MAUI最佳做法提示了吗？无论你是具有使用Xamarin Forms开发应用程序的经验，还是刚刚开始使用.NET MAUI，以下内容都对你有用。

在本文中，我将为你提供改进.NET MAUI应用开发实践的提示。这些见解基于官方文档的更新，其中包括有趣的改进。🚀我们的目标是让我们的应用程序保持其质量，同时提高性能并简化我们作为开发人员的工作。🛠️我在这里分享一些技巧，让你在.NET MAUI领域保持领先地位。准备好探索了吗？💪

1. 想要添加边框？不使用框架——使用边框

在Xamarin Forms中，框架主要用于添加边框。但是，在.NET MAUI中，专门为此目的引入了一个名为Border的新控件。

那么，什么时候适合使用边框，什么时候应该使用框架？🤔官方文档指出，为将应用程序从Xamarin.Forms转换到.NET MAUI的用户维护Frame。对于新的开发项目，建议使用边境管制。

以下是我更喜欢使用边框而不是框架的几个原因：

• 四舍五入的灵活性：如果要设置一个值以分别对每条边进行倒圆角，则可以这样做。
• 边框形状的自由：您可以控制边缘的形状。例如，您可以使用RoundRectangle等形状（如说明性图像所示），或者尝试使用其他形状（如折线）以及您可以在此处看到的其他形状。

如此提示的主图所示，边框使用起来非常简单。为了更深入地了解Border，我建议阅读.NET MAUI中的Border一文。

2. 使用Horizontal/VerticalStackLayout而不是StackLayout

如果你熟悉Xamarin Forms，则你已经知道StackLayout的工作原理。默认情况下，方向是垂直的，但可以使用Orientation属性将其设置为水平。在.NET MAUI中，相同的概念也适用于StackLayout。

除了现有布局之外，还有一些不需要使用Orientation属性的新布局。您可以直接使用VerticalStackLayout或HorizontalStackLayout。根据您喜欢的方向，我建议您考虑这些新布局之一！

我建议你通过阅读.NET MAUI中的布局选项一文来了解有关这些布局的详细信息。

3. 避免在Horizontal/VerticalStackLayout中使用AndExpand

在Xamarin Forms中，我们使用Horizontal/VerticalOptions等扩展属性。这些属性定义对齐首选项并包含一组值，其中一些值以后缀“AndExpand”结尾。例如，我们有CenterAndExpand，Start和StartEndExpand，等等。

但是，在.NET MAUI中，“AndExpand”后缀不再存在。它只会响应没有后缀的值，例如Center或Start。

如果使用带有“AndExpand”后缀的值，会发生什么情况？🤔.NET MAUI仅忽略后缀并考虑词根。例如，如果你写：

<VerticalStackLayout HorizontalOptions="CenterAndExpand">
      ...
</VerticalStackLayout>

.NET MAUI会将其解释为中心。

4.不要使用RelativeLayout

如果一直在Xamarin Forms中使用RelativeLayout，请为更改做好准备。.NET MAUI中不存在RelativeLayout。说再见。👋

你可能想知道，如果要将应用从Xamarin Forms迁移到.NET MAUI，并且使用RelativeLayout，该怎么做。🤔Microsoft提供了一个具有兼容性命名空间的解决方案，该命名空间可在Microsoft.Maui.Controls.Compatibility命名空间中找到。有关详细信息，可以参考文章Xamarin.Forms to .NET MAUI：How Layout Behavior Has Evolved。

但是，我个人建议在完成迁移后立即重构代码。Grid布局是理想的替代方法，可实现与RelativeLayout相同的行为。

5. 桌面应用程序：需要更多信息？使用工具提示增强

考虑需要其他信息的注册表。通常，占位符用于此目的。但是，如果需要更详细的信息怎么办？👀这就是工具提示派上用场的地方。工具提示允许您在不影响 UI 设计的情况下添加详细信息，因为它们仅在用户直接与视觉元素（在本例中为 Entry）交互时显示。

这只是一个例子。您可以将工具提示添加到许多其他控件中，而不仅仅是输入！这是Xamarin Forms中不存在的.NET MAUI的新功能之一。

有关工具提示的详细信息，我邀请您阅读文章在.NET MAUI中使用工具提示改进桌面应用程序。

6. 在不同的地方使用相同的十六进制颜色？将它们添加到Color.xaml

品牌颜色是应用程序开发不可或缺的一部分。假设您的品牌有三种颜色，您需要在10页中使用它们。一种常见的方法可能是简单地在每个屏幕上根据需要重复相同的十六进制代码。这可行，但会使我们应用程序的维护复杂化，并增加更改颜色时出错的风险。这也使我们的应用程序的可扩展性降低。

在单个文件中创建调色板是一种更有效的方法。这使我们能够在其他文件中使用别名引用这些颜色。如果品牌颜色发生变化，我们只需要更新一个文件，而不是整个代码库。（事实上，应用程序的默认预定义颜色已经以这种方式设置了）。

以下是完成此操作的步骤：

1. 确定要使用的颜色，然后导航到“项目➡️资源➡️样式➡️”“Colors.xaml”。

按以下格式添加任意数量的色线：

<Color x:Key="GrayPrimaryColor">#6E6E6E</Color>

在此上下文中，GrayPrimaryColor是颜色的别名，并且#6E6E6E是其十六进制表示形式。

2. 使用StaticResource引用颜色。

<Label BackgroundColor="{StaticResource GrayPrimaryColor}" Text=".."/>

未来的颜色更新将更容易实现！

结论

👩 💻这就是今天的全部内容！我希望本文中的提示能帮助你坚持.NET MAUI中的最佳做法。请记住，伟大的代码源于小而智能的修改！🛠️感谢您抽出宝贵时间阅读！

https://www.telerik.com/blogs/beyond-basics-best-practices-ui-handling-net-maui