找回密码
 立即注册

QQ登录

只需一步,快速开始

LukeLiu
超级版主   /  发表于:2019-9-29 16:44  /   查看:4156  /  回复:2
本帖最后由 LukeLiu 于 2019-9-29 17:20 编辑

本文需要读者了解活字格前置背景知识:

1. 隐藏区域
2. 图文列表使用
3. 手机页面的概念

如果你已经了解了以上前置背景知识,恭喜你,学习本篇教程会让你更灵活组合使用这些技能,在手机页面编辑表格的场景。如果你还不了解列出的前置背景知识点,别灰心,通过活字格官方的学习手册可以快速掌握这些技能,我在这里等你哈。

--------------------------------------------------------------------

又是一个人静静的学习活字格的下午,特别喜欢一个人这样的时光,看着电脑屏幕,打开活字格,打开新世界。
意境转折,噫,手机页面放上去的表格,为什么不能开启编辑呢:

image.png342185363.png



转身去问了Tracy.Liu,
原来,对于手机,屏幕偏向竖直方向使用,横向的空间其实很小,直接在手机上编辑交互式是不友好的。
在手机页面上,修改数据可以在详情页面上去做,再者,如果一个表格的字段很多,页面垂直方向上依次排列就好。


上图给出了手机修改数据通过详情页的这一方式的示例。

下面,我通过采用之前胡老板在这篇帖子中的回答,获得的启发,使用图文列表,在手机页面开启表格编辑的技能:

1. 开始,把之前表格打入到隐藏区域,腾出地方:

image.png598054198.png



2. 制作一个像模像样的表头,毕竟在手机页面上需要的数据展示形式依然是表格:

image.png15861205.png


3. 选中下方需要展示数据的区域,设置为图文列表:

设置图文列表.gif

4. 设置表格的列名,不要忘了黑科技——自动列名:

自动设置列名.gif



5. 编辑图文列表模板,记得要做出表格的效果:

image.png815855407.png


6. 设置可编辑的项为对应类型的单元格组件,这里我需要“是否完成”设置为下拉框:

图文列表设置编辑项.gif

7. 回到图文列表所在页面,WOW,真真的像表格:
image.png678177489.png

8. 行不行咱运行看效果:

手机图文列表.gif


通过使用前置背景知识点提到的三个技能,就制作出了在手机页面中编辑表格,酷~
附件为示例工程文件。


手机编辑表格.fgcc

49.31 KB, 下载次数: 89

2 个回复

倒序浏览
Simon.hu讲师达人认证 悬赏达人认证 活字格认证
超级版主   /  发表于:2019-9-30 17:58:54
沙发
谢谢,分享!
回复 使用道具 举报
xhongli2022
注册会员   /  发表于:2022-8-24 14:43:09
板凳
如何添加新行呢?
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 立即注册
返回顶部