Xamarin形式:如何更改Collectionview SelectedItem的文本颜色? [英] Xamarin Forms: How to Change the textcolor of Collectionview SelectedItem?
本文介绍了Xamarin形式:如何更改Collectionview SelectedItem的文本颜色?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个 CarouselPage ，其中有5个孩子，每个孩子都有一个水平集合视图.在Collectionview中选择一个项目或在页面上滑动时，我需要使用不同的文本颜色，并且需要为所选项目添加下划线.我尝试过如下所示:
CarouselHomePage.cs
公共局部类CarouselHomePage:CarouselPage{公共列表<活动>activityList {get;放;}公共CarouselHomePage(){InitializeComponent();activityList = new List< Activity>();AddActivities();MessagingCenter.Subscribe< App，string>((App)Xamarin.Forms.Application.Current，"child"，(s，child)=>{CurrentPage = Children [Int32.Parse(child)];});}私有void AddActivities(){activityList.Add(new Activity(){标题="PageNumber1"});activityList.Add(new Activity(){标题="PageNumber2"});activityList.Add(new Activity(){标题="PageNumber3"});activityList.Add(new Activity(){标题="PageNumber4"});activityList.Add(new Activity(){标题="PageNumber5"});AddChild(activityList);}公共无效AddChild(List< Activity> activityList){this.Children.Add(new PageNumber1(activityList));this.Children.Add(new PageNumber2(activityList));this.Children.Add(new PageNumber3(activityList));this.Children.Add(new PageNumber4(activityList));this.Children.Add(new PageNumber5(activityList));}} Activity.cs
公共类活动{公共字符串Title {get;放;}公共布尔知名度{放;}公众视野{放{如果(值！=空){可见性=值；NotifyPropertyChanged();}}得到{返回可见性；}}私人颜色textColor;公共颜色TextColor{放{如果(值！=空){textColor =值；NotifyPropertyChanged();}}得到{返回textColor;}}公共事件PropertyChangedEventHandler PropertyChanged;私人无效NotifyPropertyChanged([CallerMemberName]字符串propertyName ="){PropertyChanged?.Invoke(this，new PropertyChangedEventArgs(propertyName));}} PageNumber1.xaml
< ContentPage.Content>< StackLayout Orientation =垂直">< CollectionViewSelectionMode ="Single"x:Name ="ActivityList"Margin ="5,10,5,10"SelectionChanged ="TagItemTapped"ItemsLayout ="HorizontalList">< CollectionView.ItemTemplate>< DataTemplate>< StackLayoutOrientation =垂直"Margin ="15"><标签TextColor ="{Binding TextColor}"HorizontalTextAlignment ="Center"VerticalTextAlignment ="Center"文字="{装订标题}">< Label.FontSize>< OnIdiom x:TypeArguments ="x:Double">< OnIdiom.Phone> 18</OnIdiom.Phone>< OnIdiom.Tablet> 27< OnIdiom.Tablet>< OnIdiom.Desktop> 18</OnIdiom.Desktop></OnIdiom></Label.FontSize></标签>< BoxViewHeightRequest ="2"IsVisible ="{绑定可见性}"BackgroundColor ="{Binding TextColor}"HorizontalOptions ="CenterAndExpand"VerticalOptions =开始"/></StackLayout></DataTemplate></CollectionView.ItemTemplate>< CollectionView.HeightRequest>< OnIdiom x:TypeArguments ="x:Double">< OnIdiom.Phone> 30</OnIdiom.Phone>< OnIdiom.Tablet> 60</OnIdiom.Tablet>< OnIdiom.Desktop> 30</OnIdiom.Desktop></OnIdiom></CollectionView.HeightRequest></CollectionView>< Label Text ="Welcome to PageNumber1"VerticalOptions ="CenterAndExpand"HorizontalOptions ="CenterAndExpand"/></StackLayout></ContentPage.Content> PageNumber1.xaml.cs
公共局部类PageNumber1:ContentPage{公用PageNumber1(List< Activity> activityList){InitializeComponent();如果(activityList == null){ActivityList.IsVisible = false;}别的{对于(int i = 0; i< activityList.Count; i ++){如果(activityList [i] .Title =="PageNumber1"){activityList [i] .TextColor = Color.FromHex(#26b4d8");activityList [i] .Visibility = true;}别的{activityList [i] .TextColor = Color.Gray;activityList [i] .Visibility = false;}}ActivityList.ItemsSource = activityList;}}公共无效TagItemTapped(对象发送者，SelectionChangedEventArgs e){var selectedItem =(e.CurrentSelection.FirstOrDefault()作为Activity)；如果(selectedItem！= null){字符串childnumber =";如果(selectedItem.Title =="PageNumber1"){childnumber ="0";}否则，如果(selectedItem.Title =="PageNumber2"){childnumber ="1";}否则，如果(selectedItem.Title =="PageNumber3"){childnumber ="2";}否则，如果(selectedItem.Title =="PageNumber4"){childnumber ="3";}否则，如果(selectedItem.Title =="PageNumber5"){childnumber ="4";}MessagingCenter.Send< App，string>(((App)Xamarin.Forms.Application.Current，"child"，childnumber);}}} 我在所有其他子页面上添加了相同的代码，并在if语句中添加了相应的标题.但是所选的页面标题颜色不起作用，并且未显示下划线.
截屏:
另外，如果我选择collectionview中的最后一个项目，则需要将最后一个子项目上的集合滚动到最后一个项目.为此，我使用了Collectioview的 ScrollTo 功能.但这也不起作用.
受保护的重写void OnAppearing(){ActivityList.ScrollTo(4);} 如果我手动滑动页面，上面的代码将起作用.直接点击collectionview项时，滚动不起作用.
我已经在
关于选定的问题，这是
I have a CarouselPage having 5 children and every child has a horizontal collection view. When selecting an item in Collectionview or swiping the pages, I need to give a different text color and need to add an underline for the selected item. I have tried like below:
CarouselHomePage.cs
public partial class CarouselHomePage : CarouselPage
{
public List<Activity> activityList { get; set; }
public CarouselHomePage()
{
InitializeComponent();
activityList = new List<Activity>();
AddActivities();
MessagingCenter.Subscribe<App, string>((App)Xamarin.Forms.Application.Current, "child", (s, child) =>
{
CurrentPage = Children[Int32.Parse(child)];
});
}
private void AddActivities()
{
activityList.Add(new Activity() { Title = "PageNumber1" });
activityList.Add(new Activity() { Title = "PageNumber2" });
activityList.Add(new Activity() { Title = "PageNumber3" });
activityList.Add(new Activity() { Title = "PageNumber4" });
activityList.Add(new Activity() { Title = "PageNumber5" });
AddChild(activityList);
}
public void AddChild(List<Activity> activityList)
{
this.Children.Add(new PageNumber1(activityList));
this.Children.Add(new PageNumber2(activityList));
this.Children.Add(new PageNumber3(activityList));
this.Children.Add(new PageNumber4(activityList));
this.Children.Add(new PageNumber5(activityList));
}
}
Activity.cs
public class Activity
{
public string Title { get; set; }
public bool visibility { get; set; }
public bool Visibility
{
set
{
if (value != null)
{
visibility = value;
NotifyPropertyChanged();
}
}
get
{
return visibility;
}
}
private Color textColor;
public Color TextColor
{
set
{
if (value != null)
{
textColor = value;
NotifyPropertyChanged();
}
}
get
{
return textColor;
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void NotifyPropertyChanged([CallerMemberName] String propertyName = "")
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
PageNumber1.xaml
<ContentPage.Content>
<StackLayout Orientation="Vertical">
<CollectionView
SelectionMode="Single"
x:Name="ActivityList"
Margin="5,10,5,10"
SelectionChanged="TagItemTapped"
ItemsLayout="HorizontalList">
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout
Orientation="Vertical"
Margin="15">
<Label
TextColor="{Binding TextColor}"
HorizontalTextAlignment="Center"
VerticalTextAlignment="Center"
Text="{Binding Title}">
<Label.FontSize>
<OnIdiom x:TypeArguments="x:Double">
<OnIdiom.Phone>18</OnIdiom.Phone>
<OnIdiom.Tablet>27</OnIdiom.Tablet>
<OnIdiom.Desktop>18</OnIdiom.Desktop>
</OnIdiom>
</Label.FontSize>
</Label>
<BoxView
HeightRequest="2"
IsVisible="{Binding Visibility}"
BackgroundColor="{Binding TextColor}"
HorizontalOptions="CenterAndExpand"
VerticalOptions="Start"/>
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
<CollectionView.HeightRequest>
<OnIdiom x:TypeArguments="x:Double">
<OnIdiom.Phone>30</OnIdiom.Phone>
<OnIdiom.Tablet>60</OnIdiom.Tablet>
<OnIdiom.Desktop>30</OnIdiom.Desktop>
</OnIdiom>
</CollectionView.HeightRequest>
</CollectionView>
<Label Text="Welcome to PageNumber1"
VerticalOptions="CenterAndExpand"
HorizontalOptions="CenterAndExpand" />
</StackLayout>
</ContentPage.Content>
PageNumber1.xaml.cs
public partial class PageNumber1 : ContentPage
{
public PageNumber1(List<Activity> activityList)
{
InitializeComponent();
if (activityList == null)
{
ActivityList.IsVisible = false;
}
else
{
for (int i = 0; i < activityList.Count; i++)
{
if (activityList[i].Title == "PageNumber1")
{
activityList[i].TextColor = Color.FromHex("#26b4d8");
activityList[i].Visibility = true;
}
else
{
activityList[i].TextColor = Color.Gray;
activityList[i].Visibility = false;
}
}
ActivityList.ItemsSource = activityList;
}
}
public void TagItemTapped(object sender, SelectionChangedEventArgs e)
{
var selectedItem = (e.CurrentSelection.FirstOrDefault() as Activity);
if (selectedItem != null)
{
string childnumber = "";
if (selectedItem.Title == "PageNumber1")
{
childnumber = "0";
}
else if (selectedItem.Title == "PageNumber2")
{
childnumber = "1";
}
else if (selectedItem.Title == "PageNumber3")
{
childnumber = "2";
}
else if (selectedItem.Title == "PageNumber4")
{
childnumber = "3";
}
else if (selectedItem.Title == "PageNumber5")
{
childnumber = "4";
}
MessagingCenter.Send<App, string>((App)Xamarin.Forms.Application.Current, "child", childnumber);
}
}
}
I have added the same code on all the other child pages with the corresponding title in the if statement. But the selected page title color is not working and underline is not showing.
Screenshot:
Also if I select the last item in the collectionview, I need to scroll the collection on the last child to the last item. For this I have used ScrollTo feature of Collectioview. But that is also not working.
protected override void OnAppearing()
{
ActivityList.ScrollTo(4);
}
The above code will work if I manually swipe the pages. When directly tap the collectionview item, the scrolling is not working.
I have uploaded a sample project here.
解决方案
About underline not showing , the reason is HeightRequest of CollectionView setted too small with 30 .
Modify that to above 35 , it will show correcttly . Such as :
<CollectionView.HeightRequest>
<OnIdiom x:TypeArguments="x:Double">
<OnIdiom.Phone>40</OnIdiom.Phone>
<OnIdiom.Tablet>60</OnIdiom.Tablet>
<OnIdiom.Desktop>30</OnIdiom.Desktop>
</OnIdiom>
</CollectionView.HeightRequest>
The effect :
About selected problem , this is the sample project here .
这篇关于Xamarin形式:如何更改Collectionview SelectedItem的文本颜色?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
