SilverLight框架初探-View

前面分别实现了ViewModel与Riaservice，接下来让我们看看如果实现与View的绑定，如下：

ProductionView.xaml的代码如下：

<UserControl x:Class="Mvvm.Client.Views.ProductionView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
           xmlns:vm="clr-namespace:Mvvm.Client.ViewModels.ViewModels;assembly=Mvvm.Client.ViewModels"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400" xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data">
    <!--添加ProductionViewModel引用-->
    <UserControl.Resources>
        <vm:ProductionViewModel x:Name="productionViewModel"/>
    </UserControl.Resources>
    <!--通过DataContext与Grid绑定-->
    <Grid x:Name="LayoutRoot" DataContext="{Binding Source={StaticResource productionViewModel}}" MinHeight="100">
        <!--添加GdataGrid与DataPager控件-->
        <data:DataGrid AutoGenerateColumns="True" Name="dataGrid1" MinHeight="20" MinWidth="100" Grid.Row="4" />
        <data:DataPager Grid.Row="5" Name="dataPager1" />
    </Grid>
</UserControl>

在这里，控件与数据源的绑定放在了其*.cs文件中，这样更方便于我们进行相关操作，代码如下：

 

 public partial class ProductionView : UserControl
    {
        public ProductionView()
        {
            InitializeComponent();
            BindingGrid();
        }

        void BindingGrid()
        {
            this.productionViewModel = new ViewModels.ViewModels.ProductionViewModel();
            base.DataContext = this.productionViewModel;
            this.productionViewModel.QueryCommand.Execute(null);

            // Wrap the itemList in a PagedCollectionView for paging functionality
            PagedCollectionView itemListView = new PagedCollectionView(this.productionViewModel.ListProduction);
            if (itemListView != null)
            {
                dataGrid1.ItemsSource = itemListView;
                dataPager1.Source = itemListView;
                dataPager1.PageSize = 20;
                dataPager1.DataContext = this.dataPager1;
            }
        }
    }

这样，我们就能够将View与ViewModel关联起来。

以MVVM这么模式来设计开发Silverlight，真正意义上达到了我们要实现页面与逻辑分离的目的。上面例子中，我们的View也可以用WPF来实现。