-QuQ-
Articles10
Tags5
Categories0

Archive

Bindings

Bindings

数据绑定

本文主要讲的是 WinUI3 数据绑定。以下是一些参考资料

WPF中的Binding的常见知识点与技巧

Binding

运行时绑定。

Binding 参数:

  • Source: 绑定数据源(根路径)
    • 默认为当前控件的 DataContext 属性。如果在当前控件找不到就找父类控件的
  • Path: 绑定数据源下的元素(根路径下的相对路径)
    • 默认同上
  • ElementName: 根据 Name 绑定界面内元素
  • RelativeSource:

使用 DataContext 进行绑定

class MainVewModel
{
	public string Message { get; set; } = "Hello QAQ";
}
<Grid>
	<!-- 添加到 DataContext -->
    <Grid.DataContext>
        <local:MainViewModel/>
    </Grid.DataContext>
    
    <TextBlock Text="{Binding Message}"/>
</Grid>

这样我们就将 MainViewModel 中的 Message 属性绑定到了 TextBlockText 上(Source: MainViewModel, Path: Message

此处的 Message 前面省略了 Binding 参数 Path。写完整是这样的:Text="{Binding Path=Message}"

alt text

多说两句:

  1. DataContext 也可以在 CodeBehind 里面添加,只需要在构造中加上 this.DataContext = new MainViewModel() WinUI3 的 Window 类没有 Data Context 属性…
  2. "{Binding xxx}" 是一个语法糖()其他类型的绑定并没有提供花括号形式的语法。这时候就得在控件里面写 Binding
    <!-- 这样写的话 Message 没有自动补全... -->
    <TextBlock>
    	<TextBlock.Text>
    		<Binding Path="Message"/>
    	</TextBlock.Text>
    </TextBlock>

使用 Resources 进行绑定

基本使用:

<Grid>
	<Grid.Resources>
		<!-- 定义了一个字符串作为资源 -->
		<x:String x:Key="StringInXaml">Hello -QuQ-</x:String>
	</Grid.Resources>

	<TextBlock Text="{Binding Source={StaticResource StringInXaml}}"/>
</Grid>

绑定类静态成员,常量,枚举等

class MyResource
{
	public string PublicProperty { get; set; } = "Public Property";
	public static string StaticString = "Static String";
	public const string ConstString = "Const String";
}
<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
	<TextBlock Text="{Binding Source={StaticResource StringInXaml}}"/>
	<TextBlock Text="{Binding Source={StaticResource MyRes}, Path=PublicProperty}"/>
	<!-- Binding 无法绑定静态字段 -->
	<TextBlock Text="{x:Bind local:MyResource.ConstString}"/>
	<TextBlock Text="{x:Bind local:MyResource.StaticString}"/>
</StackPanel>

根据 ElementName 进行绑定

<StackPanel>
	<TextBox Name="txt"/>
	<TextBlock Text="{Binding ElementName=txt, Path=Text}"/>
</StackPanel>

结果如下:TextBlock 内容与 TextBox 同步

alt text

注意 ElementName 与控件的 Visual Tree 有关,下面是一个绑定失败的例子

<StackPanel>
	<TextBox Name="txt"/>
	<TextBlock Text="{Binding ElementName=txt, Path=Text}">
		<ToolTipService.ToolTip>
			<!-- ToolTip 是在一个 PopUp 中 -->
			<!-- 绑定失败,弹出时 NameScope 不在 Window 中 -->
			<TextBlock Text="{Binding ElementName=txt, Path=Text}"/>
		</ToolTipService.ToolTip>
	</TextBlock>
</StackPanel>

alt text

根据 RelativeSource 进行绑定

WinUI3 比 WPF 功能少。Mode 没有 FindAncestor

这里不举例了

Author:-QuQ-
Link:http://qqqquq.me/2025/03/01/Bindings/
版权声明:本文采用 CC BY-NC-SA 3.0 CN 协议进行许可