win8/Metro开发系列二 Xaml数据绑定

来源:互联网 发布:网络协议实践实验报告 编辑:程序博客网 时间:2024/05/17 03:32

首先还是那句话,我不是大牛,这些只是简单的记录一下学习的过程,没有太多面向对象和设计模式的思维,只偏基础,不喜莫笑;个人观点如果有不足之处,还望多多指教!由于学的不是太深入这里大多数是面向控件和开发介绍;以使快速了解和开发

知道了怎么布局还得会把程序的数据绑定显示出来,这样才能完成整个程序!!

这节就来一起交流下win8 metro应用的简单的一些数据绑定,不涉及设计模式和面向对象;

其实基本的绑定和web 开发和winfrom开发感觉没什么太大的区别

提到数据绑定要介绍一个绑定模式

OneTime:一次绑定,绑定创建时使用源数据更新控件。(可以是普通的set、get属性)。

OneWay (默认值):单向绑定,在绑定创建时使用源数据更新控件,当源数据发生变化的时候也更新控件。(必须实现INotifyPropertyChanged接口或者继承自DependencyObject)。相当于Eval

TwoWay:双向绑定,数据源的变化会更新控件,控件的变化也会更新到数据源。相当于Bind吧(呵呵我做东西是没怎么用到这个)

1.微软提供的绑定,可以做到数据源变化界面自动跟着数据源一起发生辩护,如果双向更可以做到界面变化数据源同时也跟着变下,也不用转换很方面,微软内部实现好了。

<TextBox Text=”{Binding Path=UserName}”/><TextBox Text="{Binding ElementName=sliderOneTimeDataSource, Path=Value, Mode=OneTime}" …/>

以上代码中,第一行通过使用Binding标记扩展的Path属性将UserName绑定到元素对象TextBox的Text依赖属性中,使文本内容在运行时动态显示到客户端
而第二行代码使用Binding标记扩展中EelementBinding(对象元素绑定)功能,绑定对象sliderOneTimeDataSource.Value到TextBox的Text属性中,使文本内容在滑动条内容改变时,TextBox内容同步改变。 
2.把model数据源赋值DataContext
 数据上下文对象
可以把数据源,赋给控件的dataContext对象,控件有了数据源就可以像上面那样绑定
{Binding 数据源的属性}绑定到需要的之上注意:1.binding相当于DataContext,如果使用集合数据源控件如ListViewer等这他的数据源要赋给 dataItemSource然后再绑定;当然如果你不嫌麻烦完全可以这样ListViewer.DataContext=list;
然后再xaml中在dataItemSource="{Binding}"     2.数据上下文绑定后  子空间共享父控件大数据上下文,当然子控件如果单独定义了data这优先级这个就不用说了大家都懂;这个和路由事件的冒泡相反冒泡对外吐它向下去;如果不指定路径,则表示值绑定到DataContext的值也可以通过ElementName来按照带name的元素设定绑定源,但是不会影响其他属性,也不会继承给子元素。
3.如果需要数据源变控件跟着改变则注意(必须实现INotifyPropertyChanged接口或者继承自DependencyObject).来给数据源一个事件,控件监听这个事件来获知变化进行重新绑定,(metro不支持DependencyObject)silverlight wpf wp7 在编辑器中点击右键→插入代码段→NETFX30→定义一个DependencyProperty依赖属性,而metro废弃了依赖属性的事件通知INotifyPropertyChanged所以老老实实用它吧4.如果是集合的话泛型集合也不行也得实现INotifyPropertyChanged

4,数据绑定的Converter

之前文本框的Text属性是string类型,也能双向绑定,这是因为有值转换器。
比如想把Model中的true,false绑定的到ProgressBar的Visibility属性上就需要他了
先需要定义转换器类,转换器要实现IValueConverter接口,很简单一个回去的一个绑定的就是名字吓人点其实就是类型转换

示例代码:

复制代码
 Book book = new Book();            book.Name = "比科员";            book.Price = 30;            this.DataContext = book;        <TextBlock Height="23" HorizontalAlignment="Left" Margin="26,12,0,0" Name="textBlock1" Text="{Binding Name}" VerticalAlignment="Top" />        <TextBox Height="23" HorizontalAlignment="Left" Margin="99,12,0,0" Name="textBox1" VerticalAlignment="Top" Width="120" Text="{Binding Price}" />
复制代码

 

扯了半天太抽象还是看例子吧

效果

2.

复制代码
  <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Hidden">        <ListView x:Name="dataListView" ItemClick="OnItemCilck" IsItemClickEnabled="True" SelectionChanged="dataListView_SelectionChanged" >            <ListView.ItemTemplate>                <DataTemplate>                    <StackPanel Orientation="Vertical" Width="300" Height="200">                        <Rectangle Height="3" Width="9" Fill="Red"></Rectangle>                        <Rectangle Height="1" Width="300" Fill="Red"></Rectangle>                        <TextBlock x:Name="title" Text="{Binding title, Mode=TwoWay}" TextWrapping="Wrap" FontSize="30"></TextBlock>                        <TextBlock Visibility="Collapsed" x:Name="body" TextWrapping="Wrap" Text="{Binding body, Mode=TwoWay}"></TextBlock>                                            </StackPanel>                </DataTemplate>            </ListView.ItemTemplate>            <ListView.ItemsPanel>                <ItemsPanelTemplate>                    <WrapGrid Orientation="Vertical"  MaximumRowsOrColumns="3"></WrapGrid>                </ItemsPanelTemplate>            </ListView.ItemsPanel>        </ListView>    </ScrollViewer>
复制代码

后台代码就一句:

 this.dataListView.ItemsSource = this.o;

如果要想双向通知如

如如果内容太多或者从网络资源加载过来的话想加载一部分先显示出来,或者点击按钮再显示一部分的话这是就得把list集合实现INotifyPropertyChanged

不过还有个比较生省事的解决方法就是ObservableCollection这个泛型集合微软给我们实现了INotifyPropertyChanged事件我们可以拿来直接应用,而且他实现了IList和list的用法基本一样很好用,这样让你的程序更加人性化

 

0 0
原创粉丝点击