Xamarin形式：如何更改Collectionview SelectedItem的文本颜色？

Question

我有一个有5个孩子的CarouselPage，每个孩子都有一个水平的收藏视图。在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));
    }
}

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);
        }
    }
}

我在if语句中具有相应标题的所有其他子页面上添加了相同的代码。但是所选的页面标题颜色不起作用，并且未显示下划线。

屏幕截图：

此外，如果我选择集合视图中的最后一个项目，则需要将最后一个孩子的集合滚动到最后一个项目。为此，我使用了Collectioview的ScrollTo功能。但这也不起作用。

protected override void OnAppearing()
{
    ActivityList.ScrollTo(4);
}

如果我手动滑动页面，上面的代码将起作用。当直接点击collectionview项目时，滚动不起作用。

我已经上传了一个示例项目here。

Answer 1

关于下划线未显示，原因是CollectionView的HeightRequest设置为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>

效果：

关于选定的问题，我将在此处共享一个示例项目。