zoukankan      html  css  js  c++  java
  • Windows Phone 7 MVVM模式通讯方式之实现Binding Data

    MVVM模式的View与ViewModel的三大通讯方式:Binding Data(实现数据的传递)、Command(实现操作的调用)和Attached Behavior(实现控件加载过程中的操作)。
    下面通过一个实例实现MVVM模式的Binding Data通讯
    1、创建Model层
    Food.cs
    namespace BindingDataDemo.Model
    {
        public class Food
        {
            public string Name
            {
                get;
                set;
            }
    
            public string Description
            {
                get;
                set;
            }
    
            public string IconUri
            {
                get;
                set;
            }
    
            public string Type
            {
                get;
                set;
            }
    
        }
    }
    
    2.创建ViewModel层
    FoodViewModel.cs
    using System;
    using System.ComponentModel;
    using BindingDataDemo.Model;
    using System.Collections.ObjectModel;
    
    namespace BindingDataDemo.ViewModel
    {
        public class FoodViewModel : INotifyPropertyChanged
        {
            private  ObservableCollection<Food> _allFood;
    
            public ObservableCollection<Food> AllFood
            {
                get
                {
                    if (_allFood == null)
                        _allFood = new ObservableCollection<Food>();
    
                    return _allFood;
                }
                set
                {
                    if (_allFood != value)
                    {
                        _allFood = value;
                        NotifyPropertyChanged("AllFood");
                    }
                }
            }
    
            public FoodViewModel()
            {
                 try   
                {
                    Food item0 = new Food() { Name = "西红柿", IconUri = "Images/Tomato.png", Type = "Healthy" ,Description="西红柿的味道不错。" };
                    Food item1 = new Food() { Name = "茄子", IconUri = "Images/Beer.png", Type = "NotDetermined", Description = "不知道这个是否好吃。" };
                    Food item2 = new Food() { Name = "火腿", IconUri = "Images/fries.png", Type = "Unhealthy", Description = "这是不健康的食品。" };
                    Food item3 = new Food() { Name = "三明治", IconUri = "Images/Hamburger.png", Type = "Unhealthy" ,Description="肯德基的好吃?" };
                    Food item4 = new Food() { Name = "冰激凌", IconUri = "Images/icecream.png", Type = "Healthy", Description = "给小朋友吃的。" };
                    Food item5 = new Food() { Name = "Pizza", IconUri = "Images/Pizza.png", Type = "Unhealthy" ,Description="这个非常不错。" };
                    Food item6 = new Food() { Name = "辣椒", IconUri = "Images/Pepper.png", Type = "Healthy", Description = "我不喜欢吃这东西。" };
                    AllFood.Add(item0);
                    AllFood.Add(item1);
                    AllFood.Add(item2);
                    AllFood.Add(item3);
                    AllFood.Add(item4);
                    AllFood.Add(item5);
                    AllFood.Add(item6);
                }      
                catch ( Exception e )  
                {         
                    System.Windows.MessageBox.Show( "Exception: " + e.Message );       
                }   
            }
            
            // 定义PropertyChanged 事件
            public event PropertyChangedEventHandler PropertyChanged;
    
            public void NotifyPropertyChanged(string propertyName)
            {
                if (PropertyChanged != null)
                {
                    PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
                }
            }  
    
    
        }
    }
    
    3、创建View层
    MainPage.xaml
    <phone:PhoneApplicationPage 
        x:Class="BindingDataDemo.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
        xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:my="clr-namespace:BindingDataDemo.ViewModel" 
        mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
        FontFamily="{StaticResource PhoneFontFamilyNormal}"
        FontSize="{StaticResource PhoneFontSizeNormal}"
        Foreground="{StaticResource PhoneForegroundBrush}"
        SupportedOrientations="Portrait" Orientation="Portrait"
        shell:SystemTray.IsVisible="True">
        <!--添加ViewModel层的FoodViewModel类为资源-->
        <phone:PhoneApplicationPage.Resources>
            <my:FoodViewModel x:Key="food" />
        </phone:PhoneApplicationPage.Resources>
    
        <Grid x:Name="LayoutRoot" Background="Transparent">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
    
            <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
                <TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
                <TextBlock x:Name="PageTitle" Text="数据绑定" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
            </StackPanel>
            <!--在Grid控件中将上面定义好的FoodViewModel类资源赋值给DataContent属性,表示Grid控件内使用FoodViewModel类作为上下文数据-->
            <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0" DataContext="{StaticResource food }">
                <!--在ListBox控件中绑定FoodViewModel类的AllFood属性,AllFood是ObservableCollection<Food>类型-->
                <ListBox x:Name="listBox" HorizontalContentAlignment="Stretch" ItemsSource="{Binding AllFood}">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                           <StackPanel Orientation="Horizontal" Background="Gray" Width="450" Margin="10">
                                <!--绑定Food类的IconUri属性-->
                                <Image Source="{Binding IconUri}" Stretch="None"/>
                                <!--绑定Food类的Name属性-->
                                <TextBlock Text="{Binding Name}" FontSize="40" Width="150"/>
                                <!--绑定Food类的Description属性-->
                                <TextBlock Text="{Binding Description}" FontSize="20" Width="280"/>
                            </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </Grid>
        </Grid>
    
    </phone:PhoneApplicationPage>
    
    OK!!!!!!!!!!!!!!!!!!!!!!!
    备注:实现绑定数据的方法有很多种,原理都大同小异。
  • 相关阅读:
    连接SDE数据库hl3292修改已解决
    ORACLE 10g 安装
    SharpMap相关的一些博客和网站
    Delphi 学习之函数 ②扩展的日期时间操作函数
    Delphi学习之函数 ⑾进制函数及过程
    Delphi学习之函数 ① 扩展的字符串操作函数
    html 初次接触html学习【1】
    Delphi 学习之函数 ③ 扩展的位操作函数
    Delphi学习之函数 ⑨汉字拼音功能函数
    Delphi学习之函数 ④扩展的文件及目录操作函数
  • 原文地址:https://www.cnblogs.com/linzheng/p/2076958.html
Copyright © 2011-2022 走看看