web-dev-qa-db-ja.com

Xamarin Forms CollectionView：SelectedItemを透明な背景にすることはできません

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>
xamarinxamarin.formsxamarin.ios
3
Sean

これは、カスタムレンダラーを使用して実行できます。

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

        
    }
}

xAMLで

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

Android

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/

0
Lucas Zhang - MSFT