【问题标题】:Xamarin Forms CollectionView: Cannot give SelectedItem Transparent backgroundXamarin Forms CollectionView:无法为 SelectedItem 提供透明背景
【发布时间】:2022-04-15 22:20:31
【问题描述】:

我正在使用 CollectionView,当用户选择一个项目时,我根本不希望 SelectedItem 显示背景颜色。我已尝试通过按照 Xamarin 文档中的说明使用 VisualStateManager 将 BackgroundColor 属性设置为透明来实现此效果。但是,项目的背景不是不可见,而是在选择时变为灰色。该代码有效。如果我将其设置为红色,我会看到红色。但我不能让背景完全消失。

这发生在 iOS 中。

谁能告诉我怎么做?

这是我的代码:

<Style TargetType="ContentView">
                <Setter Property="VisualStateManager.VisualStateGroups">
                    <VisualStateGroupList>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal" />
                            <VisualState x:Name="Selected">
                                <VisualState.Setters>
                                    <Setter Property="BackgroundColor"
                                        Value="Transparent" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateGroupList>
                </Setter>
            </Style>

<CollectionView Grid.Row="0" ItemsSource="{Binding Lessons}"  BackgroundColor="Transparent"
                  SelectedItem="{Binding SelectedLesson, Mode=TwoWay}" HorizontalOptions="FillAndExpand"

                        SelectionMode="Single"
                        cal:Message.Attach="[Event SelectionChanged] = [Action ActivateLesson]">
            <CollectionView.ItemTemplate >
                <DataTemplate x:DataType="engineVm:LessonViewModel">
                    <ContentView BackgroundColor="Transparent" cal:View.Model="{Binding}" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Margin="0, 0, 0, 20" />
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>

【问题讨论】:

  • 我对 CollectionView 不太熟悉。这是我必须使用 ListView stackoverflow.com/questions/59671543/… 的解决方案,可能会有所帮助
  • 谢谢,使用该解决方案,您是否尝试使其透明而不仅仅是不同的颜色?
  • 我尝试了不同的颜色,但不明白为什么透明的行为会有所不同,但不知道我曾经使用透明进行过明确测试
  • @Lucas.. 我很快就会用 ListView 再试一次。我相信这个解决方案会奏效。我开始遇到 CollectionView 的一个错误,当我将设备旋转到横向模式然后再回到纵向模式时,collectionView 会丢失列表中的第一项。 ListView 不这样做。
  • 使用文档中推荐的方法,它使用VisualStateManager来改变背景颜色。 docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/…

标签: xamarin xamarin.forms xamarin.ios


【解决方案1】:

这可以通过使用自定义渲染器

来完成
using UIKit;
using Xamarin.Forms.Platform.iOS;
using Xamarin.Forms;

using App7.iOS;

[assembly:ExportRenderer(typeof(ViewCell),typeof(MyViewCellRenderer))]

namespace App7.iOS
{
    public class MyViewCellRenderer: ViewCellRenderer
    {
        public override UITableViewCell GetCell(Cell item, UITableViewCell reusableCell, UITableView tv)
        {
            var cell= base.GetCell(item, reusableCell, tv);

            cell.SelectedBackgroundView = new UIView
            {
                BackgroundColor = Color.Transparent.ToUIColor(),
            };
            cell.SelectionStyle = UITableViewCellSelectionStyle.None;

            return cell;
        }

        
    }
}

在xml中

<CollectionView.ItemTemplate >
  <DataTemplate >
     <ViewCell>
         <ContentView BackgroundColor="Transparent" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Margin="0, 0, 0, 20" />
     </ViewCell>
  </DataTemplate>
</CollectionView.ItemTemplate>

更新

您可以使用来自 Nuget 的插件 FlowListView。它提供了类似 CollectionView 的功能。

您可以在禁用 ListView 行突出显示的平台特定项目中为 FlowListViewInternalCell 创建自定义渲染器。

iOS

using System;
using DLToolkit.Forms.Controls;
using DLToolkitControlsSamples.iOS;
using UIKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;

[assembly: ExportRenderer(typeof(FlowListViewInternalCell), typeof(FlowListViewInternalCellRenderer))]
namespace DLToolkitControlsSamples.iOS
{
    // DISABLES FLOWLISTVIEW ROW HIGHLIGHT
    public class FlowListViewInternalCellRenderer : ViewCellRenderer
    {
        public override UIKit.UITableViewCell GetCell(Xamarin.Forms.Cell item, UIKit.UITableViewCell reusableCell, UIKit.UITableView tv)
        {
                    tv.AllowsSelection = false;
            var cell = base.GetCell(item, reusableCell, tv);
            cell.SelectionStyle = UITableViewCellSelectionStyle.None;

            return cell;
        }
    }
}

安卓

using System;
using DLToolkit.Forms.Controls;
using DLToolkitControlsSamples.Droid;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

[assembly: ExportRenderer(typeof(FlowListViewInternalCell), typeof(FlowListViewInternalCellRenderer))]
namespace DLToolkitControlsSamples.Droid
{
    // DISABLES FLOWLISTVIEW ROW HIGHLIGHT
    public class FlowListViewInternalCellRenderer : ViewCellRenderer
    {
        protected override Android.Views.View GetCellCore(Cell item, Android.Views.View convertView, Android.Views.ViewGroup parent, Android.Content.Context context)
        {
            var cell = base.GetCellCore(item, convertView, parent, context);

            var listView = parent as Android.Widget.ListView;

            if (listView != null)
            {
                listView.SetSelector(Android.Resource.Color.Transparent);
                listView.CacheColorHint = Android.Graphics.Color.Transparent;
            }

            return cell;
        }
    }
}

有关插件的更多详细信息和使用方法,您可以查看https://github.com/daniel-luberda/DLToolkit.Forms.Controls/tree/master/FlowListView/

【讨论】:

  • 谢谢,卢卡斯。我可能会再次尝试使用 CollectionView,但请参阅上面关于 CollectionView 错误的评论。现在我回到了 ListView,因为我在 CollectionView 中发现了 2 个错误。其中之一涉及在 SlideOverKit 的下拉菜单内部使用时出现奇怪的显示问题。有时即使在我关闭 SlideOver 菜单后它仍会出现在屏幕上。有时 CollectionVIew 在旋转设备后会丢失其中一个绑定的项目。也许我的设置有问题,但我没有遇到 ListView 的这些问题。谢谢!
  • 我很乐意试一试并将其标记为正确。我今晚不能这样做,但会尽快这样做。谢谢!
  • 不,当我尝试将 ViewCell 放入 CollectionView 的 DataTemplate 时,它​​会引发以下异常并崩溃:
  • CollectionView] 在 prepareLayout 调用(即重入调用)正在进行时准备布局的尝试已被忽略。请提交一个错误。 UICollectionView 实例是 (; layer = ; contentOffset: {0, 0}; contentSize: {372.5, 0};adjustedContentInset: {0, 0, 0, 0}; 布局: ; dataSource:
  • 更正我上面的评论:当我尝试将 ViewCell 放入 CollectionView 的 DataTemplate 时,它​​会引发以下异常并崩溃:值不能为空。参数名称:view ...我猜它不应该有像ListView这样的ViewCell。无论是否使用 ViewCell,都会出现以“[CollectionView] 尝试准备布局”开头的长错误消息。但是,该错误不会使其崩溃。 CollectionView 有问题。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2016-09-24
  • 2019-02-09
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-10-31
  • 1970-01-01
相关资源
最近更新 更多