好,同学们,我们现在来看一下我们一二七十八班第一次用飞格玛设计出的一个微信小程序的部分界面。首先我们从我们的一个手机桌面启动图标,启动我们的微信, 进入我们微信的一个界面,现在我们往下拉弹出我们的一个小程序的界面上了这样一个退出,我们再次下拉也可以点击微信进行一个退出, 然后我们现在点击布丁这个图标进入我们的一个小程序,小程序里面有推荐,有电源,然后有首页找商品社区和我的, 现在我们点击推荐,推荐里面点击新人专享里,我们进入新人专享的这一个界面,点击返回回到我们这个首页,现在我们点击一个订阅,订阅里面我们里面有一个 轮毂,去拖动的时候进入下一张,我们来看一下,现在我们是这样一张到第二张的时候他会变大,然后第三张,第四张,然后我们后面会有一个对应的一个变化。同时我们下面在这个地方,我们这个导航精选进口爱,他们也是可以进行这样一个拖动的, 然后当我们选择进口下面的内容进行相应的一些变化,这个里面我们先做的是一个模板,和商品有 不一样,然后现在我们点击推荐回到推荐的界面,推荐界面里面我们这地方有我们的一个轮播图的一个自动轮播, 然后现在我们点击找商品,进入找商品的一个界面,找商品里面我们做了一个商品的一个详情页,点击好我们的第一张图片,进入商品的一个详情页,那详情页我们也是可以这样进行一个拖动的 啊,然后我们点击返回,回到我们的一个找商品,然后到我的,当我们点击我的进入我的一个画面,我的可以回到找商品,会回到首页,首页的这个地方也是一个长途的一个拖动,现在我们再次点击,然后我们点击关闭按钮,回到我们 微信的一个启动页上面,那这就是我们第一次用我们的飞格玛设计出的部分小程序的一个界面。
粉丝223获赞1373

我猜你肯定也遇到过这样的情况,看着一堆密密麻麻的文件,哎,我,那个文件存哪来着?上次做的那个文件叫什么名字来着?这个文件当时是哪个版本? 你历经千辛万苦,终于找到了你需要的文件,打开文件之后,发现他居然是个废弃的版本。我尼玛,或许你有着良好的文件管理习惯,但是新的问题也有可能会困扰着你。这个文件和上一个版本有什么区别? 当然,这不是你的国,我们的习惯呢,是面对问题给出答案。作为设计师的答案呢,就是一个又一个的设计文件。我相信有的时候你的答案远远还不止一个。 呃,所以我们做文件如果不及时整理呢,就会变成这个样子。即便你有整理和归纳的习惯,但是传统的目录结构的管理方法呢,又显得没有那么灵活。嗨,我是胶布。在接下来的十分钟里,我们将了解一种新的文件管 管理思路。首先要知道设计文件是如何产生的, ui 的设计呢,多是服务于产品的,而产品本身呢,会按照一定的周期进行更新,也就是所谓的发版 发板呢,会包含若干个功能。这里的功能呢,也可以叫做需求。其中每一个需求都相当于一个问题,都是需要对应档案的,也就是设计文件的支持。按照以往的管理方式呢,是直接面对需求进行管理,你的文件很有可能就会变成这个样子。 要是按照版本记录呢,在进行更新时,又需要在各种文件夹中来回穿梭,用起来还是有点麻烦。我们不妨尝试着换一种思路,创建一个记录文件,因为需求本身呢,他可能是一句话或者是一个文档,只需要我们记住就好了,哎,交付款,来来来,给你看一下这个需求,那吊炸天的需求 至少提升日活百分之二十,我跟你讲,这个绝对是用户刚需,用户一用就得喜欢上这个东西,你就说吵吵谁吧,哎,你这我也不太喜欢,来咱们看一下这个 app。 而处理结果呢,是一个又一个实实在在的文件,把记录和文件本身分开进行管理,他们之间用连接的方式进行管理。还记得文件是怎么来的吗?是发板中包含了需求,需求需要对应的文件, 那么我们可以把版本和需求这两个记录给提取出来。具体的设计文件呢,独立存储记录文件,通过链接的方式跳转到不同的设计文件,这样看起来是不是显得会灵活一些?那么接下来我们尝试增加一个虚拟项目,阿尔法版本,其中呢有两个需求,需求一 需要 a 页面,需求二需要 bc 页面。首先呢我们需要创建一个记录文件叫阿尔法,里面呢包含了需求一和需求二, 这个时候呢,我们把需求一的链接哎拽到 a 页面上来,需求二的链接呢,拽到 bc 页面上,这样看起来效果还算不错。 这种管理方式用到飞哥们上,我们来试一下效果。我们需要做三件事,首先呢我们需要创建一个目录文件和按照产品功能去创建设计文件。 首先呢是目录文件,这个目录文件我们也可以管,他叫做记录文件,他本身呢就是一个普通的费格网文件,在左侧配这四一栏呢,我们用来记录版本,每一个版本我们用一个配置进行表示。画板区域呢,是这个版本所 包含的需求,每个需求呢又会包含对应的功能页面,这样看起来好像还不错。不过为了区分每个需求在工作中不同的状态,我们可以再增加一行状态栏。呃,把这个记录文件呢做成一个任务看版的形式,看版从左到右依次为未确认。 呃,这里面放的是我们已经知道了,但是还不确认做不做的需求。收件箱需求和时间都明确了,但是我们不一定有时间立马开始做,然后我们可以把它放到收件箱里面等待去制作。 制作中呢,就是我们正在处理的这个需求了,带过稿呢,是我们做完了,需要和产品或者是开发进行确认的内容。呃,开发中呢,是设计确认完了都没有任何问题了,可以开发去实现了,然后再验收。是开发已经完成,然后等待我们设计 进行一个验收。已上线呢,是确认没有问题的需求之后,等待合并成集成包的需求。每一个需求呢,都会变成一个卡片的形式, 按照常规的工作流程呢,所有的卡片都会依次从最左侧挪到最右侧,然后都是一个已上线的状态,那么这一个版本的需求呢,就全都完事了。接下来是设计文件,这里呢我介绍一下我使用的管理方式。拿一款大家都比较熟悉的 apple 微信来举个例子, 我们可以按照 apple 功能呢进行设计文件的管理。首页呢,他可以是一个功能文件通讯录,发现我各是一个文件。 那么每一个功能文件的配这四一栏呢,会包含三种内容,分别是封面,可以帮助我们在飞哥码中快速定位文件。呃,他的尺寸呢是七百八十五 pt, 高是三百五十 pt, 这里面呢可以写上他的功能名字。 然后接下来呢是对应的设计文件。呃,前面四位呢是我们的需求号,这个需求号的话一般是由产品去记录的,每一个需求只会对应一个号码,这个号码呢必须是由产品设计开发,能达成一致的一个标准。 后面的版本呢是记录了这个页面的更新次数。呃,小数点。后两位呢是记录了简单样式的更改,比如说我改了这个页面的文字字号颜色,或者是调整了图标的大小。 小数点后移位呢,是记录了这个页面的功能框架的修改,比如说我在这个页面新增了一个功能。小数点的,前一位呢是大版本的修改。 呃,这个可能和上一个版本的设计是完全不一样的。最后呢还有一个仓库,这个仓库呢是用来存放我们一些飞机稿的。此外呢,我们还要给这个设计文 键增加一个标题,这个标题呢是和记录文件的需求保持一致的。在标题的后方呢,我们再增加一个记录文件索要链接的版本,接下来我们就可以把功能文件和版本记录给关联起来。在功能文件的 plus e 栏里面,右键选择对应页面,我们选择 copple 配置, 到版本记录中,找到对应的需求,然后找到对应的页面,然后选择文字,我们按一下键盘上的 ctrl 加 k, 或者是选择上方的创建这个链接, 在弹出的文本框里面,我们直接粘贴刚才所复制的链接就可以了,这样的话一个带有跳转链接的版本记录我们就可以做好了,这个时候我们就实现了版本记录跳转到对应设计文件的功能。另外为了方便我们跳回这个版本记录,我们可以在功能文件的标题的右上, 然后把他的这个前往版本记录也在创建一个链接,我们复制对应版本的页面链接,粘贴到对应的这个标题上,这样一来呢,就可以实现文件之间的快速跳转了。 一起来回顾一下版本式文件管理呢,主要有两部分组成,负责记录的版本文件,每一个配置里面呢包含了需求状态和需求卡片。 啤酒卡片里面呢,又包含了对应的功能页面的名称,另外一堆呢是以功能作为记录的设计文件,再配置一栏有封面,把笔记录和一个仓库,每一个配置里面呢又会有导航标题。 最后呢,他们之间用令客的方式进行关联,就实现了飞哥马的版本式文件管理。接下来模拟一个在工作中可能遇到的情况,比如说预计一点零点零二版本有三个需求,首先呢,我们需要新建一个一点零 零点零二这个版本,先把它记录下来,然后再增加任务处理的状态栏,再增加三个需求卡片。最后呢,我们依次将需求名称填写进去, 在对应的需求卡片里面呢,我们再填入页面名称到这里呢,记录文件我们就算创建完成了,接下来呢就是去找对应的功能文件,如果没有对应的功能文件,我们直接创建一个,记得加上封面版本记录和仓库。然后我们开始画界面, 假装这是界面画好了,在界面上方呢,我们记得去增加一个标题,把引导的标题呢给改掉,复制一个配置链接,粘贴到对应的需求的页面文字上,再将这个版本页面的链接粘贴到导航标题上,这样的话,我们第一个需求就算添加完成了, 其他的两个需求呢,我们用同样的方式进行添加。使用这样的文件管理方式呢,不管是产品设计师还是开发,在日常的工作流程中呢,我们只需要关注一个版本记录就 ok 了, 就可以快速的找到我们对应的文件内容。视频中所用到的文档呢,我会放在评论区中,大家可以自行下载。最后祝各位生活愉快,再见。 拿大家一款都比较熟悉,拿一款,大家都拿,拿大家拿一款,大家都比较对。

这一讲开始的话,我们主要给大家讲解一下这个微信小程序中的这个组件啊。那首先我们看一下小程序里边有哪些内置组件啊?那这里边他给我们提供了好多,首先这里边试图容器相关的组件的话,有这个 view scott、 views april, 包括还有可移动的这个区域,包括还有覆盖物 啊,这个基础内容里边有什么?呃,图标文本,还有这个滑块,包括这里边还有这个,呃, 有点类似于这个副文本的一个一个主角啊,那在接下来这里边表单相关的啊,这就和我们 h t m l 啊, h t m l 一点类似,然后这里边还提供了什么导航、媒体,包括地图、画布啊等等这么些组件,那这就是官方给我们提供的内置组件。那接下来的话,我们就看一下这个内置组件怎么学,然后接下来我们再一个一个给大 大家大概过一下啊,首先的话我们学这个组件之前的话,大家看一下,那这个组件里边的话东西比较多啊,你看点开 sweeper, 那这里边你哎看上去,对吧?这么多东西啊,我们不可能一个一个去看,对吧?所以这时候我们就不去看他这个文档,我们怎么学呢? 一种方法,我们首先啊,首先不去看他这个属性啊,我们首先找到他这个视力 demo, 对不对?视力 demo, 然后接下来的话,我们把可以把视力 demo 导入到我们这个编辑器里边使用。 然后再一个就是大家仔细看啊,这里边有一个啊,在开发工具中预览效果,那这时候他是个 sweeper, 对吧?那接下来我们打开我们这个小程序的开发工具,我们点一下他, 点一下他以后,这里边弹出打开微信 vip 开发工具,那你就点啊,点打开微信 vip 开发工具,点完成以后,然后这里边你看到他这里边有个导入代码块,对吧?导入代码块,那其实他就相当, 那就是你点击实力电网,他就现在把这块代码导入到我们这开发者工具,然后之后你点击导入啊,包括你这里边也可以贴写你的 a p p id 啊,也可以贴写 a p p id 啊,那我们先导入一下,看一下 导入完成以后,然后接下来这里边他就给你创建了个临时的项目啊,临时的项目,然后这里边就是这个 sweeper 的一个官方的一个也是代码,对吧? sweeper 的官方也是代码, 怎么学呢?这个不需要记,你只需要会改就行,对吧?啊?这就是我们这里边给大家说的导入代码块啊,导入官方的代码块啊,那接下来这个代码块里边,呃,这个代码块里边,这个是他的业务逻辑,这是他的 html, 这是他的 css, 对不对?这是他的 css, 然后这里边还有一个,呃,就是微信小,呃,微信啊,微信官方提供的 v u i 的一个 c s s 啊, v u i 的 c s s, 你也可以 把它拿过来,对吧?回头用的时候也可以直接把它拿过来用啊,这就是这个视力电贸啊,就是导入这个代码块, ok, 那这个我先关关掉啊,包括其他的也是一样,包括我们这里边,你看啊,有这个呃, 可移动的区域,那你点开,你也不知道怎么用,对吧?这么多属性肯定不会一个一个去看,对吧?啊?你用到的时候,首先找 demo, 那找到 demo 以后,这个 demo 里边有些属性看不懂的情况下,然后再去找这个文档啊,这样去学,那接下来你看,我们首先看效果,那你点击在开发工具中预览,对吧?然后在这里边点开 啊,打开的时候,这里边我们填写一下这个 appidappid, 一般在哪找呢?大家看一下啊?在我们这个 project 里边 project configure, 然后这里边有个 appid, 如果你呃有时候忘记填写了,你可以在这填写一下,对吧?把它拿过来,拿过来以后,然后这里边点击导入啊,那这时候这个项目就又导入到你的 一个啊,零食的一个目录里边,然后他给你打开,打开以后呢,这是我们学的时候就可以,怎么学呢?我们就可以看他这个室内 demo 啊,然后进行一个复制,进行一个学习,对吧? 啊?再看一下,那这里边他 index 里边也有,对吧? index, 这是他的 html, 然后这里这里边是他的一个业务逻辑,对吧?业务逻辑,然后这就是可移动的这个区域啊,可移动,对吧?包括这里边点还可以设置,那这个设置就是点这个,呃,点哪个呢?点这个, 点这个按钮,对吧?点这个按钮它触发了 type 世界,那就是执行了这里边 type 世界, type 世界,然后这里边儿啊, csd 这个 x y, 对吧?设置了这个,谁呢?设置了它这个上边的这个区域,稍等啊,区域在哪呢?在这啊,设置了它这个可移动的区 啊,外层是这这么个,然后里边是这么个区域,对吧? xy 表示你的一个坐标,然后这里边包括它啊,还有这么些东西,对吧? 啊?这个文本,对吧?包括这个啊,可移动的区域,对吧?可移动,横向和纵向移动,对吧?啊?超出边界的一个移动, ok, 这就是这个呆毛,对吧? 也就是这里边给大家说的导入这个什么呢?导入啊,这个代码片段啊,导入代码片段就这样去看,但这是一块啊,那官方的话在这啊,这是一块,回头大家就直接点这,然后官方在我们这个文档里边,他这里边还有个叫势力代码,这个我们在刚开始就给他说了,叫小程序企业代码,对吧?在这点开, 点开以后,那你要学他,你也可以扫描这个二维码啊,那接下来的话,我们打开这个也是给大家看一下啊,我用手机扫一下,扫一下这个二维码啊, 扫完以后,那大家就可以看一下小程序具体有哪些功能啊,那这 之后他就打开了小程序的一个视力 demo, 那稍等一下啊,打开了这个小程序的视力啊,这是真真实的这个手机。那接下来这里边有什么?试图容器,对吧?然后这里边有什么啊?有什么? vivo, 对吧?这就是 vivo, 就是我们布局用的啊 啊,然后接下来再返回,返回这里边还有什么? scarville, 对吧? scarville 就是你刚才看到的啊,这个三六零手机微视比较讨厌人啊啊? scarville, 然后这里边它可以,可以什么呢?可以滚动的一个区域啊,可以滚动,你看一下啊,那上边这个是不是上下滚动, 但是这个手机上边可能稍微有点延时啊?啊?左右滚动,对吧?然后这里边还有什么呢?还有我们这里边 sweeper, sweeper 的话它就是个龙波图啊,就是我们刚才看的 啊,那这里边的话你就可以看一下这里边这些东西怎么用,对吧?包括这边文本文本框,对吧?文本框啊?文本框,然后包括啊,这里边还有什么呢?还有我们这个,呃,什么?比如说叫 啊 pick 组件,对吧?啊?点一下看一下,对吧?这样一个 pick 组件,包括这里边这些东西,对吧?那这时候你看这个有啥用呢?这时候你就知道小程序里边具体有哪些东西吧?你要用到的时候,你是不是就找对应的这个组件就行了啊?包括还有我们对应的这个 redo, 对吧? redo 啊,这就是小程序的视力电貌。那包括还有什么媒体啊?媒体什么图片了啊?图片,对吧?图片啊,包括还有我们这个,呃, vio 啊, vio 播放,播放我们这个视频的,对吧?播放视频的点一下,他可以播放的啊? 啊?播放这个视频,对吧? ok, 那我们返回一下啊,然后这里边还有什么呢?还有这个什么啊?花布花布。 converse 相关的啊? converse 相关的啊,包括还有这个。呃,什么广告相关的主线啊?广告相关的主线。这就官方给我们提供的这些东西啊。然后接下来的话,那这里边还有 接口,接口的话就是它这里边 api, 它给我们这边主要俩括骨呢,一个叫组件,一个叫 api, 对吧?那你这里边你也可以看一下啊,它这里边这些东西到底怎么用,对吧?啊?那回头我们再给大家讲一下这 api, 那这里边的这个这个组件啊,组件的话啊,那我们就给大家看几个啊?那比如说怎么学呢?比如说刚才的话,我们看到了,看到了刚才他这个视力点宝有这么多东西,比如说接接下来我们要用一个东西啊,就比如说我们用最简单的这个谁呢?这个龙波图啊?龙波图这里边在这个视图里边是不是个龙波图啊? 我们就要用这个龙波图,那用这个龙波图的话,那怎么用呢?一种方式找到官方文档啊,这里边有 sweeper, 找到它,找到它以后,我们不建议大家看这个啊,先不用看它,我们看谁呢?我们看这个 demo, 对吧?看 demo, demo 里边这里边就有个 sweeper, 对不对? sweeper, 然后把它复制过来,你看啊,我们就给大家演示把它复制过来,你先不用管它到 底是干什么的,我们先把它复制过来,当然我们这里边先新建一个页面啊,稍等一下,我们这边新建一个,比如说叫 news 页面啊,给大家演示这个龙博图啊, 不需要记,只需要会啊,会用就行啊,这就是它这里边的组件,没有任何的业务逻辑啊,没有任何业务逻辑, 然后这边六字就创业成功,创业成功以后,接下来我们要在这里边使用他这个 sweeper, 对吧?啊?那这时候把这个 sweeper 复制过来,当然你也可以把全部都复制过来,对吧?我们这里边的话下边是按钮,所以你可以不复制,我们就只复制上面这个 sweeper。 ok, 把它拿过来, 那 cv pro 复制过来了,复制过来以后,然后接下来再找到它这里边。这个啊,配置,对吧?找到配置看配置里边是怎么写的。配置里边的话东西好多啊,我们首先把这个 data 拿过来,其他的先不用管它啊,我们首先拿数据啊,那就是找到我们这个 g s g s 里边,我们这里边 把我们,呃,这个这里边没 us 些删掉啊,没 use 些删掉 啊,删掉以后,然后接下来我们在这里边对他啊,对的,我们复制一下,换成他的啊,换成他的,然后接下来呢,我们再看啊,就是复制过来以后我们要把它运行起来,那之后你就看看具体什么意思。那首先一点看这里边,哎,已经成功了,对吧?是不是已经笼包头成功了啊?那一点看啊,就这样就跑起来了,跑起来以后我们一点看啊,这里边有个, 呃,这叫 indicator, 这个 d d o t s, 对吧?有这么个东西,那这个东西不知道什么意思,那这时我们就开始找了啊,找什么呢? 找文档啊,找文档,找到这个 super 这个啊,在这找到 super 这个文档以后,在上边啊,加 ctrl f, ctrl f 表示搜索,搜一下这里边有个,呃,有就就找到了它,对吧?找到了它,你看它什么意思呢?就是是否 不显示面板的指示点。二什么意思呢?就是他的意思,就是你是否显示这下边的这几个点点点,对吧?那这个他是从哪里来的呢?稍等啊,我们再找到这个啊,这个是谁控制他呢?是这个啊, 这个属性来控制,那你再找,找到他啊,那就他来控制的,如果他等于个处的话,那这时候你看一下下边是不是就有几个点点点,对不对啊?点点点是不是就出来了?点点点就出来了,对吧?这就这个东西,然后接下来再一点点看,那这里边有个 auto play, auto play 是不是就自动,自动什么呢? 啊?自动轮播,对不对啊?就是你自动动,那这里边我们改成一个 t r u e, 很简单,对吧?那这样它是不是就会自动动了啊?这就是这个谁哒?这就是 auto play, 对吧?你看一下啊,是不是就自动动了?然后每隔呃,五百五百毫秒啊?五千毫秒是不是就动了?五秒钟是不 动一次啊?那这里边你再看,就这样学,对吧?然后这里边有个什么啊?英托,对吧?英托就是我们刚才说的借歌的时间,然后这里边还 duration, duration 就表示你这里边,哎,从这到这的一个运动时间,对吧?这叫 duration。 然后接下来这里边 block block, 这里边有个 three pro item, 对吧? three pro, three pro item 固定写法, block 的话就是个区块,然后这边通过微信 four four 的话啊, vc four 循环水呢?循环我们这个 inmates, 对不对?是不是循环这个这个图片地址啊?啊?当然这个是远程地址,然后循环它的时候,然后这里边啊,然后下边有个引位置,显示我们对应的图片,对吧?啊?显示对应图片 这边宽度高度,但是宽度的话,我们建议大家不要直接写个这样的宽度,你如果这样写的话,你看我来一个呃大的手机,比如叫 iphone 七 plus, 看一下,他这种可能就占不满我们这个屏幕了,对不对?所以这时候的话我们要改了,比如说这里边,哎,我们要改他的样式,那高度一百五,宽, 宽度的话我们给他来一个百分之百,那就是找到 sweet pro item, 那就在这里边写 sweeper item 啊, sweeper item 下边的谁呢啊? sweeper item 下边的因妹子 i m a j e。 然后这里边写个宽度 w w i d 宽度来个百分之百, ok, 保存一下,保存一下,那这时候我们看一下我们这个龙博图有没有搞定啊?啊?那这样,这样一个龙博图是不是搞定了?而且它能自适应屏幕,对吧?是不是自适应屏幕 啊?或者你如果还要自适应的话,就这里边的话,他有些设备会变形的,那你这时候把他的高度去掉,高度去掉以后,然后这时候再保存一下,那这时候他就是宽度百分之百,高度是不是自适应了?那这时候啊,我们再看一下,对不对 啊?或者你这里边写个高度,一个凹凸宽度是宽度百分之百啊,高度一个自适应,对不对?那这样他就可以接 这种不同的一个中端了啊,接入不同的中端,而且不会变形高度。 auto 还不行吗?啊? auto 还不行?不行的话,那我们就要不就不设置了啊,先不设置了,或者你给他,你给他按照设计稿的一半来啊,那这样就搞定了,然后这里边你再切换回我们这个小手机啊,小手机, 那这样的话是不是也 ok 了?这样的话也 ok 了啊,这就是个龙波图,就这么简单,你看一下,那这时候大家回头再看这个电脑的时候是不是就知道了,这是我们这个龙波图的一个 图片地址,然后这是控制他下边是否显示点,这是控制是否自动笼播,这是控制一个笼播的一个时间,这是控制你笼播的一个就是你从一个页面到一个页面的一个速度,对吧?切换的速度, 这样龙波图就搞定了。啊,这就龙波图组件。 ok, 那接下来我们再继续啊。啊,刚才说了,就是你学他的时候,你首先啊,首先 首先你看一下,看一下这里边这个视力带帽里边有没有你想要的这个功能,对吧?啊?如果有的话,你再找找这边的组件,找到以后首先看文档,对吧?看文档,然后接下来去使用, 但是有些时候的话,这个文档啊,文档我们看不懂,对不对?看不懂,那看不懂的话两种方式,两种解决方案,一种解决方案就是在这是不是有个视力代码,然后点开,对吧?点开把我们这个对应的代码导入啊?导入, 当然你如果导入一次以后,你再导入他就报错了,对吧?那这时候怎么弄呢?就是我们已经导入过这个,谁呢?导入过这个 cpr, 那你这时候你就点击时呢?点击,你看我刚点击时,我是不是点返回,点到这里边有代码片段。 好,这时候找到 sweeper 主角势力,然后再点开,这就是你以前导入过的这个 sweeper 主角,对不对?就是你如果看文档搞不定你之后怎么办呢?我们这时候找, 找到他这里边这个视力 demo 啊,找到他这个视力 demo, 打他这里边这个 index, 你可以直接拷贝过去,对吧?看一下他这里边是怎么写的,有些没用的你可以删掉,对吧?有些没用的你可以删掉,比如这里边下边这些没用的你可以删掉,然后上边这个东西,这就是官方给我们提供的这个啊,设备块图件啊,这样就搞定了啊。 行,如果这里边还不可以的话,那这是怎么怎么弄呢?那这是我们也可以下载官方的这个原码啊,下载官方这个原代码,这是他所有的代码。下载官方的这个原代码以后,那这里边他就包含了所有的代码啊,那稍等一下 啊,这里边包含了他所有带帽复制过来,复制过来以后,然后接下来你可以在我们这个小程序的工具里边啊,把他这个完整的 demo 导入进来啊,就是这个完整的 demo, 我们可以解压一下啊,你看我解压,解压完成以后,我们可以把他这个 demo 导入进来,导入进来你可以慢慢去学 吧啊,然后这里边把它复制出来,复制到这个,呃, demo 里边, 然后接下来把它给删掉,对吧?删掉, ok, 那这时候的话我们也可以直接把它导入导入,怎么玩呢?就这样玩,你看啊,我们在这点击项目,点击,呃,新建项目啊,新建项目,那我们这时候选择到谁呢?选择到这个,呃,这个 demo, 然后这时候点击确定啊, 确定以后这里边 a p p id 呢?这边也没有,那这时候你也可以写你的 a p p i d 啊,比如说写我们的 a p p i d, 我们看我们这有没有一个 a p p i d 我们先找到,稍等啊,我们在哪里有 appi 地址来着,是不是在这啊?有这个 apid, 你也可以导入的时候,把它这个 appidt 上,就和我们以前创建项目是一样的啊,这里边写你的 appid, 然后这边写个 demo, 对吧?或者写个微信 demo, 然后之后点击确定 啊,那这样的话,我们小程序的体验 demo 就导入到我们这个,谁呢?导入到我们这个 b a 七了,导入到 b a 七里边,那这时候他这里边的所有的元代码都在我们这啊, 啊,就是我们刚才给大家演示的手机上演示的所有的原代码都在这,对不对?那接下来你要看这个 sweet vivo, 对吧?或者是看 sweeper 啊,那比如说我们还是以 sweeper 给大家举例子啊,就看你怎么选 啊,还是以 sweeper, 那你就点 sweeper, 对吧?点 sweeper, 那这里边是 sweeper, 但是我们要学的话,你想在默认加载 sweeper, 那之后你就找到这个 app, 点 jason 来进行什么呢?什么配置啊?那它这里边所有的代码都在配置字里边,组件就在这个里边,对吧?组件就在那,组件就在我们这里边,然后配置里边,然后找到 sweeper, 找到 sweeper, 然后这里边就有它这个对应的一个业务逻辑,一个啊, h t m l 一个 c s s 代码,那这种你就直接可可以把它复制过来,然后改 改一下,是不是就能实现你这个功能了啊?这就是官方的一个电报,包括这里边你也可以也可以预览,对吧?预览就是在这点一下预览啊,预览完成以后,我们扫描就是相当于这个预览是什么意思啊?相当于我们在甄姬上测试了,你看啊,我接下来的话,我们就在这稍等一下 啊,我们就可以再征机。他这是正在上传啊,是因为这个小程序这个代码还是比较多上传。稍等一下, ok, 上传完成,上传完成,你扫一下这个二维码啊,扫一下二维码,那至少这个 demo 就在哪呢?是不是在你的手机上打开了?但手机上打开的它是谁呢?它是。 呃,他是我们本地这个代码,对不对?这叫预览。那这里边还可以什么呢?还可以远程调试,对吧?远程调试相当于也是把你本地这个代码上传到谁呢?上传到这个,呃,小程序,只不过你在这,在我们手机上点的时候,他可以在这 打开,打开对的一个调试工具,你之后你再看一下,我再点去掉啊,去掉以后我们这里边再扫一下啊,扫一下,扫一下以后,然后这里边看一下是不是也打开了啊?打开了以后,那这边没有给我们打开这个 打开对应的一个调试工具吗?那稍等一下,我们再重新来一下,你看啊,我们再重新这里边改一下这个 a p p 点。 jason, 我们想的是默认 启动,呃,启动这个 three pro 啊,那这时候或者说默认启动一个叫 video 的东西,那这时候我们就找到它放到这儿,然后这时候点击远程调试,远程调试重新再来一下, 这时候他在上传,当然要注意,就是我们小程序的代码不要超过两个兆啊,不然他上传不上去不要超过两个兆。 ok, 那这时候你看一下,我们扫一下啊,扫一下调试后,他会打开一个调 调试工具才对啊。你看我这手在这扫了,哎,看到,看到什么了?我是不是扫了一下看,我这扫了一下,对吧?扫了以后,然后这里边打开了,谁是不打开了调试工具啊?那这时候你看啊,这时候手机上他就打开了,稍等, 那打开了,我们这个打开了我们这个程序,对不对?打开这程序以后,然后这里边就可以点播放了,对吧?播放 啊,点一下播放,那播放的时候你在这点按钮的时候,他这里边干什么呢?他这里边就会执行我们这个方法,对吧?啊? 然后这边我们可以发木带,对吧?发木带啊,就在这点击发木带啊, ok, 那我们退出一下啊,包括这里边就是这就是调试,对吧?就是你在手机上预习这个项目,然后在这调试啊,这就是这个,呃,小程序的一个官方带帽,以及怎么预览,怎么调试,怎么去学 发这个代码,对吧?行,那这一讲我们就介绍到这啊,那这一讲我们就主要给大家讲了啊,怎么去导小程序代码片段啊?导入小程序的这个代码,以及啊给大家演示了官方的这些组件,对吧?以及告诉大家啊,如何去学这个组件?去用这个组件有好多种方法, 那第一种方法就是看文档啊,文档看不懂的时候找谁呢?找他这里边的这个啊代码片段,如果代码片段里边还是不一样的话,那之后我们再找小程序里边的视力带帽,对吧?啊?反正他都有给我们提供带帽,那这时候我们学起来是不是容易一些?行,那这一讲我们就先讲到这啊,先讲到这。

接下来我们就来搭建我们的项目环境,首先第一个呢就是我们导入我们的微信小程序项目, 我们需要呢按照这么几步呢去做一个完成。首先第一步呢就是去安装 note g s, 这个呢就需要我们使用资料中所提供的一个 note js 的安装包进行做一个安装,它呢是在这里我们可以来看一下,在资料中呢有一个这个安装包啊,去安装一下, 呃,在这里呢我建议大家呢都使用这个相同版本的一个 note g s 啊,避免呢出现一些呃不兼容的一些问题。 由于 note 结实呢我已经安装好了,所以第一步呢我就不再安装了。第二步呢把我们的代码目录中的这个清奇这个项目啊,咱们拷贝到自己的代码目录中,这个呢我来 操作一下,是在我们这个里面有一个代码目录,代码目录中呢有一个叫做微信小程序代码,把这个呢我们去做一个解压, 把它解压到哪里呢?解压到一个位置去,我就解压到,我在 f 盘下面一个扣的零一啊,解压到这个里面来,把它呢去解压出来, 在我们解压完成之后呢,我们就可以把这个关掉了,解压完之后呢就有这样的一个项目啊, 接下来呢我们就需要把这个项目叫 my 倾斜微信导入到 idea 的开发工具中, 我们可以打开我们的 idea 工具,然后在这里呢我们去呃 open 一个,找到我们这个下面零一这个我们把它呢哎刷一下来了,就它啊,把它打开一下,在我们新的窗口中呢去把它 打开,好,这样的话呢我们就把我们的这个微信小程序的啊这样的一个项目呢,就导入到 idea 里面来了, 我们可以看到呢,在导入之后呢,他打开之后就会有一个叫做 read me 啊这样的一个文档啊,大家呢也可以去阅读一下这个里面些内容啊。 呃,带来了我们这个微信小程序的这个工程啊,呃给大家所提供的代码中呢,已经就包含了他所需要的些依赖啊,大家应该呢就导入进来呢,就可以直接去使用了, 如果说发现使用不正常的话,我们就按照这个步骤来执行一下。呃就是在这里面呢有这几个命令啊啊,这几个命令第一个安装依赖,我们打开我们这个控制台,然后呢我们可以把这个呢命令给他拷贝一下到这里啊粘贴一下 去做一个。呃安装,实际上呢呃我呢已经就安装完成了,当然了我也建议同学们呢都把这个命令呢都执行一下,确保我们整个他所需要的依赖环境呢是没有问题。 好,我们等待一下它的一个执行到这里呢,我们第一个安装的这个依赖呢就已经完成了,下面呢我们在执行 npm install 再去安装所需要的依赖 啊,其实我们已经包含了,只是我们建议大家呢再把它再执行一次,这样的话呢就可以确保依赖是没有问题的。好,那我们等待一下他的一个执行 好到这里呢,这个呢也执行完成了,接下来呢我们去运行下面这个命令,呃把我们的这个小程序的这个代码啊他去做一个编译,然后呢再到我们的微信小程序的工具里面再去做 做一个运行啊,先把它呢先去做一个编译,编译成微信小程序工程,能够去识别的一些这个代码,可以看到呢,他是不是正在做编译啊?那我们需要去等待一下。 好到这里呢,我们看到有一个叫做监听文件修改中。啊,这个呢咱们到这里呢就算是已经把它就跑起来了啊,一旦我们这个文件修改呢,他会重新去做一个编译。呃,我们的微信小程序呢也会去识别到最新的那个修改的内容, 接下来呢我们就通过我们前面所安装的。呃,我们这个微信小程序的一个开发者工具呢,把它导入进来,在这里呢我们点击这个导入,找到什么呢?找到我们这个扣子下面有一个零一啊,找到它把它呢就选择导入进来。好,我们可以看到呢在这里呢它有 有一个项目名,这个你可以给他去改个名字,或者用这个默认呢,也都可以,比如说我就来一个他吧,这就来一个二吧啊,目录呢是这样的一个目录,这个 app id 呢非常重要,一定要选择你自己注册的 app id, 就是我们刚刚所看到的自己那个 id。 呃后端服务呢,我们在这里呢选择不使用云端服务,点击确定啊就可以了,点击他 这个呢我们需要去等待一下他的一个导入,在导入之后啊可以看到有这样的一些这个页面效果啊,在左边这一块就可以看到页面效果,在右边这一块呢就可以去修改里面那些文件的内容。 好,我们可以看到呢,在我们左边这一块呢,是不是已经就显示出我们这个微信小程序的这样的一个效果啊?啊?当然了,他 呢是需要我们去呃登录微信做一个授权之后呢才能够去使用。在我们点击确定之前呢,我们还得做一件事情,我们来看一下 ppt, 呃,就是我们现在做到呢是第六步就是把它导入,导入过来之后呢就按照我们这个图式的一个方式啊去把它导入进来, 我们还需要去执行第七步的操作,就是在 s r c 下面的 convic 点 t s 这样的一个文件中啊,去修改我们后台服务的一个地址, 这样的话呢我们才能够给我们的这个小程序啊提供一个后台的一个服务,我们可以来找一下。呃,可以到这个里面啊,找到这有一个叫做就是 s r c 啊,在这里 s r c 下面有个叫做 convic, 点 t s 把它打开,打开之后呢在这呢有两个配, 一个呢是我们本地的一个服务,另外一个呢就是我们所提供的一个墨客地址在这里呢,我们最开始啊咱们都使用上面的墨客地址,把下面这个呢给他注视掉,把这个呢打开。哎,这样的话呢我们就使用这个地址就可以去演示我们的功能了, 可以看到呢在控制台中啊,是不已经就监测到我们的文件的去做了一个修改啊,他呢就会去做了一个重新的编译啊,在这个里面啊我们就可以去做一个登录啊,做一个登录之后呢就可以去做一些呃我们的一些测试了,比如说我们看一下这个路线, 我们可以看一下历史路线呀,呃,或者说我们可以去看一下我们的附近的路线呢啊,等等,这个所演示的功能呢,就跟我们刚刚讲的功能就一样了, 注意啊,这一块的数据啊,我们现在都使用的是默克数据,当然了这个,呃骑行功能呢也是 ok 的,可以点击它啊,三二一开始,然后呢去做一个这个骑行的这个操作,这个跟我刚刚所演示的是一样的。好,我们把它呢去做一个返回。 通过这么几步的操作呀,我们基本上呢就把我们的微信小程序这个项目啊就导入进来了。 好,同学们按照这七步操作呢,咱们先把这个小程序项目呢先导入进来,先把它跑起来,在我们后面呢就去开发自己的后端,在开发完后端之后啊,我们只需要去把这个地址去切换到我们本地是不就可以了? 好,关于我们导入微信小程序项目的一个操作呢,那我们就先讲到这里。

欢迎各位同学来到微信小程序设计第二期导出及导入数据库数据,同学们可以扫描屏幕右下方二维码,添加老师微信进行技术交流与合作。 好,咱们来到这个小程序页面,我们打开语音开发,那么在工程实力中呢,我们常常需要导出和导入咱们的这个数据库, 那么老师今天就以一个案例为例,给大家讲解怎么去导入数据库和导出数据库啊。 首先我们讲一下怎么去导出数据库,那么在某在咱们这个用户数据库里面呢,有两个啊,有两个数据,一个是 id 一和 id 二。好,那么我们怎么去导出呢?这同学们直接点击导出啊,导出选择导出格式, 它有两种,你选择 c s v 就可以了,那么选择这个 c s v 的这个过程中啊,你要注意了,你要把你的这个字段 啊,哪里是字端呢?就是我们这个杠 id, 杠 open id 的 occasion 和 using 论啊,你以逗号的形式把它分隔开啊,你在这里说,比如说说 id 逗号啊,杠 open id 啊,然后是咱们的 location, 呃, l s location 啊,然后是咱们的 username 好 u s e 啊啊 usually。 那么输完了这个之后啊,你就选择导出位置,比如说是咱们的这个桌面啊,然后我们先选择导 导出位置吧啊,保存啊,然后点击确定,那么咱们这个数据库呢,就以 c s v 的这个格式啊,导出出来啊,导出出来,我们等一下, 好,导出出来以后,呃,我们可以啊,在咱们这个数据库里面去查看啊,我们点击把它打开 啊,那么就有了咱们的刚才的那个啊数据了,一二二一二三二二三三三四十四。 好,这个就是咱们数据库的一个导出,它是以 c s 为格式。好,那么我们后面接着讲怎么去导入数据库,那么我们现在新增一个三号数据啊,新增三号数据,我们复制粘贴,然后三号数据呢?是六六六啊,六六六六,可以选 urname 也是六六六。好,我们点击 保存啊,保存,点击四啊,我们关闭,关闭了这个之后,好,我们来到这个云开发的这个数据库界面,首先呢我们就把刚才那个导入进来啊,刚才我们更改的那个数据,当你导入进来的时候,首先你要把这个之前的这些记录都删掉啊,我们把它删掉, 删了之后,然后我们再选择导入啊,导入选择文件啊,然后我们点击确定。 好,这样我们就成功的导入了数据库啊,把咱们刚才那个六六六导入进来的啊,那么这个就是咱们数据库的批量,这就是咱们数据库批量的导入和导出啊,这样的这节课啊,感谢各位同学的收看。

大家好,我是草帽,这期给大家分享一个变量相关的插件。那么我们都知道飞马的变量呢,他基本的交互形式是表格,但是吧,他这个表格就很难用,特别是你们变量一多的话,涉及到一些批量操作,批量修改就不太方便。 所以他变量刚上的时候啊,我就有去找一些东西,看有没有什么工具,当时没找到特别好的,现在呢,发现一个他呢,大概啊是从谷歌表格他这里作者提供一套模板啊,例子 就是这一套啊,你按照他的格式弄完之后呢,就可以直接填到菲格玛里面啊,就是现在这个样子,这是他的例子,基本上菲格玛四代的四种变量他都能导入,但是有一点不好,我先跟大家说了,就是他不支持这个变量的调用啊,就这 这个你只能从飞马内部去弄,他这个表格层面他做不到。但是作者有说啊,他这个有空就研究研究, 可以划拉划拉,他这个这个评论呢不少,那说明啥呢?说明飞吗?那个确实不好用吧,确实大家需要这个玩意。这不你看 这刚说呢,就是已经有人提这个问题了,说如果能调用就好了,比如什么 primary 啥啥啥这边你就哎输入一个这个这个美元的符号,就调用上面的 primary。 那这个插件啊,整体用起来非常简单。那我现在就来教大家怎么弄啊, 我直接建一个新的,对应到他这边啊,有几个列是必备的?其实就是名字跟这个啊,太不,这俩是必备的,你少也少不了,我们加进来内幕就很简单吗?对应到变量里面, 就这这一列,这叫 name, 变量名称 tap 呢,就是变量类型,哎,一共是对应这四个,呃,只不过什么呢?它的写法有点区别, 具体在哪啊?在这呢,看见没有?一共是四种没错了,他名字也没错,只有一个。那个 number 啊,看,没有菲克玛这里面这个第二个 number, 他不是写 number, 他是写 float。 然后呢,具体写法就是全部要大写,其他的命名跟菲克玛的命名都是一模一样的, 所以呢,然后这个列搞定,这列我们可以先冻结一下在这啊,冻结到第一行,哎,然后整体加个粗,这个好像是无所谓的啊,关键是第三列,第三列开始注意了啊,他就开始让你整 mod 了,那么免费用户的话,默认是有一 连 mod 可以用的,如果在加 mod, 比如我现在这个设计稿,嗯,在免费的个人设计稿里,如果在加的时候提示你付费啊,所以呢,就看你啊,你想弄很多 mod 的话 就往下啊,各种加。我这里就比如就叫这个这一列啊,就叫草帽啊,空格一,然后开始写名字了,我们先弄颜色啊,颜色呢,就你随便叫,比如我就叫 primary 杠一,然后太不注意了,大写直接卡了, 哎。颜色你比如你定一个吧,我们整一个复制颜色啊,这里, 然后啊,得带个井号粘进来,这就完事了,然后再来。这个命名是有小技巧的嘛,就是以前基础教学的时候教过大家,就是你要想 给那个什么分组,从命名上就直接可以跟那个组件一样用这个斜杠啊,就分了一个文件夹,所以我们可以再弄俩颜色比较 primary a, 这个是 primary 里面有个是吧,一个 a 一个 b, 你就叫 b 就完事了啊。这边你看这这种表格操作多方便,不比飞马好。 然后颜色我就不乱弄了啊,先复制,这样之后呢,我们可以直接去就试一下先啊,就这玩意,这就随便起名了啊, 分享之前得起名。然后呢,这边注意很关键,你要调成这个,知道链接的任何人都可以访问访问这个表格,然后复制链接,复制完之后 我们去到菲格玛里面,打开插件,就是这个啊,走这个就很简单,这没啥设置的,填个表格链接,然后这边是你 collection 的名字, collection 就是这边对应的 collection, 比如我这里弄一个就叫 collection 呃,帽嘿,可以吧,它会帮你自动新建,所以我直接点 好了底下就成功了。然后这里看到没有,我们刚刚创建的进来了,而且我们那两个杠是吧,分组了没?分了, primary 里面一个 a 一个 b 啊,就是这样。然后呢,他这个当然可以后续新增编辑了,所以我们把刚才没弄完的继续。 呃,再来一个自助串,我们就叫本身就叫 number 吧。 number, 草帽,然后这里就是 float, 记得吗?它不叫 number, 叫 float。 呃,这里就具体的数值,看你给什么,我给一个五十,然后还有什么叫 text, 草帽,这就文本吗?文本我们就随便打几个中文草帽,呃,字符,这是俊也是都得大写。最后一个就是那个不准预算了啊,不准预算的值,我们拐过来看看, 他也有写,就是大写的处,跟 force 只能是这两个不要自由发挥啊的一模一样。然后我们去写啊,这个布尔运算就叫布尔运算,可以用中文啊,玻璃,然后我们默认给处吧, 可别打错啊。好了,这样改完之后呢,我们直接啥也不用干,直接去再填一下啊,如果你把插件关掉的话呢,你得再重新把链接包括名要输。对啊,那么你看我们刚弄的新弄的三个在这里。嗯,因为没有给他 分文件夹吗?就是五十的对吧?这是 number, 纯数字,然后这个字符串这个是不容易算,对不对?然后呢,大家千万要记得啊,前面说的,比如我在这一列吧,我复制我粘进来,那这就是两列了吗?我就改成草帽二,那这个时候如果你要还加的话呢, 他会出错吗?你看到没有?所以这个是啥意思呢?就是说我就非法那个 mod 你想加一个,他不是那个收费的吗?哎,所以我得把这个设计稿啊挪到那个我的付费团队里才行啊。所以你免费版的话只能弄一列,所以你你跟这多加没用,而且你还用不了,所以别乱加。 那么我挪过来之后呢,我再去导入啊,再去导入就可以了,所以我们看一下啊,这不吗,草帽二啊,这一列多的也过来了。对, 然后就是在导入的时候啊,我也遇到过啊,他可能还有其他提示,就是你这个 mod 啥的也都对,但是会有其他的提示,你可以截图翻一下看看啥意思啊,反正要确认一下,可别给你少东西。那么除此之外呢,他还能修改了,比如我这里加几个,直接再去填, 看见没有,刚改的他就能过来,这个能后期修改还是挺方便的。然后说完修改还有种情况呢,就是你想在你现在已有的变量里面呀,用这个工具去编辑或者新增,那比方说这个 就是我们之前手动加进来的,也就是你已有的变量,那我们想用这个工具往里面加行不行呢?可以,你这个名字要打对。所以说我们先这个这个加一列啊,那你就得叫 叫草帽一,那如果你第二列也有的话,你这名都叫依次打。对啊,我这里就不打了,一个草帽一。那比如说我就加颜色叫 secondary, 然后颜色我就随便给一个啊,然后呢?获取连接 这边粘进来这里的因素,一个是这个名字打对,还有一个这个 collection 的名字你也得打对,所以,哎, collection more 可别打错了,我们现在走,你 看到没有,我们刚才那个颜色已经加到这个里面了,而第二列我没填嘛,他会自动给一个默认的白色啊,然后插件本身没什么东西。第一个就是查看文档,但是跳转链接好像不对啊。完了,第二个呢,就是打开他那个官方的案例,哦,他这个案例跟 开头的还不一样啊。那么看到他这个我想起来了,就是这一列反正就四种吧,也没有。第五种就是你可以做成那个选项模式的,所以我记得这个可以复制 我们弄一个副本。因为没有编辑权限吗?复制完之后你看见没有?哎,你就能直接选这四个了,这是一个方便的方法啊。呃,再有一个呢,他这个案例,呃,这几个我来说一下刚才是不是漏了, 就是你发现没有,他这几个头啊,都带一个美元符号。这个意思就是这是特殊的列,他们不会作为这个 mod 去填进去,而是有特殊作用。比如第一个呢,就是那个变量的描述啊, 呃,具体在哪呢?点开,嗯,这不吗啊,弄完之后就填到这了,每一列都有 描述,你不想填就不填。后面这三呢,就是那个开发相关的 is 安卓 web, 具体在哪这里看见没有?就对应了三个。 这个呢就是你就理解为是开发有特殊需求啊,可能说你哎,我复制代码缺东西,或者前缀或者后缀或者哪不一样,或者想加一个统一的名字,你给他看看这个, 然后你们试一下,他说,哎,就是这个功能啊,那你就看什么要求啊,具体是 i s 还是哪统一要加什么怎么加就可以在这里去写啊,对应到飞行码里面,就是这里, 如果没什么提及需要的话就不加,这是空的。所以这样的话官方在插件里提供了一个,这算是一个模板了,大家也不用去删,你复制一份直接把它多的这这一列啊,这一列删了,因为免费版 不需要第二例对吧?除非你你真的需要你再加,然后这都是简单的案例,你不需要就删掉啊,直接拿着这个用就挺好。好了,那然后呢,他这个插件吧,底些反馈不少啊。也不多吧,反正才二十四个,但是 他这个有点那什么,他作者上次更新是六个月之前是吧,你搁这看的话是二零二三年十月份的更了一波,所以也就意味着他这个插件更新的不够勤。那这个 bug 方面啊,稳定性怎么样? 呃,包括后续能不能长长时间使用什么的,这就不太能保证啊,大家也做个参考啊。那就是以上,我是草帽,我们下期再见。

如何使用飞格拉组件呢?首先我们将图标与文字进行编组,然后点击图标创建组件,将组件子版复制出来。同样的操作于另一个图标, 有该棱形图标的为模板,点击子版组件可进行组件替换,在模板组件进行的更改会直接作用到子版组件上去, 再又不资产百块也可查看组建内容,快来尝试飞滚外的组建功能吧!一个核桃,专注名企,高薪就业!

哈喽,小伙伴们大家好,我是巴拉黑。那前几天我接了一个动画的项目,在所有的分镜和素材都确认好的情况下,我们准备开始做动画的时候,插画师小姐姐跟我说 他是用菲格曼来进行制作的,那我听到这个消息的时候有点崩溃,因为我之前从来没有和 ui 设计师进行配合过,但在我研究了一下以后,我发现菲格曼还是可以完美导入 a 来进行动画制作的。那我接下来给大家演示一下, 首先我们要下载 ae 和非格码,两个软件,同时都需要下载安装,然后用这个插件来进行互通,那我这边给大家演示一下, 那首先我们打开飞个码,打开飞个码以后,我们需要把那个设计那边给到我们的那些素材给他导进来,导进来以后等他加载一下, 叮当完以后呢,它这边会出现在这里, 然后我们双击进去。好,那我们首先来讲一下插件的安装,我们点击这个三角形,那我会提供大家一些安装包,这些安装包我会放在 qq 群的群文件里。 那首先我们点击这个三角形,点击三角形以后,这里有一个 plugin, 然后点击 development, 然后点击这个 找到我提供男生包,然后这里双击这个零零点八点二这个东西,然后点击飞个马,飞个马这里有一个 gson 文件,然后点击他,然后点击打开, 那这边就会加载出这个插件,我们点击这个 run, 那这个插件就会出现在这个地方,可以看到吗?然后我们 挑选这个元素啊,点击发送到 ae, 我们直接点击发送到 ae, 那这时候 ae 它就会自动加载出来,那这些界面都保留的,我们可以看到这些层都是已经封好的,我们可以拿它来自动化。 然后呢这个字体大家可以看到有点丢失,那是因为我这个字体没有安装和他一模一样的字体, 那需要设计那边把它的字体给到我们安装一下,然后导入到 a e 里的时候,才不会字体一个丢失 啊,还是比较简单的飞机码的安装。我讲完以后来讲一下 ae 这个插件的安装,那我们选择第一个这个,嗯,不带这个零点八点二的这个插件, 我们双击它,双击它以后呢我们勾选这个 agree, 然后点击这 安装,然后等待它安装,然后它安装好以后呢我们点 close, 我们安装完以后会出现一个这个界面,然后呢出现这个界面以后,我们点击这个零点八点二这个文件夹,然后这里有个 ae, 我们把这个 z xp 的文件直接拖到这个拖到这里面来,然后松手, 然后点击安装,然后等待它安装完以后,我们在 ae 这个窗口里点击窗口点击扩展,这里有一个给它勾选上,那 ae 这边就会出现一个插件的面板,就那就可以在我们的 fake 码和 ae 里进行互通了, 操作还是比较简单的。那拆迁我就放在这个全文件里,我就不给大家发百度链接了,因为百度链接 他偶尔会,他有可能会失效,那我也不可能定期的给那个百度链接进行更新,然后上传 b 站,大家直接进群来下载就行了,那我们下期再见,拜拜。

在计时设计当中,我们要创建设计文件的方式有三种,第一种直接创建第二种文件进行导入,第三种链接进行导入。那么在这三种方法当中,第一种我们就不用多说了,第二种文件导入是什么意思呢?也就是计时设计,他支持我们从外部导入 gsd 文件,也就是计时设计自己的一个文件。 换句话来讲,比如说我给大家去提供一些设计文件,然后这些设计文件里面包含了比如我们课程要用的一些素材,课程上面做的一些演示,那这个演示我要用怎么用呢?那绝对不是双击直接进行打开,我们做个简单的演示,比如说正常你要点击上面的一个导入文件,然后从右侧干嘛呢?拖这个 gsd 文件到这里面来, 然后再点击完成,你的文件就可以上传到你自己的文件目录里面来。那很多同学干嘛呢?你会去双击这个我们导出的文件,那个双击是不会产生任何效果的,大家一定要记住这一点, 所以并不是说我不能跟软件关联,而它本身就不带这样的功能,你必须得是手动把它拖拽进来。 那么第二件事情,我们的导入也不仅仅只是导入我自己计时设计的 j、 s、 d 而已,它还可以干嘛呢?还可以导入各种其他的原文件类型,比如说你导出的 big 码格式的文件,插 d 格式的文件, sketch 格式的文件,或者 r p 格式。 r p 格式指的是 extra, 也就是我们产品经理在 进行圆形设计的时候使用的这款软件,用的这一个原文件,我都可以把它导入到进行设计当中来,所以导入的方法跟刚才是一样的, 还是一样,我们点击下导入文件,然后干嘛呢?你把其他的这些设计文件拖拽,然后放手就可以导入进来,包括 psd 其实也是可以的,你可以看到上面支持的这一个软件图标列表,然后你再打开 就可以打开已经我们在其他软件里面完成的这一个界面的图层和效果。那么最后一种就是飞格码的导入里面有一种特殊的方法,他允许我们干嘛呢?直接使用链接进行导入,也就这个链接,我不用把飞格码的文件直接下到本地,我通过这个链接直接把这链接访问完的这些数据写入到 自己设计的这个原文件里面来。那这个链接的方式就是你们要先打开 famer 这软件,然后在他的分享里面,一定要记得分享下面有个东西,什么 copy link, 下面这 copy link 点完了之后,然后我们再进入到这些设计里面,点击导入文件,它有个链接导入,链接导入里面我们通过点击授权,然后在授权之后的这一个 就是输入框当中把这一个链接地址贴入进去,我们就可以去创建出对应的这一个设计文件出来,也就是把那边的设计文件复制进来。

哈喽,看到这个视频标题,你是不是以为说我是来教你如何写代码来开发小程序的,其实呢不是的,我是推荐一个非常好用的一个平台, 它可以帮助你在零技术无代码的基础下面完成小程序的开发和设计。大家来看一下,我现在打开的是乔拓云平台开发的一个小程序模板,那这个模板的话呢,大家可以在他的官网里面直接打开的,你可以在百度上面搜索乔拓云三个字呢,就可以找到他的官方网站, 在网站里面点击免费注册呢,你就可以在这里面完成账号的注册,然后登录到他的后台,后台这边有一个轻应用小程序卡片, 在这里点击去管理,进入到小程序的后台操作页面左上角点击设计小程序,打开小程序的模板页面,也可以直接套用这里面的模板,就可以快速开发自己的小程序了。我们随便选择一个行业,然后点击去 预览一下这个模板,这时候你可以用手机来扫码,然后在手机上面也可以预览到这个小程序模板的页面效果。点击替换以后,我们进入到模板的编辑页面,现在看一下这个编辑页面中间是小程序模板 的预览页面,模板上面的这些图片还有文本内容呢,你都可以自定义编辑更改,比如说这里面的文本,你可以选中编辑,然后 在这个预览框这里直接可以修改,右边会弹出一个文本设置面板,在文本设置面板这里,你可以调整文字的字号以及颜色,如果你选中的是图片,右侧会弹出一个图片设置面板, 在这里你可以修改图片跟改图片框框,还可以给这些文本或者是图片设置跳转页面,我们来到左侧这边可以看到这里有一个页面功能,你要跳转到哪一个页面呢?你都可以在这里面设置。在左侧的模块功能这里呢还可以看到有非常多的呃 空白的功能模块,这些功能模块呢,你都可以直接添加的,你都可以直接点击添加,添加进来之后呢,可以对该模块进行编辑修改,我们添加一个服务列表模块之后呢,右侧会自动弹出该模块的编辑面板,你可以在这里面勾选要展示的 服务或者是商品。在完成页面的装修和设计以后呢,就可以将这个设计好的小程序提交微信官方审核,整个装修的过程呢就是这么简单,感兴趣的朋友可以自己去体验一下,零代码,零技术完成小程序的开发。

微信小程序商品上架流程,上架自己的商品目录到小程序页面中,选择一个小程序模板开发平台。乔拓云在这个平台里面注册会员,打开商城后台管理页面。第一个步骤,先去开通小程序账号, 如果也有小程序,可以直接授权。第二步,在小程序模板中心筛选模板,打开模板编辑页面。第三步,回到后台,点击产品功能,在后台这边管理产品, 一键导入所有商品目录。第四步,编辑小程序上架商品。在底部导航这边可以直接添加一个商品的分类页面。乔拓云开发了小程序所有相关页面, 你可以在这里面选择产品分类或者是产品的筛选页面,添加一个产品分类页面,进来之后在右侧编辑面板这里自定义来编辑上架商品,在这里来添加分类,然后选择要展示的商 品类别,就这样子上架商品。操作非常简单,不需要懂得代码技术,你就可以轻松搞定。将所有的商品类别添加进来,更改这个产品分类页面的展示样式,就这样子上架商品到小程序中。你也可以在编辑小程序首页这里,通过添加这边的产品模块来上架商品, 点击这边的产品展示模块,自定义更改模块的标题,更改模块展示的样式,勾选展示的商品,就这样子来上架商品到小程序页面中。装修完毕,将这个小程序界面提交微信官方审核即可。

刚发现一个极其炸裂的 fake 马叉怎么办?所有线上的网站导入 fake 马白嫖不舍学习走开整!第一步,打开 fakema, 并新建一个文件,找到这个插件,打开。第二步,打开一个你想要复制的网站,咱们就以设计界的神苹果官网举例,记一下网站长啥样, 然后复制网址。第三步,把网址粘贴到插件里,点导入。哎呀妈,简直不敢相信自己的眼睛,连图层都是分好的内容随意编辑 nice, 还等啥,赶紧去学习吧!有啥问题评论或私信我。

呃,给大家录制一下我们小程序前端应该怎样去上上代码。首先我们这里选择导入,导入就选择咱们的这个全单这里, 然后这个 app id 的话改成你自己小程序的 id 啊,然后导入啊,我这里已经导入过了,是我直接打开。好,直接打开,首先第一步呢就是这里你要替换一下自己的这个玉米啊,替换一下可以了, 玉米替换一下,然后就是小程序的 app id 啊,要去也要去替换一下,替换一下以后,然后有两个地方我们需要改一下,首先第一个地方就是这里, 这里就是你公众号的链接,你要去更换一下,还有就这个文件。好,第三十号 啊,这里这里就是一个跳转,也就是这个发现页面,这里啊这里是公众号连接跳跳转连接修改,这里就是一个小小程序的跳转啊,就这两个地方,然后呢这里就上传 好,这里上传就可以了,上传以后就来到咱们的小程序这边啊,然后这里提交代码审核通过啊,就可以了。