宫格控件通常用作菜单页,可将多样化的内容做分类索引,点击每个宫格对应进入该项具体内容。一个宫格控件内可自由添加多个宫格。
将宫格控件拖入模拟器,点击它,便可在右侧滑出的控件属性内对其进行具体编辑。
首先在“控件属相”——“控件样式”中可以选择快速布局和样式,布局是指宫格的排列格局,有上图下文普通宫格,zaker色块宫格(每一个宫格都可以单独设置背景色)和文字叠加在图片下方宫格3种。样式是指宫格的色系,有灰黑蓝紫橙5色可选。你可以分别选择它们在模拟器中查看效果后决定使用哪种布局和样式。往下可为宫格下方的文字设置大小、颜色、粗细,此项设置将对该控件内的所有宫格生效。
最下方可设置背景(整个宫格控件框的背景),可选纯色背景或自定义本地上传。接着可编辑宫格栏的参数,列数是指每一行显示多少个宫格;列间距和行间距指每列/每行宫格之间的距离;外边距指宫格与控件框边缘之间的距离;输入数值或上下加减可对这几项数据进行设置;
如果您的App需适应多分辨率的手机,可勾选“高度自适应”选项,自动拉伸控件匹配不同屏幕的高度。
“控件属相”——“控件内容”中的“新建”按钮,根据需要为本控件添加多个宫格。
点击已添加的每个宫格可展开编辑框,对该宫格进行名称命名、编辑图标和选择链接页面(点击该宫格后跳转至该页面),或调用功能(可以预设电话号码和短信内容让用户直接拨打回复,以及添加定位地点,使用时直接调用地图定位)。想要增加宫格个数时,点击“新建”即可。
*因控件内部支持滑动的特性,宫格控件建议全屏使用,添加宫格控件后,高度设置为自适应,视条件添加好历史导航及标签导航即可,不推荐和其他控件在同一个页面内使用,以免滑动效果不佳。