你的位置:首页 > ASP.net教程

[ASP.net教程]在Resource中使用x:Bind


Build2015上,MS热情高涨的演示了x:Bind,一种新的Binding方式,新的方式有如下优点:

1更好的性能(内存占用,CPU占用)

2BuildTime的Binding

具体在Channel9有视频

 Data Binding: Boost Your Apps' Performance Through New Enhancements to XAML Data Binding

新的绑定方式,有如下特点:

x:Bind 主要的几点:

1. 强类型

2.上下文为page 或 UserControl

3.绑定的默认Mode为OneTime

更多了解,请访问:

【Win10】UAP/UWP/通用 开发之 x:Bind

其它的都比较简单,本文主要讲解在Resource中使用x:Bind

1.定义一资源文件DataTemplaterResources.xaml

<ResourceDictionary  x:Class="SLWeek.CustomTheme.DataTemplaterResources"  ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"   ="http://schemas.microsoft.com/winfx/2006/xaml"  ="using:Microsoft.Xaml.Interactivity"  ="using:Microsoft.Xaml.Interactions.Core"  ="using:MVVMSidekick.Behaviors"  ="using:Q42.WinRT.Controls"  ="using:SLWeek.Models"></ResourceDictionary>

注意:要使用x:Class,命名此xmal的部分类,与下面.cs文件从命名空间和类名称上保持一致

2.定义同名的部分类DataTemplaterResources.xaml.cs

namespace SLWeek.CustomTheme{ public partial class DataTemplaterResources  {    public DataTemplaterResources()    {      InitializeComponent();     }  }}

注意:一定要在构造函数中使用初如化InitializeComponent();

其结构如下图所示

3.引用资源文件,我们可以在页面引用,也可以直接在APP.xaml中引用,引用方式,不是我们通常的ResourceDictionary,而是如下方式:

 <Application.Resources>    <ResourceDictionary>      <ResourceDictionary.ThemeDictionaries>        <ResourceDictionary x:Key="Light" Source="CustomTheme/ThemeResourcesLight.xaml" />        <ResourceDictionary x:Key="Dark" Source="CustomTheme/ThemeResourcesDark.xaml" />      </ResourceDictionary.ThemeDictionaries>      <ResourceDictionary.MergedDictionaries>        <ResourceDictionary Source="CustomTheme/CustomStyleResources.xaml" />        <ResourceDictionary Source="CustomTheme/FlatUIColorsResources.xaml" />         <theme:DataTemplaterResources/>      </ResourceDictionary.MergedDictionaries>          </ResourceDictionary>  </Application.Resources>

其中theme是为我们为其所有命名空间起的别名

4.我们可以根据业务需要,在Resource中添加自己需要的Datatemplate了

 <DataTemplate x:Key="PostDetailItemDataTemplate" x:DataType="models:PostDetail">    <Grid Margin="0,5,0,5" Background="{ThemeResource SystemControlChromeLowBackgroundBrush}">      <Grid.RowDefinitions>        <RowDefinition Height="*"/>        <RowDefinition Height="30"/>        <RowDefinition Height="40"/>      </Grid.RowDefinitions>      <Grid.ColumnDefinitions>        <ColumnDefinition Width="80"/>        <ColumnDefinition Width="*"/>      </Grid.ColumnDefinitions>      <interactivity:Interaction.Behaviors>        <core:EventTriggerBehavior EventName="Tapped">          <behaviors:SendToEventRouterAction EventRoutingName="NavToPostDetailByEventRouter"  IsEventFiringToAllBaseClassesChannels="True" EventData="{Binding}"/>        </core:EventTriggerBehavior>      </interactivity:Interaction.Behaviors>      <Image controls:ImageExtensions.CacheUri="{x:Bind Icon}" Stretch="Fill" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2"/>      <!--<c:DelayLoadImage DefaultImageSource="../Assets/Icon/no.png" ActualImageSource="{Binding Icon}" Stretch="Fill" Grid.Row="0" Grid.ColumnSpan="2"/>-->      <TextBlock Text="{x:Bind Creattime,Converter={StaticResource StringFormatConverter},ConverterParameter='{}{0:MMM dd}',Mode=OneWay}" FontSize="22" Grid.Row="1" Grid.Column="0" Grid.RowSpan="2" Margin="0,10,0,0"/>      <TextBlock Text="{x:Bind Title}" FontSize="22" Grid.Row="1" Grid.Column="1" Margin="0,2,0,2"/>      <TextBlock Text="{x:Bind Des}" TextTrimming="CharacterEllipsis" Style="{StaticResource MenuTitleTextBlockStyle}" Grid.Row="2" Grid.Column="1" Margin="0,10" VerticalAlignment="Stretch"/>    </Grid>  </DataTemplate>

注意,由于x:Bind是强类型,我们需要在Datatempalte声明中 使有 x:DataType="models:PostDetail" 来确定要绑定的数据类型,

5.在页面中引用这个资源即可

 <ListView ItemsSource="{x:Bind StrongTypeViewModel.SoureList}" Style="{StaticResource ListViewWrapItemsPanel}" ItemTemplate="{StaticResource PostDetailItemDataTemplate}" SizeChanged="ListView_SizeChanged"/>  

最后效果图如下: