00:00
上一届的话,咱们介绍了应用如何创建,呃,简要的介绍了一下呃,低代码编辑系列的总体的布局,这一节的话咱们就进入到首页的一个具体开发当中。呃,应用创建成功之后。会默认创建一个index的首页,这个就是我们小程序或者说H5应用,呃,当你用户访问了之后,第一个页面打开的呃情况。然后我现在介绍一下左侧它有几个功能,第一个功能是页面管理,这个是负责咱们创建每一个页面用的,一个页面就相当于是你一个功能点,就是咱们在小程序你浏览可能首页是一一个功能页,点那个图标诶又跳转到另外一个功能页,这就是每一个页面,每你看到的每一个功能页都是对应这头的是一个。页面第二个页签的话就是大纲数,大纲数的话,一般你在这个编辑区域托组件的话,它会以树形结构列出来你的大纲结构,当然我日常还是经常使用它,因为你这个组件拖的多了之后,其实选取来不是特别方便,你在大纲数上可以看到它的层次结构。
01:13
第三个页签的话是,呃,这就是低代码的一个特点啊,它呃提供了一官方提供了一个组件库,然后行形测试各种各样的,呃,咱们在做的做小程序的过程,再具体介绍每一个组件是怎么用的。第四的话,这个就是为大家提供的一个素材管理,素材管理的话,基本上你页面上看到的图标呀,然后像文播的图片,它都需要上传的素材里边,然后才可以啊在页面上显示。嗯,最后一个页签是它的那个杰森代码,现在这块的话,嗯,用处还不是特别大,因为他这个是只读的,也不允许编辑后续,我估计官方在后续的规划新功能的时候,可能会利用到嗯这一部分的功能。
02:05
然后中间这个区域,它它其实就是可以做几种几类型的,三类型的东西,第一个是H5,第二是小程序,第三个PC端,当然目前这个PC端还没开放呢。嗯,具体啥时间,我估计也快了,七月底如果发布不了,他八月上旬,我估计他一定是会发布一个PC端的功能。嗯。这个简要介绍完了之后,我们就开始做我们的页面,呃,咱们规划的话,首页一进来时候是。四个快捷功能啊,包括像会员登记啊,充值啊,消费啊和那个发票申请,然后我这个是什么一个结构呢,就是上头是一个图标,下头是一段文字,所以我们先切换到这个组件页圈。然后我们有现成的一个布局。它就是这个栅格布局,栅格布局啥意思,就是它可以呃分成那种一个格子一个格子,就像咱们通常使用像支付宝啊,或者是微信这种用,它不是有个九宫格嘛,这个就是模仿那个。
03:10
然后具体怎么把它拖进来的,它会它有两种形式,一种可以拖进来,我习惯是你点一下鼠标,诶,它就自动。进入这个地方,大家可以看到现在这个组件名称叫山阁布局。然后呃,它这个每一个组件都有一个插槽,插槽就它类似于什么,就相当于我们那个玩积木一样的时候,积木其实每一块都有一个插槽,不同的积木,你把它呃,长的积木插在这个宽的积木的插槽里头,它就不就组成一个形状了吗。呃,其实它这里头的这个概念和咱们实际生活中的概念也是雷同的。我现在正好是这个插槽是四个插槽,咱们是规划四个功能啊,其实是够的,然后呃,你看到这个组件拖进来之后,右侧这个面板区域,它其实就是切换到当前组件了。
04:06
我这个三个布局的话,呃,数据有几种,第一种是列的比例,你看它现在有几种形式嘛,第一个是呃12就是占一行,只只只放一列,然后6:6的话是一行两列,3:9的话是就是呃。两列布局,但是第一列占30%,第二也也不是不是那个啥占30%,是他一共把这个页面水平平分成12格,然后现在是两列布局的话,那么嗯,第一个格子是占三列,第二格子占九列。就是我现在这个提示是选的这个,嗯,3333,就是每一共四列,每一个占三个格子的宽度。然后列列的间隔的话,就是你看到现在看我鼠标这个位置啊,就是这两个插头中间有一个间隙。
05:04
这个就是去间隔,因为咱们这个间隔的话,可能呃,放在这样更好看一些。现在这个,呃。三个布局咱们就讲完了。本期就先讲解一下三个布局。
我来说两句