【问题标题】:Alternate row color ListView xamarin forms备用行颜色 ListView xamarin 表单
【发布时间】:2016-08-18 20:33:21
【问题描述】:

我在我的 ListView 上绑定了 ObersvableCollection。

我想改变我的 ListView 的行颜色。

我找到了很多代码,但对我不起作用...如果您可以分享一个示例/示例!

像这样:

但我不知道我该怎么做?

我使用 Visual Studio 2015 / Xamarin 表单。

我的项目必须支持 Android 和 IOS。

感谢您的帮助!

【问题讨论】:

    标签: c# xaml listview xamarin.forms colors


    【解决方案1】:

    您可以为此使用自定义 ListView。如果您的 Cell 继承自 ViewCell,则此方法有效。

    public class AlternatingListView : ListView
    {
        public AlternatingListView(ListViewCachingStrategy cachingStrategy) : base(cachingStrategy)
        { 
        }
    
        protected override void SetupContent(Cell content, int index)
        {
            base.SetupContent(content, index);
    
            var viewCell = content as ViewCell;
            viewCell.View.BackgroundColor = index % 2 == 0 ? Color.Blue : Color.Red;
        }     
    }
    

    【讨论】:

    • 当我使用它时,选定的单元格不再突出显示,有什么想法吗?
    • 不幸的是,它不适用于分组 ListView,因为它假定分组标题单元格为普通行单元格并为它们着色。
    • 您必须使用 XFGloss 来设置颜色,否则您将失去触觉反馈,或者正如@John 所说,这将失去亮点。
    • 如果您将项目添加/删除到列表视图,它将不起作用。它将失去它的顺序,listView 将显示两行,颜色相同。
    【解决方案2】:

    XF 没有内置的方法可以做到这一点。最简单的方法是在您的 Item 模型中包含一个 Index 属性(您必须在将其添加到 List/Collection 时手动设置它)来确定颜色。然后,您可以将 RowColor 属性绑定到您的 ItemTemplate。

    public class MyItem {
    
      public int Index { get; set; }
      public string Name { get; set; }
    
      public Color RowColor { 
        get {
          if (Index % 2) == 0))
            return Color.Red;
          else
            return Color.Blue; 
        }
      }
    }
    

    您还可以使用 ValueConverter 来根据索引行确定颜色 - 这将使您的模型不必确定自己的颜色,这将是一个更简洁的实现。

    【讨论】:

    • 工作,但如果我删除一个项目,我有,例如:red - red - red - blue - red - blue...
    • 我知道,它有明显的缺陷。您也可以尝试构建某种索引集合,
    【解决方案3】:

    另一种选择是在将列表视图传递到绑定上下文之前将其添加到列表视图本身所包含的对象中。

    例如,当从 API 请求列表并反序列化它们时,您可以继续迭代并为列表中的每个对象分配背景颜色属性:

                var response = client.GetAsync(EndPointHelper.GetEndPoint("MaintenanceForEquipment") + "/" + equipmentid).Result;
                var content = await response.Content.ReadAsStringAsync();
                var contentmaintenances = JsonConvert.DeserializeObject<List<Maintenance>>(content);
                var count = 1;
                foreach (var maint in contentmaintenances)
                {
                    maint.BackgroundColor = count % 2 == 0 ? "#A1DBE4" : "#155DB0";
                    maint.TextColor = count % 2 == 0 ? "#529CFF" : "#e9ecf0";
                    count++;
                }
    

    在将访问的记​​录分配给绑定上下文后,您可以在列表视图中的 ItemTemplate 中访问它:

    <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout BackgroundColor="{Binding BackgroundColor}"
                        Orientation="Vertical">
                            <StackLayout Orientation="Horizontal">
                                <Label Text="{Binding EquipmentName}"
                                TextColor="{Binding TextColor}" FontSize="Medium"/>
                                <Label Text="{Binding StartDateString}" TextColor="{Binding TextColor}"></Label>
                                <Label Text="{Binding MaintenanceTypeName}"
                                HorizontalOptions="EndAndExpand"
                                TextColor="{Binding TextColor}" />
                            </StackLayout>
                        </StackLayout>
                    </ViewCell>
    
                </DataTemplate>
            </ListView.ItemTemplate>
    

    如果您想在 Xamarin 代码中使用更少的迭代,您可以通过您正在使用的任何 API 隐式生成背景颜色,假设您也可以访问它,因此只需分配一次并再次访问它调用 API 后在客户端。

    希望这可以帮助任何人通过这个老问题寻找另一种可能的解决方案。

    【讨论】:

      【解决方案4】:

      您可以使用自定义视图单元格。我在我的项目中编写了一个自定义视图单元格并使用 XFGloss(XFGloss 是 Xamarin.Forms 项目的附加组件,它向标准 XF 页面和控件类添加了新属性)来使 listView 的行变得丰富多彩。您的 listView 不会丢失 XFGloss 的触觉反馈。它也适用于分组列表视图。我使用的自定义 viewCell 是:

       public class MyViewCell : ViewCell
          {
              private Color BackgroundColor
              {
                  get => CellGloss.GetBackgroundColor(this);
                  set => CellGloss.SetBackgroundColor(this, value);
              }
      
              public Color EvenColor { get; set; }
              public Color UnevenColor { get; set; }
      
              protected override void OnAppearing()
              {
                  base.OnAppearing();
                  if (!(Parent is ListView listView))
                      throw new Exception(
                          $"The Binding Context is not {typeof(ListView)}. This component works only with {typeof(ListView)}.");
      
                  int index;
                  if (listView.IsGroupingEnabled)
                  {
                      index = listView.TemplatedItems.GetGroupAndIndexOfItem(BindingContext).Item2;
                  }
                  else
                  {
                      index = listView.TemplatedItems.IndexOf(this);
                  }
      
                  if (index != -1)
                      BackgroundColor = index % 2 == 0 ? EvenColor : UnevenColor;
              }
          }
      

      它在 xaml 文件中的用法很简单,如下行:

      <components:MyViewCell EvenColor="White" UnevenColor="#eeeeee">
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2021-12-05
        • 2014-12-05
        • 1970-01-01
        • 1970-01-01
        • 2012-10-18
        • 2019-08-12
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多