簡體   English   中英

如何更改所選ListView項的顏色[WP8.1]

[英]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.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM