如何构造复杂的表格元素

Posted

技术标签:

【中文标题】如何构造复杂的表格元素【英文标题】:How to structure complicated table elements 【发布时间】:2017-09-25 08:00:43 【问题描述】:

通常表格很容易管理,特别是因为自动布局可以完成大部分繁重的工作以确定单元格大小等等。但是,在某些情况下,事情会变得有点棘手,比如有一张民意调查表。

在这种情况下,投票由具有可变描述长度的标签、具有不同大小的图像和一组供用户选择的选项组成(本质上是一个嵌套表)。

----方法一-----

将每个投票分成多个单元格

优点: 将来很容易向投票中添加更多字段,布局更容易为每个元素的单个单元格处理,尤其是在嵌套表的情况下。如果您需要退回到手动计算特定单元格的大小,您可以在保持其他一切自动运行的同时完成此操作。

缺点: 如果您有多个民意调查,您需要跟踪哪个单元格对应于哪个民意调查,并且您通常需要做一些算术来跟踪什么。

----方法2-----

让包含所有这些元素的投票成为一个大单元格,并适当地设置它们之间的约束。

优点: 它易于实现,以一对一的方式将您的模型映射到您的单元,而无需对数据进行多重解复用。

缺点: 自动布局可能会因嵌套表而变得棘手。例如,在这种情况下,对于单元格的高度,我曾经返回 UITableViewAutomaticDimension,直到我意识到这不会削减它,因为存在可以是任何大小的嵌套表。计算嵌套表的内容大小非常简单,但是,这意味着您必须计算所有其他元素,并且现在您返回的是特定高度而不是自动的。你的工作变得如此艰难。

----Outro----

您如何处理此类问题?方法 1、2 还是完全不同的方法?我在这里简化了元素的结构以使内容更具可读性,其中涉及更多神秘的东西,例如包含您看到的元素的阴影视图以创建浮动卡片的错觉等。

谢谢大家。

P.S:如果在某个地方已经有关于这个的答案,请指出我,我只是在这方面还没有找到太多。希望这篇文章可以引发一些关于此事的讨论,并帮助我的其他人。

【问题讨论】:

您能否使用分段表格,每个部分使用方法 1 进行一次投票。您甚至可以使用展开/折叠方法,点击部分(投票)标题可展开该投票。只要您确保每个单元格都有一个从顶部到底部的垂直约束链,自动调整大小就不会太难。 自动调整大小似乎没有考虑到嵌套表格的整个高度,我在嵌套表格上留下了一个可滚动的表格,我一次只能看到它的一部分:/。不过,分段部分听起来是个不错的计划 是的,嵌套表很难看;这就是为什么我建议采用分段方法;这样你就只有一个 tableview 和一个与之关联的滚动视图。 我会试一试,听起来是一个合理的方法。我想我正在寻找更通用的东西,但认为我需要不止一层嵌套表可能是不现实的。非常感谢。如果您不介意将其作为答案回答,那么我可以接受它供其他人查看。 【参考方案1】:

Paulw11 建议的直接替代方法是使用部分和方法 1。尽管这可能不包括表中表中表的情况,但对于我想象的几乎所有可以想象到的具有良好用户界面的情况来说,这已经足够了。

【讨论】:

以上是关于如何构造复杂的表格元素的主要内容,如果未能解决你的问题,请参考以下文章

表格标签

如何让bootstrap表格自动出现水平滚动条

Cypress学习4-table表格元素(别名使用Aliasing)

Cypress学习4-table表格元素(别名使用Aliasing)

关系数据库域关系演算语言QBE

html5呈现table使用啥标签