更改所选项目的框架和标签颜色-Synfusion Listview Xamarin Forms [英] Change frame and label colors on an item selected - syncfusion listview xamarin forms
问题描述
我一直在尝试更改列表[0]的第一项的颜色，并且当我点击某项时-我需要更改的颜色是框架及其内部的标签.
I have been trying to change the color of the first item of my list[0] and also when I tapped on an Item - the color I need to change is the frame and the labels inside it.
我尝试了以下操作:BackgroundColor="{Binding IsActive, Converter={StaticResource colorConverter}}"
这仅在列表级别有效，而在数据模板内部则无效.我还能做什么?
This works at the list level only, but nothing inside the data template. What else could I do?
我要寻找的内容，在选择时更改边框，背景颜色和文本
what Im looking for , on selection change the border , background color and text
<sync:SfListView x:Name="list"
SelectionMode="Single"
SelectionGesture="Tap"
ItemTapped="Day_ItemTapped">
<sync:SfListView.ItemTemplate >
<DataTemplate>
<Frame x:Name="frame"
BackgroundColor="{Binding IsActive, Converter={StaticResource colorConverter}}"
BorderColor="#D9DADB">
<StackLayout>
<Label Text="{Binding dayoftheweek}"
TextColor="{Binding textcolor}"/>
</StackLayout>
</Frame>
</DataTemplate>
</sync:SfListView.ItemTemplate>
</sync:SfListView>
-@ @使用模板选择器和框架，再次轻按该项目可以恢复其原始颜色吗?
-- @ Using template selector and frame , when you tapped the item again can comeback to its original colors ?
推荐答案
SfListView作为SelectedItemTemplate和HeaderTemplate属性，您可以使用这些属性为所选项目设置单独的模板，并在SfListView上方添加标头.
SfListView as SelectedItemTemplate and HeaderTemplate properties, which you could use you need separate template for selected item and need a header above SfListView.
但是如果您需要在Tap上更改颜色并为第一项设置单独的模板.
But if Color change on Tap and separate Template for first item is what you require.
用于第一项模板
- 为列表项的模型中的索引添加属性.
- 使用模板选择器中的index属性确定模板
Xaml
<ContentPage
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:FirstItem"
mc:Ignorable="d" x:Class="FirstItem.MainPage">
<ContentPage.Resources>
<local:ColorConverter x:Key="colorConverter"/>
<DataTemplate x:Key="defaultTemplate">
<ViewCell>
<Frame x:Name="frame"
BackgroundColor="{Binding IsActive, Converter={StaticResource colorConverter}, ConverterParameter=Frame}"
BorderColor="#D9DADB">
<Frame.GestureRecognizers>
<TapGestureRecognizer
Tapped="TapGestureRecognizer_Tapped"/>
</Frame.GestureRecognizers>
<StackLayout>
<Label
Text="{Binding Name}"
BackgroundColor="{Binding IsActive, Converter={StaticResource colorConverter}, ConverterParameter=Label}"/>
</StackLayout>
</Frame>
</ViewCell>
</DataTemplate>
<DataTemplate x:Key="firstTemplate">
<ViewCell>
<Label
FontSize="32"
Text="I'm Header"/>
</ViewCell>
</DataTemplate>
</ContentPage.Resources>
<StackLayout>
<ListView
x:Name="listView">
<ListView.ItemTemplate>
<local:ListTemplateSelector
DefaultTemplate="{StaticResource defaultTemplate}"
FirstTemplate="{StaticResource firstTemplate}"/>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage>
TemplateSelector
public class ListTemplateSelector : DataTemplateSelector
{
public DataTemplate FirstTemplate { get; set; }
public DataTemplate DefaultTemplate { get; set; }
protected override DataTemplate OnSelectTemplate(object item, BindableObject container)
{
if(item != null)
{
ListItem listItem = (item as ListItem);
if (listItem.Index == 0)
{
return FirstTemplate;
}
}
return DefaultTemplate;
}
}
填充ListView
listView.ItemsSource = new List<ListItem>()
{
new ListItem(){Index=0, Name="Zero"},
new ListItem(){Index=1, Name="One"},
new ListItem(){Index=2, Name="Two"},
new ListItem(){Index=3, Name="Three"},
new ListItem(){Index=4, Name="Four"},
new ListItem(){Index=5, Name="Five"},
new ListItem(){Index=6, Name="Six"},
new ListItem(){Index=7, Name="Seven"}
};
ListView项目模型(ListItem.cs)
ListView Item Model (ListItem.cs)
public class ListItem : INotifyPropertyChanged
{
private bool isActive;
public bool IsActive
{
get
{
return isActive;
}
set
{
isActive = value;
OnPropertyChanged();
}
}
private int index;
public int Index
{
get
{
return index;
}
set
{
index = value;
OnPropertyChanged();
}
}
private string name;
public string Name
{
get
{
return name;
}
set
{
name = value;
OnPropertyChanged();
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
要在点击时更改颜色
- 设置项目布局的点击手势
- 将Item的IsActive属性设置为true
- 使用转换器中的IsActive属性更改为所需的颜色.
TapGesture:
private void TapGestureRecognizer_Tapped(object sender, EventArgs e)
{
((sender as Frame).BindingContext as ListItem).IsActive = !(((sender as Frame).BindingContext as ListItem).IsActive);
}
ColorConverter:
ColorConverter:
public class ColorConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
string sender = (string)parameter;
if ((bool)value)
{
return sender == "Frame" ? Color.Lime : Color.Red;
}
return Color.White;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
这篇关于更改所选项目的框架和标签颜色-Synfusion Listview Xamarin Forms的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
