在 1 个 pivotviewer 中使用 observablecollection 和 cxml答案

【问题标题】：using observablecollection and cxml in 1 pivotviewer在 1 个 pivotviewer 中使用 observablecollection 和 cxml
【发布时间】：2017-01-21 11:03:12
【问题描述】：

我是pivotviewer 和silverlight 的新手。我创建了一个observablecollection，它有
属性

public string StaffName { get; set; }
   public string Location {get;set;}

使用BuildCollection() 方法，我通过以下方式将其绑定到mainpage.xaml：

<pivot:PivotViewer x:Name="pViewer">
  <pivot:PivotViewer.ItemTemplates>
    <pivot:PivotViewerItemTemplate MaxWidth="300">
      <Border Width="300" Height="300" 

        <TextBlock Text="{Binding StaffName}" 
                        FontSize="90"
                        FontWeight="Bold"
                        Foreground="White"
                        HorizontalAlignment="Center" 
                        VerticalAlignment="Center" />
      </Border>
    </pivot:PivotViewerItemTemplate>
  </pivot:PivotViewer.ItemTemplates>
</pivot:PivotViewer>

现在我想绑定位于clientbin 中的CXML 文件cities.cxml，它具有图像和名为Location 的属性。我想在集合和 cxml 之间创建一个链接，以便当我对显示人员姓名的集合进行深度缩放时，它应该淡入 cxml 集合中的城市图像。对于 ex Location is london in observable collection 我应该将它从 cxml 文件中深度缩放到伦敦的图像。任何人都可以帮助实现这一目标吗？谢谢。

【问题讨论】：

标签： silverlight-5.0 cxml-collectionxml

【解决方案1】：

首先绑定了 observable 集合。这里我在 observable 集合中添加了一个名为 img 的属性，它表示 xml 文件中的图像索引

我将 xml 文件绑定到另一个模板，并在 subimagehost 中绑定了 img 索引，因此在深度缩放可观察集合时，我也得到了图像

<pivot:PivotViewerItemTemplate>
            <Grid Width="800" Height="800" Background="LightGray"  MaxWidth="800">

                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="200"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Rectangle Fill="{Binding StaffName,  Converter={StaticResource xconv}}"/>
                <pivot:PivotViewerMultiScaleSubImageHost CollectionSource="http://localhost:65535/ClientBin/Map_files/wr5bbwrn.dre.xml" ImageId="{Binding  img}" >


                </pivot:PivotViewerMultiScaleSubImageHost>

                                       <TextBlock Text="{Binding Vehicle}"
                    FontSize="40"
                    Margin="150,200,150,150"
                    Grid.Column="1"
                    VerticalAlignment="Bottom"
                    HorizontalAlignment="Center"/>
            </Grid>
        </pivot:PivotViewerItemTemplate>

【讨论】：