【翻译】MAUI 的.NET 11预览版：使用内联C#表达式简化XAML

摘要

如果你的 MAUI UI 逻辑根本不需要转换器或额外的 ViewModel 属性会怎么样？.NET 11 预览版的 C# 表达式允许你直接在 XAML 中嵌入小型、安全、强类型的 C# 代码片段，以源代码生成的速度清理格式化、仅 UI 数学运算和条件语句。虽然仍处于实验阶段，但非常适合演示和早期探索。

为什么这个 .NET 11 预览功能在 MAUI 社区引起轰动

在 .NET MAUI 中设计干净的 UI 听起来很简单，但格式化文本、组合值或进行简单的 UI 计算通常会迫使我们：

创建一次性转换器
设置额外的 ViewModel 属性
使用笨拙的 StringFormat 技巧

对于像显示价格这样的小事情，这一切都感觉工作量太大了。但 .NET 11 通过名为XAML 中的 C# 表达式的新功能解决了这个问题。一个小变化却带来了巨大而令人兴奋的影响！

有了这个预览功能，你终于可以直接在 XAML 中编写简短、安全的 C# 表达式，无需转换器，无需样板代码，无需繁琐的仪式。

什么是"XAML 中的 C# 表达式"？

XAML 中的 C# 表达式让我们可以直接在绑定中嵌入简短的代码片段。我们可以直接在标记中表达最终的显示值，而不是将绑定与转换器配对。

该功能由 XAML 源代码生成器提供支持，它在构建时验证并从这些表达式生成强类型代码。这使得一切保持安全、快速和可读，同时让 XAML 感觉更加自然。

为什么这个功能非常重要

以下是在 XAML 中使用 C# 表达式的主要好处：

更快的入门：初学者不需要学习转换器或额外的模式就能显示格式化的值。
更少的样板代码：小型、仅视图的转换不会强制要求额外的 ViewModel 属性或一次性转换器。
更强的工具支持：源代码生成带来了闪电般的编译时验证和比旧方法更高的性能提升。

这些超级能力共同使我们的 UI 代码感觉像我们在屏幕上想象的那样直观和生动。

何时使用它（以及何时不使用）

像任何工具一样，XAML 中的 C# 表达式在合适的场景中表现出色。

用于小型、表现层逻辑：

格式化值（货币、日期等）
简单数学运算
字符串组合
基于布尔值切换视觉效果

避免用于复杂、可重用、业务关键逻辑，包括：

定价规则
税务计算
需要单元测试或在多个屏幕上重用的逻辑

经验法则：如果逻辑不能一目了然，就将其移至 ViewModel 或域层。

熟悉语法

以下是一些反映日常 UI 场景的小例子，开发人员今天经常依赖转换器或额外的 ViewModel 属性。

1) 无需转换器的货币格式化

我们可以使用标准的 C# 格式化来格式化货币。它会根据设备或应用程序的区域设置显示本地化货币。

xaml 复制代码

<Label Text="{$'{Price:C2}'}" />

2) 直接在 UI 中显示计算的总计

对于基本总计，我们可以将逻辑直接放在标签旁边。

xaml 复制代码

<Label Text="{$'Total: {Price * Quantity:C2}'}" />

3) 使用字符串插值构建用户友好的文本

我们可以直接在 XAML 中执行字符串插值，而不是在 ViewModel 中创建单独的属性。

xaml 复制代码

<Label Text="{$'{Quantity} × {ProductName}'}" />

4) 使用条件表达式表示状态

对于简单的 UI 状态，不再需要转换器。

xaml 复制代码

<Label Text="Active" IsVisible="{IsActive}" />
<Label Text="Inactive" IsVisible="{!IsActive}" />

5) 条件样式也保持干净

我们还可以根据状态切换颜色。

xaml 复制代码

<Label Text="{IsActive ? 'Active' : 'Inactive'}"
       TextColor="{IsActive ? Colors.Green : Colors.Gray}" />

迷你页面演练：之前 vs. 之后

想看看魔法吗？没有什么比比较经典页面和升级到 .NET MAUI 的 XAML 中 C# 表达式的页面更好的了。

之前：有效，但增加了额外步骤

典型的 XAML 页面可能会以如下绑定开始：

xaml 复制代码

<Label Text="{Binding Price, StringFormat='{}{0:C2}'}" />
<Label Text="{Binding Total}" />
<Label Text="{Binding DisplayText}" />

为了支持这一点，我们通常会引入纯粹为了格式化 UI 而存在的 ViewModel 属性。

csharp 复制代码

public string DisplayText => $"{Quantity} × {ProductName}";

public decimal Total => Price * Quantity;

之后：更简洁，更直接

使用 C# 表达式，我们可以直接在 XAML 中表达相同的逻辑，无需额外的 ViewModel 属性：

xaml 复制代码

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:MauiApp"
             x:Class="MauiApp.MainPage"
             x:DataType="local:ProductViewModel">
 <VerticalStackLayout Spacing="6" Padding="16">
   <Label Text="{ProductName}"
          FontAttributes="Bold"
          FontSize="18" />
   <Label Text="{$'{Price:C2}'}" />
   <Label Text="{$'{Quantity} × {ProductName}'}" />
   <Label Text="{$'Total: {Price * Quantity:C2}'}" />
   <Label Text="Active"
          IsVisible="{IsActive}"
          TextColor="Green" />
   <Label Text="Inactive"
          IsVisible="{!IsActive}"
          TextColor="Gray" />
 </VerticalStackLayout>
</ContentPage>

注意： 有关更多详细信息，请参考 .NET MAUI (.NET 11) 中 XAML C# 表达式的示例https://github.com/SyncfusionExamples/Csharp-Expressions-in-XAML--A-Beginner-Friendly-Leap-for-.NET-MAUI-in-.NET-11

这如何融入 MVVM

重要的是要强调，XAML 中的 C# 表达式是一种表现层便利，而不是 MVVM 或 ViewModel 的替代品。使用表达式进行简短、以 UI 为中心的转换。将业务逻辑、影响行为的计算和共享规则保留在 ViewModel 或域层中，以便它们可以被测试和重用。

它是否已经准备好投入生产？

在现阶段，该功能尚未准备好投入生产。它是实验性的，与 .NET 11 预览版 和 XamlSourceGen 相关联。

这使得它非常适合学习、原型设计和内部演示。然而，对于面向客户的发布，最好等待稳定支持，除非你控制完整的部署环境并且对预览依赖项感到满意。

如何尝试它（初学者友好的设置）

如果你想安全地进行实验，请从小处着手并遵循以下步骤：

步骤 1：启用预览功能

使用 .NET 11 预览版并启用预览标签。

xml 复制代码

<EnablePreviewFeatures>true</EnablePreviewFeatures>

请参考以下图片：

步骤 2：开启 XAML 源代码生成

接下来，确保启用了 XAML 源代码生成。此功能仅在活动的 XamlSourceGen 时有效。

xml 复制代码

<MauiXamlInflator>SourceGen</MauiXamlInflator>

步骤 3：为页面使用 x:DataType

优先使用带有 x:DataType 的编译绑定，以便表达式是强类型的，并且工具支持更好。

csharp 复制代码

x:DataType="local:MainViewModel"

步骤 4：从简单的表达式开始

最后，一次添加一个表达式。格式化值（如价格或标签）通常是最容易和最安全的开始地方。

.NET MAUI 的未来

XAML 中的 C# 表达式推动 MAUI 向更自然、以 C# 为中心的标记工作流程发展。通过减少样板代码并通过源代码生成启用编译时检查，开发人员体验变得更加清晰且不易出错。

随着 .NET 11 的发展，你可以期待此功能不断发展和稳定，可能成为开发人员在 .NET MAUI 中编写 XAML 的标准部分。

请参考以下图片：

常见问题

我可以在不启用 XamlSourceGen 的情况下在 XAML 中使用 C# 表达式吗？

不可以。此功能仅在启用 XamlSourceGen 时有效，因为表达式是通过源代码生成器处理和编译的。没有它，XAML 工具/解析器将无法理解或转换表达式。

此功能是否足够稳定，可以用于生产应用程序？

还没有。XAML 中的 C# 表达式目前是实验性的，与 .NET 11 预览版本相关联。它非常适合学习、演示和原型设计，但对于面向客户的生产应用程序，等待它获得官方支持并稳定下来会更安全。

C# 表达式是否会取代转换器或 MVVM 模式？

不会。它们旨在用于小型 UI 转换，如格式化、字符串插值或基本计算。转换器和 MVVM 对于可重用的转换、复杂逻辑和应该在屏幕之间测试和共享的业务规则仍然很重要。

我可以在 XAML 中的 C# 表达式内调用方法吗？

只有简单且安全的表达式才能正常工作。我们应该避免异步调用和多步操作。目的是保持 UI 逻辑轻量且可读，而不是将应用程序逻辑移到 XAML 中。

这些表达式会减慢我的应用程序吗？

通常不会。因为表达式是通过源代码生成器编译的。它们是强类型的，避免了经典绑定中常见的一些反射密集型行为。在大多数情况下，性能应该相等或更好，具体取决于页面和场景。

这是否适用于 x:DataType（编译绑定）？

是的。推荐使用 x:DataType，因为它提高了类型安全性，启用了更好的编译时检查，并且在编写 XAML 时通常提供更好的 IntelliSense。

展望未来

非常感谢您的阅读！如果你正在深入研究 .NET MAUI，这确实是未来最令人兴奋的改进之一。XAML 中的 C# 表达式带来了兴奋、清晰度和一种令人难以置信的直观方式来塑造 UI 逻辑。随着 .NET 11 的发展，这个工具只会变得更加强大和变革性！

无论这是你的第一个 MAUI 项目还是你正在完善你的 UI 架构，这个添加都将为你的工作流程注入活力，使开发变得快速、干净且真正有意义！

原文地址

https://dev.to/syncfusion/net-11-preview-for-net-maui-simplify-xaml-with-inline-c-expressions-2k3j