即时设计制作完成怎么导出源码

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

大家好，我是老旧的程序员，今天我们来搭建一个充电站小程序页面 右侧是从即时设计上找的 ui 设计，通过我们的平台不写重复的样式代码， 拖拽空间，填上颜色、尺寸等信息，生成一个页面代码下面伴着轻松愉快的音乐，一起来看搭建过程，心急的小伙伴可以跳过搭建过程，直接看搭建结果。 好了，到这里页面已经搭建完成了，然后保存页面，生成代码， 复制生成的代码到 h b odex 中预览小程序页面效果已经出来了，大家觉得效果怎么样？欢迎评论留言。

在科目开发者工具的样式面板中，我们可以对一个元素的样式进行实时的修改和预纳，但是大家可能不知道，我们在对这些样式进行实时的修改的时候，其实我们也可以把这些修改同步到我们的原代码中， 比如说我在这把这个太极图的宽度改为四百，大家就可以看到，那么我左侧的原代码就时时的被改成四百了。那么这个操作是如何做到的呢？日要实现这个操作也很简单，我们打开 crom 的这个 son 面板，然后选择这个 five system 这样一个标签， 然后点击这添加文件到这个工作区，那么我们可以选择我们的这个项目的原码所在的目录，然后点击确定，那这个时候呢，他就会提醒我们需要对这个目录有完整的访问 权限，那么我们点击允许就可以了。那此时呢，我们就可以来到这个元素面板，然后对我们任何想要改的样式进行编辑，编辑之后呢，这些样式就会自动的被同步到我们的原单板当中。 不过有一点大家值得注意的哈，就是我们的这个样式文件呢，必须是由这个页面直接引入的，比如说我们常用的 view 或者是 reactor， 他们的原代码呢是经过编译后，然后再引入到这个 引入到这个页面的，那么这种情况下他就是不支持的，所以这种场景使用还是非常有限制的，但是呢，这也不妨碍我们多知道一个知识。好的，那么今天的分享就给大家说到这了，拜拜。