Listview 分隔符插入全宽

Posted 2023-02-23

【中文标题】Listview 分隔符插入全宽

【英文标题】：Listview Separator Inset Full Width

【发布时间】：2017-05-03 20:57:46

【问题描述】：

令我惊讶的是，我没有在网络上找到任何关于这个特定问题的信息。我正在尝试使我的列表视图分隔符插入为全宽。我找到了有关此表格视图的文档，here。但我不清楚如何为列表视图执行此操作？我正在使用 Xamarin Forms listview，试图在 ios 上完成此操作。我想我必须编写一个自定义渲染器，因为列表视图的表单上没有（公开公开的）属性可用。

这是一张在列表视图上发生的好照片，虽然显示的图像来自关于 tableview 的 SO question，而不是 listview，但问题似乎是相同的。

【参考方案1】：

我设法使用自定义渲染器使列表视图分隔符变为全宽。

在 iOS 11 上测试。

[assembly: ExportRenderer(typeof(CustomListView), typeof(CustomListViewRenderer))]
namespace MasterDetailNav1.iOS.CustomRenderers

    public class CustomListViewRenderer : ListViewRenderer
    
        protected override void OnElementChanged(ElementChangedEventArgs<ListView> e)
        
            base.OnElementChanged(e);

            if (Control != null)
            
                Control.SeparatorInset = UIEdgeInsets.Zero;
            
        
    

【参考方案2】：

答案取决于您使用的是 Xamarin Forms 3.0+ 或更早版本。

Xamarin Forms 3.0 及更高版本

Xamarin Forms 3.0 及更高版本上的ListView 现在公开了一个SeparatorStyle 属性，该属性可以设置为SeparatorStyle 枚举值，Default 或FullWidth。这是通过this PR 提供的。

确保将SeparatorStyle 属性设置为FullWidth 以达到想要的效果。

在 Xamarin Forms 3.0 之前

您是正确的，没有通过 Xamarin 表单ListView（最终renders as a UITableView on iOS）公开的属性来更改分隔符宽度。如果您想自己更改分隔符，则必须求助于自定义渲染器并实现您在其他 SO 问题中找到的内容。

作为一种解决方法，您可以禁用分隔符可见性，然后添加一个高度为 1 的 BoxView 以模拟全宽分隔符。

【讨论】：

@jdmdevdotnet 前几天看到 this 就是为了这个。

@hvaughan3 请记住，Stefan 对您的链接的评论是有效的，嵌套 StackLayout 而不是使用 BoxView 可能不是性能方面的最佳选择。

好点，完全同意你的看法。这就是为什么我自己从未实现过链接中的内容。

是的，我永远不会那样做，哈哈，不过我很欣赏这个链接。猜想我们只是要处理非全宽分隔符。太烦人了，这应该是一个属性...

对于 iOS 来说太特殊了，不能添加为 ListView 属性。在创建 ListView 之类的抽象时，Xamarin Forms 必须在所有平台上寻找一个共同点。很难处理所有可能的使用场景，因此将其排除在外。这有点麻烦，但您可以根据自己的特定需求调整渲染器。

【参考方案3】：

现在内置于 Xamarin Forms 3.0：

https://docs.microsoft.com/en-us/xamarin/xamarin-forms/platform/platform-specifics/consuming/ios#setting-the-separator-style-on-a-listview

只需在您的ListView 上将SeparatorStyle 设置为Default 或FullWidth（请注意，这是一个特定于iOS 的平台，android 默认为全宽）：

<ListView ios:ListView.SeparatorStyle="FullWidth"/>

【参考方案4】：

分隔符全宽：

<ListView ios:ListView.SeparatorStyle="FullWidth"/>

列表视图中的分隔符颜色属性

&当视图单元格中没有内容时删除分隔符

https://xamgirl.com/quick-trick-remove-extra-separator-line-in-listview-xamarin-forms-ios/

【讨论】：

这与问题完全无关。 OP 要求分隔符全宽而不是分隔符颜色或在列表视图的 ned 处删除额外的分隔符

抱歉，您可以注意到有一个“:”，因为它应该是 fullWidth 属性的示例。此外，我认为最好展示一个在单元格没有内容并应用颜色时移除分隔符的示例。我更新我的评论，请不要哭了

事实上，当我尝试编辑评论时，我看到： 但它没有显示。