在 Collectionview 上设置选择背景颜色并保持 material 波纹
set selection backgroundcolor on Collectionview and keep the material ripple
我有一个像这样的 Collectionview:
<CollectionView SelectionMode="Single" WidthRequest="200" HeightRequest="144" x:Name="listViewLanguageMenu" HorizontalOptions="End" VerticalOptions="Start" ItemSizingStrategy="MeasureAllItems">
<CollectionView.ItemTemplate >
<DataTemplate >
<StackLayout Style="{StaticResource languageMenuStyle}" HeightRequest="40" Padding="25,4,5,4" Margin="0" Spacing="0" HorizontalOptions="End" VerticalOptions="Center" Orientation="Horizontal">
<Image VerticalOptions="CenterAndExpand" Aspect="AspectFit" Source="{Binding ImageSourceLanguage}"></Image>
<Label VerticalOptions="CenterAndExpand" FontSize="18" Margin="5,0,0,0" VerticalTextAlignment="Center" Text="{Binding LanguageName}"></Label>
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
如果我像这样在样式中设置背景:
<Style TargetType="StackLayout" x:Key="languageMenuStyle">
<Setter Property="VisualStateManager.VisualStateGroups">
<VisualStateGroupList>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Selected">
<VisualState.Setters>
<Setter Property="SelectableItemBackground" Value="{StaticResource buttonBackgroundColor}"/>
<Setter Property="Visual" Value="Material"></Setter>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="Normal" >
<VisualState.Setters>
<Setter Property="Visual" Value="Material"></Setter>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateGroupList>
</Setter>
</Style>
选择颜色现在已成功更改,但我不再有标准颜色在选择时具有的 Material 波纹。如何更改选择颜色并产生 material 波纹?
谢谢。
你好,
我
我用你的代码来测试,你为stacklayout创建了languageMenuStyle样式,但是stacklayout没有SelectableItemBackground 属性,我修改了stacklayout的languageMenuStyle,collectionview在改变时仍然有material波纹集合视图选择颜色。
<Style x:Key="languageMenuStyle" TargetType="StackLayout">
<Setter Property="VisualStateManager.VisualStateGroups">
<VisualStateGroupList>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="Selected">
<VisualState.Setters>
<Setter Property="BackgroundColor" Value="Green" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateGroupList>
</Setter>
</Style>
我有一个像这样的 Collectionview:
<CollectionView SelectionMode="Single" WidthRequest="200" HeightRequest="144" x:Name="listViewLanguageMenu" HorizontalOptions="End" VerticalOptions="Start" ItemSizingStrategy="MeasureAllItems">
<CollectionView.ItemTemplate >
<DataTemplate >
<StackLayout Style="{StaticResource languageMenuStyle}" HeightRequest="40" Padding="25,4,5,4" Margin="0" Spacing="0" HorizontalOptions="End" VerticalOptions="Center" Orientation="Horizontal">
<Image VerticalOptions="CenterAndExpand" Aspect="AspectFit" Source="{Binding ImageSourceLanguage}"></Image>
<Label VerticalOptions="CenterAndExpand" FontSize="18" Margin="5,0,0,0" VerticalTextAlignment="Center" Text="{Binding LanguageName}"></Label>
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
如果我像这样在样式中设置背景:
<Style TargetType="StackLayout" x:Key="languageMenuStyle">
<Setter Property="VisualStateManager.VisualStateGroups">
<VisualStateGroupList>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Selected">
<VisualState.Setters>
<Setter Property="SelectableItemBackground" Value="{StaticResource buttonBackgroundColor}"/>
<Setter Property="Visual" Value="Material"></Setter>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="Normal" >
<VisualState.Setters>
<Setter Property="Visual" Value="Material"></Setter>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateGroupList>
</Setter>
</Style>
选择颜色现在已成功更改,但我不再有标准颜色在选择时具有的 Material 波纹。如何更改选择颜色并产生 material 波纹?
谢谢。
你好,
我
我用你的代码来测试,你为stacklayout创建了languageMenuStyle样式,但是stacklayout没有SelectableItemBackground 属性,我修改了stacklayout的languageMenuStyle,collectionview在改变时仍然有material波纹集合视图选择颜色。
<Style x:Key="languageMenuStyle" TargetType="StackLayout">
<Setter Property="VisualStateManager.VisualStateGroups">
<VisualStateGroupList>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="Selected">
<VisualState.Setters>
<Setter Property="BackgroundColor" Value="Green" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateGroupList>
</Setter>
</Style>