接著上一篇開發(fā)日志繼續(xù)探討。

成都創(chuàng)新互聯(lián)服務(wù)項(xiàng)目包括興平網(wǎng)站建設(shè)、興平網(wǎng)站制作、興平網(wǎng)頁(yè)制作以及興平網(wǎng)絡(luò)營(yíng)銷策劃等。多年來(lái)，我們專注于互聯(lián)網(wǎng)行業(yè)，利用自身積累的技術(shù)優(yōu)勢(shì)、行業(yè)經(jīng)驗(yàn)、深度合作伙伴關(guān)系等，向廣大中小型企業(yè)、政府機(jī)構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案，興平網(wǎng)站推廣取得了明顯的社會(huì)效益與經(jīng)濟(jì)效益。目前，我們服務(wù)的客戶以成都為中心已經(jīng)輻射到興平省份的部分城市，未來(lái)相信會(huì)繼續(xù)擴(kuò)大服務(wù)區(qū)域并繼續(xù)獲得客戶的支持與信任！

上一篇日志講到在一個(gè)PhonePage里綁定一個(gè)數(shù)據(jù)集，用的是如下的方法：

d:DataContext="{d:DesignData TestDataViewModel.xaml}"

一個(gè)xmal文件表示一個(gè)數(shù)據(jù)集，在上面代碼里的d:DataContenxt里研究了半天，實(shí)在沒(méi)有辦法讓一個(gè)DataContenxt綁定第二個(gè)xaml的數(shù)據(jù)集，玩過(guò)Linq的人都知道，一個(gè)DataContenxt下面卻可以定義多個(gè)集合的，接下來(lái)的思路就是怎么在一個(gè)xmal里加入兩個(gè)數(shù)據(jù)集。

自己設(shè)計(jì)了兩個(gè)除了類名外其他都一樣的數(shù)據(jù)類（TestDataItem.cs及TestDataItem2.cs），如下圖的文件目錄所示，為了顯示方便將其放到兩個(gè)不同的文件夾里，這時(shí)就要注意namespace的問(wèn)題啦。

上面的TestDataCollection.cs、TestDataCollection2、TestDataViewModel.xaml、TestDataViewModel2.xaml是個(gè)人作單獨(dú)顯示時(shí)用的，想將兩個(gè)數(shù)據(jù)集放到同一個(gè)DataContext里不需要?jiǎng)佑眠@幾個(gè)文件。而TotalTestDataCollection.cs是關(guān)鍵的所在，在此定義了一個(gè)含有兩個(gè)數(shù)據(jù)集合的大集合，其代碼如下所示：

//TotalTestDataCollection.cs

using MvTest.TestDataViewModel1;
using MvTest.TestDataViewModel2;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace MvcTest.TotalDataViewModel
{
    public class TotalTestDataCollection : INotifyPropertyChanged
    {
        /// <summary>
        /// 數(shù)據(jù)集合1
        /// </summary>
        public ObservableCollection<TestDataItem> TestDataItems1 { get; private set; }
        /// <summary>
        /// 數(shù)據(jù)集合2
        /// </summary>
        public ObservableCollection<TestDataItem2> TestDataItems2 { get; private set; }
        /// <summary>
        /// 屬性更改事件回調(diào)
        /// </summary>
        public event PropertyChangedEventHandler PropertyChanged;
        /// <summary>
        /// 構(gòu)造函數(shù)
        /// </summary>
        public TotalTestDataCollection()
        {
            this.TestDataItems1 = new ObservableCollection<TestDataItem>();
            this.TestDataItems2 = new ObservableCollection<TestDataItem2>();
        }
        /// <summary>
        /// INotifyPropertyChanged接口的實(shí)現(xiàn)
        /// </summary>
        private void NotifyPropertyChanged(String propertyName)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (null != handler)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }
}

如前一篇筆記強(qiáng)調(diào)的，要想讓VS認(rèn)出你的ViewModel，必須要繼承INotifyPropertyChanged的接口。然后再新建一個(gè)xaml來(lái)設(shè)計(jì)兩個(gè)數(shù)據(jù)集的例子（方法見(jiàn)上一篇博文吧），其代碼如下所示：

//TotalDataViewModel.xaml

<!-- 這對(duì)應(yīng)的是數(shù)據(jù)集的類名，表示一組數(shù)據(jù)-->
<vm:TotalTestDataCollection
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:vm="clr-namespace:MvcTest.TotalDataViewModel"
    xmlns:c1="clr-namespace:MvTest.TestDataViewModel1"
    xmlns:c2="clr-namespace:MvTest.TestDataViewModel2">
    <!--clr-namespace:MvcTest這是數(shù)據(jù)集的命名空間，帶文件夾的要注意啦-->
                                                                                                                                                                                                          
    <vm:TotalTestDataCollection.TestDataItems1>
        <c1:TestDataItem Index="0" Name="name0" Flag="True"></c1:TestDataItem>
        <c1:TestDataItem Index="1" Name="name1" Flag="True"></c1:TestDataItem>
        <c1:TestDataItem Index="2" Name="name2" Flag="True"></c1:TestDataItem>
    </vm:TotalTestDataCollection.TestDataItems1>
    <vm:TotalTestDataCollection.TestDataItems2>
        <c2:TestDataItem2 Index="3" Name="name3" Flag="True"></c2:TestDataItem2>
        <c2:TestDataItem2 Index="4" Name="name4" Flag="True"></c2:TestDataItem2>
        <c2:TestDataItem2 Index="5" Name="name5" Flag="True"></c2:TestDataItem2>
    </vm:TotalTestDataCollection.TestDataItems2>
</vm:TotalTestDataCollection>

注意代碼里的c1、c2的命名空間，否則會(huì)無(wú)法識(shí)別TestDataItem，當(dāng)然，省事的方法就是將所有的文件放到一個(gè)目錄下面，好吧，個(gè)人是有強(qiáng)迫癥的。就這樣將兩個(gè)數(shù)據(jù)集拼在一個(gè)xaml里面了，下面就是在MainPage里呈現(xiàn)出這些數(shù)據(jù)，為此我設(shè)計(jì)了兩個(gè)LongListSelector,分別顯示不同的數(shù)據(jù)，為了區(qū)分起見(jiàn)，我設(shè)計(jì)了兩個(gè)DataItemTemplate，如下面代碼所示：

//MainPage.xaml

<phone:PhoneApplicationPage
    x:Class="MvcTest.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"
    mc:Ignorable="d"
    d:DataContext="{d:DesignData TotalDataViewModel/TotalDataViewModel.xaml}"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    shell:SystemTray.IsVisible="True">
                                                                                                                        
    <!--單條數(shù)據(jù)顯示的樣式-->
    <phone:PhoneApplicationPage.Resources>
        <DataTemplate x:Key="TestDataItemTemplate">
            <StackPanel Margin="0,0,0,0">
                <TextBlock Text="{Binding Index}"/>
                <TextBlock Text="{Binding Name}" />
                <!--TextBlock Text="{Binding Flag}" /-->
                <StackPanel Height="1" Background="AliceBlue"></StackPanel>
            </StackPanel>
        </DataTemplate>
        <DataTemplate x:Key="TestDataItemTemplate2">
            <StackPanel Margin="0,0,0,0">
                <TextBlock Foreground="Red" Text="{Binding Index}"/>
                <TextBlock Foreground="Yellow" Text="{Binding Name}" />
                <TextBlock Foreground="Green" Text="{Binding Flag}" />
                <StackPanel Height="1" Background="RoyalBlue"></StackPanel>
            </StackPanel>
        </DataTemplate>
                                                                                                                            
    </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 Text="我的應(yīng)用程序" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
            <TextBlock Text="頁(yè)面名稱" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <!--用一個(gè)LongListSelector來(lái)顯示數(shù)據(jù)集-->
            <StackPanel>
                <phone:LongListSelector Margin="0,0,0,0" ItemTemplate="{StaticResource ResourceKey=TestDataItemTemplate}" ItemsSource="{Binding TestDataItems1}"/>
                <phone:LongListSelector Margin="0,0,0,0" ItemTemplate="{StaticResource ResourceKey=TestDataItemTemplate2}" ItemsSource="{Binding TestDataItems2}"/>
            </StackPanel>
        </Grid>
    </Grid>
</phone:PhoneApplicationPage>

只要d:DataContext關(guān)聯(lián)到TotalDataViewModel.xaml里，編譯器倒可以自動(dòng)感知內(nèi)容，只要在LongListSelector里綁定好指定的數(shù)據(jù)集就可以啦，其顯示效果如下圖所示：

最后總結(jié)一下，（1）先設(shè)計(jì)好你要顯示的數(shù)據(jù)類（TestDataItem.cs）；（2）設(shè)計(jì)好數(shù)據(jù)集的集合類（TotalTestDataCollection.cs）；（3）設(shè)計(jì)好數(shù)據(jù)集的內(nèi)容（TestDataViewModel.xaml）；（4）在PhonePage里呈現(xiàn)你的數(shù)據(jù)。步驟不多，四步而已，雖說(shuō)如此，但要弄出這個(gè)效果可是花了我一個(gè)下午的時(shí)間，我真是Low爆啦。

末啦，同樣附上工程例子，for vs2013。

附件：http://down.51cto.com/data/2364284

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無(wú)理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

文章題目：WP8開發(fā)日志（3）：MVC設(shè)計(jì)模式進(jìn)階——綁定多個(gè)數(shù)據(jù)集-創(chuàng)新互聯(lián)
當(dāng)前路徑：http://www.chinadenli.net/article40/dcseeo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁(yè)設(shè)計(jì)公司、搜索引擎優(yōu)化、自適應(yīng)網(wǎng)站、企業(yè)建站、網(wǎng)站收錄、關(guān)鍵詞優(yōu)化

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)