制作第一步:我先插入一个顶部导航组件,作为首页,顶部导航的标题我建议都是大家的公司或者商城名称。
制作第二步:然后我创建了一个轮播图组件做Banner,因为我做的是微商城,我仿照了TB,用轮播的方式播放一些我修好的商品图片。然后在右边的组件内容中对每个轮播图片逐一添加相对应页面链接去向。
制作第三步:接着我创建了一个图片列表,并在页面属性中把行列设置成了4列1行,我再修改图片高度直接设置为圆形,系统就自动调整图片高低了。接着我更换了图片,替换成按钮图片,并在点击事件中的页面链接至相对应的页面。
制作第四步:因为我想在这一行左右分开,并且是做成左边是大图,右边是上下分开的小图加标题。
所以我先插入一个双栏组件,再在右边的栏里再插入一个双栏,这样就实现了栏目的划分。接着在最左边的双栏位置插入一个大图,并且对它的宽度和高度调节。然后对最右边的双栏也插入一个图片组件,并且右键复制一个图片组件到下面(小技巧),,接着拖入文本插件,这里需要注意,拖入第三文本框后,需要先对它的上间距进行调整,再拖入第四个文本框,这样才可以做到上下图片对应文字的标题与内容。
制作第五步:插入底部导航组件,任何的App都有底部导航,所以我这里需要提醒,每个页面的编辑完后,都需要插入一个底部导航。我自己一般是先编辑一个纯底部导航的页面,然后编辑其他页面的时候,我先复制这个纯底部导航的页面再编辑,这样能省下不少时间。郑州知网计算机软件有限公司拥有雄厚的技术研发实力,致力于为客户提供完美的原生APP开发解决方案。把握市场动向,深耕O2O领域。您的电商大业,由知网软件守护