无法在 Xamarin 表单中更改 CollectionView 内 Frame 的背景颜色答案

【问题标题】：Not able to change the Background color of Frame inside CollectionView in Xamarin forms无法在 Xamarin 表单中更改 CollectionView 内 Frame 的背景颜色
【发布时间】：2021-09-29 14:38:03
【问题描述】：

我想更改框架的背景颜色。我尝试了很多方法，例如 设置 Focused 事件、触发器和背景颜色属性绑定 对我没有任何作用。这是我的 xaml 代码。

<StackLayout Padding="10">
            <CollectionView x:Name="list" ItemsSource="{Binding samplelist}">
                <CollectionView.ItemsLayout>
                    <GridItemsLayout Orientation="Vertical" Span="2" HorizontalItemSpacing="10" VerticalItemSpacing="10" />
                </CollectionView.ItemsLayout>
                <CollectionView.ItemTemplate>
                    <DataTemplate>
                        <StackLayout>
                            <VisualStateManager.VisualStateGroups>
                    <VisualStateGroup Name="CommonStates">                        
                        <VisualState Name="Selected">
                            <VisualState.Setters>
                                <Setter Property="BackgroundColor" Value="Green" />
                            </VisualState.Setters>
                        </VisualState>
                    </VisualStateGroup>
                </VisualStateManager.VisualStateGroups>
                        <Frame  CornerRadius="10"  HasShadow="False" BackgroundColor="{Binding BackgroundTest,Mode=TwoWay}" HeightRequest="75" Margin="5,0,0,0" >
                            <StackLayout Orientation="Vertical">
                                <StackLayout.GestureRecognizers>
                                    <TapGestureRecognizer Command="{Binding Source={x:Reference test}, Path=BindingContext.textselected}"
                                                          CommandParameter="{Binding .}"/>
                                </StackLayout.GestureRecognizers>

这是我在视图模型中的代码

private string _backgroundTest;
        public string BackgroundTest
        {
            get { return _backgroundTest; }
           
           // set => SetProperty(ref _backgroundTest, value);
            set
               {
                  if (value == _backgroundTest)
                       return;

                _backgroundTest = value;
                        OnPropertyChanged(nameof(BackgroundTest));
               }
        }
 private async void clicked(Test test)
        {
            BackgroundTest = "#F95F62";
}

我参考了以下链接 How to change color of Frame control when clicked in Xamarin.Forms with MVVM

Xamarin how to change background color on button click MVVM

但没有任何效果。我不知道如何解决这个问题。有什么建议吗？

【问题讨论】：

BackgroundColor 需要一个颜色，但您返回的是一个字符串。尝试使用转换器，或者只使用颜色属性而不是字符串

标签： c# android xamarin xamarin.forms frame

【解决方案1】：

BackgroundColor 需要一个颜色，但您返回的是一个字符串。尝试使用转换器，或者只使用颜色属性而不是字符串

选项 A：使用 Value converter 将字符串转换为颜色（查看文档）

创建转换器类
将其添加到您的 App.Xaml

修改你的 Frame 绑定 Xaml

<Frame  CornerRadius="10"  HasShadow="False" BackgroundColor="{Binding BackgroundTest,Mode=TwoWay, Converter={StaticResource colorConverter}}" HeightRequest="75" Margin="5,0,0,0" >

选项 B：将绑定修改为 Color 类型

private Color _backgroundTest;
        public Color BackgroundTest
        {
            get { return _backgroundTest; }           
            set
               {
                  if (value == _backgroundTest)
                       return;

                _backgroundTest = value;
                        OnPropertyChanged(nameof(BackgroundTest));
               }
        }
 private async void clicked(Test test)
        {
            BackgroundTest = ColorConverters.FromHex("#F95F62");
}

对于这两种情况：

在您的代码中，Frame 的 BackgroundColor 位于 CollectionView 中，因此绑定将在 Item 中查找属性。它应该在 ViewModel 中查看它

BackgroundColor="{Binding Source={RelativeSource AncestorType={x:Type local:ItemsViewModel}},Path=BackgroundTest}"

【讨论】：

试过都不起作用。
我用更简单的 XAML 进行了测试，它运行良好。我再次检查了代码，问题是它正在寻找collectionview.Item 中的绑定属性。您必须添加一个 RelativeSource 绑定，例如 BackgroundColor="{Binding Source={RelativeSource AncestorType={x:Type local:ItemsViewModel}},Path=BackgroundTest}"
这就像一个魅力。谢谢。