0

私は、ユーザーが使用する画像を選択できる、IsolatedStorage からの画像を含む ListBox です。リストボックス内で、画像の周囲の境界線を介して（または別の方法で）、現在選択または押されている画像をユーザーに表示したいと思います。現在選択されている画像を取得し、その画像の周りに境界線を配置する方法が正確にはわかりません。現在、ListBox の SelectionChanged イベントを使用して、この機能を試しています。私がこれまでに持っているものは次のとおりです。

MainPage.xaml

 <ListBox x:Name="Recent" ItemsSource="{Binding Pictures}" Margin="8" 
                     SelectionChanged="recent_SelectionChanged" toolkit:TiltEffect.IsTiltEnabled="True">
                <ListBox.ItemsPanel>
                    <ItemsPanelTemplate>
                        <toolkit:WrapPanel Orientation="Horizontal" />
                    </ItemsPanelTemplate>
                </ListBox.ItemsPanel>
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <Image x:Name="recentImage" Source="{Binding Source}" Margin="12" Width="115"/>
                    </DataTemplate>
                </ListBox.ItemTemplate>
</ListBox>

MainPage.xaml.cs

 private void recent_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        //Place border round currently selected image
        //?

    }

何かご意見は？

4

2 に答える 2

1

更新して修正

MainPage.xaml

//within the ListBox DataTemplate
 <Border>
     <Image x:Name="recentImage" Source="{Binding Source}" Margin="12" Width="115"/>
 </Border>

MainPage.xaml.cs

//within recent_SelectionChanged
var lb = sender as ListBox;
var lbi = lb.ItemContainerGenerator.ContainerFromItem(lb.SelectedItem) as ListBoxItem;

lbi.BorderThickness = new Thickness(2, 2, 2, 2);
lbi.BorderBrush = new SolidColorBrush((Color)Application.Current.Resources["PhoneAccentColor"]);
于 2013-06-07T05:31:06.300 に答える
0

データ テンプレートの画像の上に別の画像を作成します。この画像はほとんど透明で、境界線と小さな目盛り (Windows 8 アプリのように) だけです。次に、アイテムが選択されたときにこの画像の表示を切り替えます。

画像はほとんど透明であるため、選択した画像の周囲に境界線として表示されます。

私はこのテクニックを使用してアイテムを「グレー表示」します (不透明度が 10% までの黒一色の画像を使用することにより)、非常にうまく機能します。

選択したプロパティに可視性を簡単にバインドできるはずですが、ブール値と可視性を変換するコンバーターが必要です。

  <DataTemplate>
       <Image x:Name="recentImage" Source="{Binding Source}" Margin="12" Width="115"/>
       <Image x:Name="borderImage" Source="Images/borderimg.png" Margin="12" Width="115" Visibility="Collapsed"/>
  </DataTemplate>

それで：

 private void recent_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        //set the visibility property of the selected item to 'Visible'

    }
于 2013-06-07T05:26:04.840 に答える