如何在silverlight中更改集合图像

Question

我的设计代码如下：

<Grid HorizontalAlignment="Left" Height="42" VerticalAlignment="Top" Width="302" Margin="12,471,0,0" Background="{StaticResource AppBarItemForegroundThemeBrush}">
                <TextBlock HorizontalAlignment="Left" Margin="6,6,0,0" TextWrapping="Wrap" Text="Change Color" VerticalAlignment="Top" Height="26" Width="137" FontSize="18" Foreground="Black" />
                <Image HorizontalAlignment="Left" Height="33" Margin="163,3,0,0" VerticalAlignment="Top" Width="41" Source="Assets/c1-1.png" x:Name="c1" Tapped="c1_Tapped" />
                <Image HorizontalAlignment="Left" Height="32" Margin="212,4,0,0" VerticalAlignment="Top" Width="45" Source="Assets/c3-1.png" x:Name="c2" Tapped="c2_Tapped" RenderTransformOrigin="0.825,0.5" />
                <Image HorizontalAlignment="Left" Height="33" Margin="262,3,0,0" VerticalAlignment="Top" Width="40" Source="Assets/c2-1.png" x:Name="c3" Tapped="c3_Tapped" />
            </Grid>

代码背后的代码如下：

private void c1_Tapped(object sender, TappedRoutedEventArgs e)
        {
            Images = new ObservableCollection<string>();
            Images.Add(@"Assets/02_perspective_img_1.png");
            Images.Add(@"Assets/02_perspective_img_2.png");
            Images.Add(@"Assets/02_perspective_img_3.png");
            this.DataContext = this;
        }
        private void c2_Tapped(object sender, TappedRoutedEventArgs e)
        {
            Images = new ObservableCollection<string>();
            Images.Add(@"Assets/03_perspective_img_1.png");
            Images.Add(@"Assets/03_perspective_img_2.png");
            Images.Add(@"Assets/03_perspective_img_3.png");
            this.DataContext = this;
        }
        private void c3_Tapped(object sender, TappedRoutedEventArgs e)
        {
            Images = new ObservableCollection<string>();
            Images.Add(@"Assets/01_perspective_img_1.png");
            Images.Add(@"Assets/01_perspective_img_2.png");
            Images.Add(@"Assets/01_perspective_img_3.png");
            this.DataContext = this;
        }

当点击特定图像时，需要显示该特定图像。但没有表现出来。仅显示首次单击的项目图像。请告诉我如何更改收藏。我正在将该集合绑定到windows8中的flipview控件。

        <FlipView.ItemTemplate>
            <DataTemplate>
                <Image HorizontalAlignment="Left"   Source="{Binding}" Height="450" VerticalAlignment="Top" Width="792" x:Name="imagecontrol" Stretch="Fill"/>
            </DataTemplate>
        </FlipView.ItemTemplate>

    </FlipView>

Answer 1

我要做一些假设。一个是FlipView控件将其ItemsSource绑定到Images属性。如果要将DataContext设置为自己（有问题的页面），则需要执行以下几个选项之一。

一：不要将图像设置为新集合。您正在使用ObservableCollection，因此请充分利用它。清除该集合并将项目添加回其中。

private void c3_Tapped(object sender, TappedRoutedEventArgs e)
{
    Images.Clear();
    Images.Add(@"Assets/01_perspective_img_1.png");
    Images.Add(@"Assets/01_perspective_img_2.png");
    Images.Add(@"Assets/01_perspective_img_3.png");
}

第二：在页面中实现INotifyPropertyChanged，并在重置Images属性时激发PropertyChanged事件

private ICollection<string> _images;
public ICollection<string> Images 
{
    get { return _images; }
    set 
    {
        _images = value;
        OnPropertyChanged("Images");
    }
}

您可能会发现，您将需要越来越多的绑定。因此，通常最好有一个单独的ViewModel类来保存数据。

Answer 2

Shawn的建议方式是我会推荐的，但当我在LayoutAwarePage继承的Windows8应用程序页面的情况下测试它时，在这种情况下-首先你得到了一个错误，即page无法实现InotifypropertyChanged其次，当我用ObservableCollection测试它时也没有工作所以我提出了这个解决你问题的方法。在这种情况下，每次更新图像集合时，只需更新FlipView控件的itemsSource属性即可。。

private void c1_Tapped(object sender, TappedRoutedEventArgs e)
    {
        Images = new ObservableCollection<string>();
        Images.Add(@"Assets/02_perspective_img_1.png");
        Images.Add(@"Assets/02_perspective_img_2.png");
        Images.Add(@"Assets/02_perspective_img_3.png");
       FlipviewControlName.ItemsSource = Images;
    }

我知道这不是合适的解决方案，但我想我会解决你的问题。。。