Xamarin表单:如何更改Collectionview SelectedItem的文本颜色?

Xamarin表单:如何更改Collectionview SelectedItem的文本颜色?,xamarin,xamarin.forms,uicollectionview,carousel,Xamarin,Xamarin.forms,Uicollectionview,Carousel,我有一个CarouselPage有5个孩子,每个孩子都有一个水平集合视图。在Collectionview中选择项目或滑动页面时,我需要指定不同的文本颜色,并需要为所选项目添加下划线。我试过如下方法: CarouselHomePage.cs public partial class CarouselHomePage : CarouselPage { public List<Activity> activityList { get; set; } public Carou

我有一个
CarouselPage
有5个孩子,每个孩子都有一个水平集合视图。在Collectionview中选择项目或滑动页面时,我需要指定不同的文本颜色,并需要为所选项目添加下划线。我试过如下方法:

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));
    }
}
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));
    }
}
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);
        }
    }
}
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>
如果我手动滑动页面,上面的代码将起作用。直接点击collectionview项目时,滚动不起作用

protected override void OnAppearing()
{
    ActivityList.ScrollTo(4);
}
我上传了一个示例项目。

关于下划线没有显示,原因是CollectionView的
高度请求
设置得太小,带有
30

将其修改为上述
35
,它将正确显示。例如:

<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>

40
60
30
其效果是:

关于所选问题,这是

关于下划线不显示,原因是集合视图的
高度请求
设置得太小,使用
30

将其修改为上述
35
,它将正确显示。例如:

<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>

40
60
30
其效果是:

关于所选问题,这是


感谢分享样品,我会检查一下。我发现多次创建了
CollectionView
,这应该是无法正确显示的原因。这里建议不要将
CollectionView
添加到每个子页面。@JuniorJiang MSFT我上传了一个示例视频。@JuniorJiang MSFT这是我实际的项目屏幕,在每一页我都显示数据,所以每一页都有collectionview,请浏览视频。明白了。然后你需要一个
CarouselPage
。如果想要达到视频效果,你需要让
CarouselPage
包含
CollectionView
CarouselView
。感谢分享示例,我会检查一下。我发现多次创建了
CollectionView
,这应该是无法正确显示的原因。这里建议不要将
CollectionView
添加到每个子页面。@JuniorJiang MSFT我上传了一个示例视频。@JuniorJiang MSFT这是我实际的项目屏幕,在每一页我都显示数据,所以每一页都有collectionview,请浏览视频。明白了。然后您需要一个
CarouselPage
。如果要实现该视频的效果,您需要使
CarouselPage
包含
CollectionView
CarouselView