私はWindowsPhone 8.1用のC#プロジェクトに取り組んでいますが、このような些細な問題の解決策を探すのに1日近く無駄になっているとは信じられません。
XAMLで定義されたページがあり、そのページにListViewがあります。ある時点で、リストビューアイテムの1つを選択したいので、myListView.SelectedIndex = whateverを呼び出します。次に、そのアイテムを他のアイテムと視覚的に区別して、たとえば、テキストを別の色で描画したいと思います。それ、どうやったら出来るの?コードの関連部分は次のとおりです。
<Page.Resources>
<DataTemplate x:Key="myListItemTemplate">
<TextBlock
Text="{Binding displayName}"
Style="{ThemeResource ListViewItemTextBlockStyle}"
/>
</DataTemplate>
</Page.Resources>
<ListView
x:Name="myListView"
ItemsSource="{Binding}"
ItemTemplate="{StaticResource myListItemTemplate}"
>
</ListView>
XAMLだけで可能ですか?または、myListView.SelectedIndex値を設定したときに、C#コードで実行できますか?
ありがとう!
K、Andrei提供されたソリューションは非常に優れていると思いますが、バグがあります。これが私のものです。
XAML:SelectedUnfocusedに注意してください
<ListView x:Name="mylistview">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListViewItem">
<Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
</VisualStateGroup>
<VisualStateGroup x:Name="SelectionStates">
<VisualState x:Name="Unselected">
<Storyboard>
<ColorAnimation Duration="0" Storyboard.TargetName="myback" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="Transparent"/>
</Storyboard>
</VisualState>
<VisualState x:Name="SelectedUnfocused">
<Storyboard>
<ColorAnimation Duration="0" Storyboard.TargetName="myback" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="Red"/>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border x:Name="myback" Background="Transparent">
<ContentPresenter Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListView.ItemContainerStyle>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Height="100">
<TextBlock Text="{Binding Artist}" FontSize="22"/>
<TextBlock Text="{Binding Song}" FontSize="22"/>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
C#(サンプルモデル)
public class sample_data
{
public sample_data(string artist, string song)
{
this.Artist = artist;
this.Song = song;
}
public string Artist { get; set; }
public string Song { get; set; }
}
private ObservableCollection<sample_data> CreateData()
{
//List<sample_data> my_list = new List<sample_data>();
ObservableCollection<sample_data> my_list = new ObservableCollection<sample_data>();
my_list.Add(new sample_data("Faith + 1", "Body of Christ"));
my_list.Add(new sample_data("Faith + 1", "Christ Again"));
my_list.Add(new sample_data("Faith + 1", "A Night With the Lord"));
my_list.Add(new sample_data("Faith + 1", "Touch Me Jesus"));
my_list.Add(new sample_data("Faith + 1", "I Found Jesus (With Someone Else)"));
my_list.Add(new sample_data("Faith + 1", "Savior Self"));
my_list.Add(new sample_data("Faith + 1", "Christ What a Day"));
my_list.Add(new sample_data("Faith + 1", "Three Times My Savior"));
my_list.Add(new sample_data("Faith + 1", "Jesus Touched Me"));
my_list.Add(new sample_data("Faith + 1", "Lord is my Savior"));
my_list.Add(new sample_data("Faith + 1", "I Wasn't Born Again Yesterday"));
my_list.Add(new sample_data("Faith + 1", "Pleasing Jesus"));
my_list.Add(new sample_data("Faith + 1", "Jesus (Looks Kinda Hot)"));
my_list.Add(new sample_data("Butters", "What What"));
return my_list;
}
private void Page_Loaded(object sender, RoutedEventArgs e)
{
ObservableCollection<sample_data> sd = this.CreateData();
mylistview.ItemsSource = sd;
}
実行中のスクリーンショット:
ListBoxItemのスタイルを作成し、ストーリーボードを使用する必要があります。
ここにサンプルがあります:
<Page.Resources>
<Style x:Key="ListViewItemTemplate" TargetType="ListViewItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListViewItem">
<Border x:Name="LayoutRoot">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="SelectionStates">
<VisualState x:Name="Unselected">
<Storyboard>
<!-- Define style -->
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="container" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Selected">
<Storyboard>
<!-- Define style -->
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="container" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneAccentBrush}"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid Margin="0,5" x:Name="container" Background="Transparent">
<!-- Definition of your list item. -->
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
そしてリストビューの定義:
<ListView ItemContainerStyle="{StaticResource ListViewItemTemplate}" SelectionMode="Single" />
これを試してみてください、それがあなたを助けるかもしれないことを願っています。
if (e.AddedItems != null) {
foreach (var item in e.AddedItems) {
ListViewItem litem = (sender as ListView).ContainerFromItem(item) as ListViewItem;
if (litem != null) {
VisualStateManager.GoToState(litem, "Unfocused", true);
VisualStateManager.GoToState(litem, "Normal", true);
VisualStateManager.GoToState(litem, "Selected", true);
}
}
}
if (e.RemovedItems != null) {
foreach (var item in e.RemovedItems) {
ListViewItem litem = (sender as ListView).ContainerFromItem(item) as ListViewItem;
if (litem != null) {
VisualStateManager.GoToState(litem, "Unselected", true);
}
}
}
はい、そうです。選択したプロパティにトリガーを使用してスタイルを設定する必要があります。私の電話のコードでは難しいですが、簡単なグーグルでたくさんの例が表示されます: Windows Phoneのリストボックススタイルの選択されたアイテム
クラスにブール変数IsSelectedを追加し、それをbgカラーに変換できます。例えば:
<DataTemplate>
<Grid Background="{Binding IsSelected, Converter={StaticResource IsSelectedToBackgroundColorConverter}}">
<TextBlock Text="{Binding displayName}"
Style="{ThemeResource ListViewItemTextBlockStyle}" />
</Grid>
</DataTemplate>
|
class IsSelectedToBackgroundColorConverter: IValueConverter
{
public object Convert(object value, Type targetType, object parameter, string language)
{
bool IsSelected = (bool)value;
if (IsSelected)
{
Windows.UI.Xaml.Media.Brush red = new SolidColorBrush(Windows.UI.Colors.Red);
return red;
}
else
{
Windows.UI.Xaml.Media.Brush transparent = new SolidColorBrush(Windows.UI.Colors.Transparent);
return transparent;
}
}
}
App.xamlに以下を追加する必要があります
</Application.Resources> <SolidColorBrush x:Key="ListViewItemSelectedBackgroundThemeBrush" Color="#92D050" /> <Application.Resources>
「hex-Color」は、アプリケーションスコープのListViewで選択されたアイテムの色になります