[英]How to change color of the selected ListView item [WP8.1]
我正在为Windows Phone 8.1开发一个C#项目,我无法相信我已经浪费了将近一天的时间来寻找这样一个小问题的解决方案:
我有一个用XAML定义的页面,在该页面上我有一个ListView。 在某些时候,我希望其中一个列表视图项被选中,所以我调用myListView.SelectedIndex = what。 现在我希望该项目在视觉上与其他项目区分开来,例如,使用不同的颜色绘制其文本。 我怎么做? 以下是代码的相关部分:
<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? 或者可以在C#代码中完成,就在我设置myListView.SelectedIndex值时?
谢谢!
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" />
是的,您需要在所选属性上设置带触发器的样式。 它在我的手机上的代码很难,但快速的谷歌将向你展示大量的例子或在这里: 列表框样式在Windows手机上选择项目
您可以向类中添加一个布尔变量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中的选定项目颜色
试试这个,希望它可以帮到你。
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);
}
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.