2

我只是从 C++ 背景中学习 WPF 和 XAML 的基本概念，所以其中一些对我来说有点陌生。我正在使用 Expression Blend 来帮助我掌握 XAML。

我正在制作一个在简单 XML 数据源中显示记录的基本应用程序：

<photos>
  <photo>
    <image>Assets\Item01.png</image>
    <description>Strawberry</description>
  </photo>
  <photo>
    <image>Assets\Item02.png</image>
    <description>Orange</description>
  </photo>
  <photo>
    <image>Assets\Item03.png</image>
    <description>Pineapple</description>
  </photo>
  ...
</photos>

我已将此数据“photoDataSource”绑定到网格，并粘贴了一些显示第一条记录的文本框和图像字段。在 XAML 中：

<Grid x:Name="LayoutRoot" DataContext="{Binding Source={StaticResource photoDataSource}}" Margin="0,0,0,1" Background="#FF1D1D1D">
    <Image Height="104" Width="104" Source="{Binding XPath=/photos/photo/image}" Margin="8,62,0,0" HorizontalAlignment="Left" VerticalAlignment="Top"/>
    <TextBox Height="23" Margin="8,8,6,0" TextWrapping="Wrap" Text="{Binding XPath=/photos/photo/description}" VerticalAlignment="Top"/>
    <TextBox Height="23" Margin="8,35,6,0" TextWrapping="Wrap" Text="{Binding XPath=/photos/photo/image}" VerticalAlignment="Top"/>
    <Button Content="Next Product" Margin="213,97,297,0" Height="44" VerticalAlignment="Top"/>
</Grid>

这将显示两个分别包含“Strawberry”和“Assets\Item01.png”的文本框，以及包含文本“Next Product”的图像和按钮。如您所见，我已将集合“photoDataSource”绑定到父网格。运行时，它会显示集合中的第一项。

如何触发按钮在运行时显示集合（和循环）中的下一个项目？

我不打算使用任何代码隐藏来执行此操作，因为我不会更改任何数据本身，只是显示哪个项目。但也许我以错误的方式解决这个问题？

理想情况下，在此示例之后，我希望完全删除按钮并在情节提要动画完成后自动更改记录（使用触发器'StoryboardCompletedTrigger'）。

4

1 回答 1

1

不想在后面使用代码是完全正确的。但是，我建议对您的 Window 实施 ViewModel 以获得您想要的结果。

在您的视图模型中，您应该有一个 Photo 对象的 ObservableCollection 和另一个属性来指定一个名为 SelectedPhoto 的单个照片，如下所示：

public ObservableCollection<Photo> MyPhotos {
  get { return _photos; }
  set { _photos = value;
     if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs("Photos"));
  }
}

public Photo SelectedPhoto {
  get { return _photo; }
  set { _photo = value; 
     if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs("SelectedPhoto"));
  }
}

然后使用 XmlSerialization 将您的 Xml 加载到 ObservableCollection 中。然后创建您的按钮以移动下一个和上一个以绑定到 ICommand（也在您的 ViewModel 中）以每次循环向上或向下循环 MyPhotos 集合设置 SelectedPhoto。

然后你可以在你的 Xaml 中绑定和 Image，如下所示。

<Image Source="{Binding Source={StaticResource myViewModel}, Path=SelectedPhoto.Image}"/>

我希望这对您有所帮助，并且有所帮助。

于 2013-04-15T05:56:12.853 回答