如何访问 collection 视图中的 child 元素？

Question

我正在 collection 视图中制作框架，我想在 select 框架时更改框架的背景颜色，但问题是我无法从 [=23] 访问我的框架=] 查看，当我点击框架时，它会选择默认的橙色。

我在我的框架模型中做了一些小改动 class 我想更改标签的文本颜色，就像我们在此处更改框架颜色一样是代码，但它不起作用此代码在框架模型中 class

public Color LabelColor
    {
        set
        {
            if (txtcolor != value)
            {
                txtcolor = value;

                if (PropertyChanged != null)
                {
                    PropertyChanged(this, new PropertyChangedEventArgs("labelcolor"));
                }
            }
        }
        get
        {
            return firstFrameBackColor;
        }
    }

我在我的 CS 中访问这个 Class

 FrameModel previous = (e.PreviousSelection.FirstOrDefault() as FrameModel);
        FrameModel current = (e.CurrentSelection.FirstOrDefault() as FrameModel);

        //Set the current to the color you want
        try
        {
            current.FirstFrameBackColor = Color.FromRgb(74, 152, 247);
            current.LabelColor = Color.White;
            // current.SecondFrameBackColor = Color.Green;
        }
        catch (Exception ex)
        {
            ex.Message.ToString();
            throw;
        }

       // current.SecondFrameBackColor = Color.Green;

        if (previous != null)
        {
            //Reset the previous to defaulr color
            previous.FirstFrameBackColor = Color.White;
            current.LabelColor = Color.Black;
            //previous.SecondFrameBackColor = Color.Purple;
        }

Answer 1

来自CollectionView Spec:

The orange color is actually the value for state_activated in your Android app's theme. So not everyone will see orange; that's just the AppCompat default. This is the fallback value if nothing else has been specified.

When an item in the CollectionView is selected, the VisualState for the root Forms element of the item is changed to Selected. You can use the VisualStateManager to manage what a selected item looks like. For an example of this, take a look at the SelectionModeGallery in Control Gallery. On that page, the background color for the selected item is being set to LightSkyBlue. Any other Forms property can also be set; for instance, try adding to the tag.

At the moment, this is somewhat limited; you can really only modify the root element in your ItemTemplate.

因此，要回答您的问题，它不会起作用，因为您的框架不是您的 ItemTemplate 中的根元素。您可以在 StackLAyout 或 SelectedItem 中应用它，手动更改元素的背景颜色。

Answer 2

when i give x:name property to my child views inside the collection view i cant access them in my C# class

您无法通过名称从代码隐藏中访问模板中的项目，因为在运行时间创建的该模板可能有 0 或 1000 个副本。

参考这个讨论：cannot-reach-control-x-name-inside-listview

在您的情况下，您可以将背景属性 binding 设置为模型中的属性，而不是访问模板中的控件，例如：

            <Frame
                        WidthRequest="20"
                        HeightRequest="20"   
                        Margin="0,-30,0,10"
                        HorizontalOptions="End"
                        CornerRadius="10"
                        Padding="5"
                        BackgroundColor="{Binding SecondFrameBackColor}">
                <Label
                            Text="5"
                            TextColor="#FFFFFF"
                            HorizontalTextAlignment="Center"
                            VerticalTextAlignment="Center"                                       
                    >

                </Label>
            </Frame>

这是模型：

class myModel : INotifyPropertyChanged
{

    Color firstFrameBackColor;

    Color secondFrameBackColor;

    public event PropertyChangedEventHandler PropertyChanged;

    public myModel()
    {

    }

    public Color FirstFrameBackColor
    {
        set
        {
            if (firstFrameBackColor != value)
            {
                firstFrameBackColor = value;

                if (PropertyChanged != null)
                {
                    PropertyChanged(this, new PropertyChangedEventArgs("FirstFrameBackColor"));
                }
            }
        }
        get
        {
            return firstFrameBackColor;
        }
    }

    public Color SecondFrameBackColor
    {
        set
        {
            if (secondFrameBackColor != value)
            {
                secondFrameBackColor = value;

                if (PropertyChanged != null)
                {
                    PropertyChanged(this, new PropertyChangedEventArgs("SecondFrameBackColor"));
                }
            }
        }
        get
        {
            return secondFrameBackColor;
        }
    }
}

项目来源：

public partial class MainPage : ContentPage
{
    ObservableCollection<myModel> models = new ObservableCollection<myModel>();

    public MainPage()
    {
        InitializeComponent();

        myModel model1 = new myModel() { FirstFrameBackColor = Color.White, SecondFrameBackColor = Color.Purple };
        myModel model2 = new myModel() { FirstFrameBackColor = Color.White, SecondFrameBackColor = Color.Purple };
        myModel model3 = new myModel() { FirstFrameBackColor = Color.White, SecondFrameBackColor = Color.Purple };
        myModel model4 = new myModel() { FirstFrameBackColor = Color.White, SecondFrameBackColor = Color.Purple };
        myModel model5 = new myModel() { FirstFrameBackColor = Color.White, SecondFrameBackColor = Color.Purple };
        myModel model6 = new myModel() { FirstFrameBackColor = Color.White, SecondFrameBackColor = Color.Purple };
        myModel model7 = new myModel() { FirstFrameBackColor = Color.White, SecondFrameBackColor = Color.Purple };

        models.Add(model1);
        models.Add(model2);
        models.Add(model3);
        models.Add(model4);
        models.Add(model5);
        models.Add(model6);
        models.Add(model7);

        CNlist.ItemsSource = models;
    }

然后在 SelectionChanged 事件中，将背景更改为您想要的：

private void CNlist_SelectionChanged(object sender, SelectionChangedEventArgs e)
{

    myModel previous = (e.PreviousSelection.FirstOrDefault() as myModel) ;
    myModel current = (e.CurrentSelection.FirstOrDefault() as myModel);

    //Set the current to the color you want
    current.FirstFrameBackColor = Color.Pink;
    current.SecondFrameBackColor = Color.Green;

    if (previous != null)
    {
        //Reset the previous to defaulr color
        previous.FirstFrameBackColor = Color.White;
        previous.SecondFrameBackColor = Color.Purple;
    }

}

结果如下：

我更新了我的样本here，你可以检查一下。让我知道它是否适合你！

如何访问 collection 视图中的 child 元素？

how to access child elements in a collection view?

xamarin.forms

xamarin.android

xamarin.ios

uicollectionview

collectionview