哦嚯！我只用CV大法就实现了小程序的底部导航栏你信吗？
底部导航栏这种需求是前端开发经常要遇到的啦，如何只用CV就实现呢？
今天小编将自己的前端开发 “外挂” 推荐给大家。
一、新建一个小程序项目
二、登录codeFun
codeFun域名：code.fun
- 没有项目的话需要先“创建项目”
- 关于设计稿如何上传的问题，请阅读本篇文章最后的“附录-设计稿上传”的补充说明部分内容
三、获取codeFun生成的代码
代码获取步骤
- 打开顶部的“查看代码”功能；
- 选中当前设计稿的底部导航栏区域；
- 设置要生成的代码平台和尺寸信息；
- 复制已生成的代码到微信开发者工具；
如下图所示
四、复制到项目中使用
就这效率和设计稿的还原度，我只想问 还有谁？
下面给大家正式介绍一下我的前端开发 “外挂” 吧
五、codeFun技术特色和产品特点介绍
codeFun是UI设计稿智能⽣成源代码解决⽅案，核心能力是将UI 设计稿⼀键⽣成源代码。
技术特色：
- 布局体系推算：⽀持弹性布局、响应式布局，⾃动推算布局⽅案。
- UI模式预测：⾃动解析元素之间的关系，对 UI 模式进⾏推断预测。
- 屏幕适配推算：⽣成的代码⾃适应不同尺⼨的屏幕，对不同类型的元素⾃动推算定位⽅案。
- 数据绑定等：引⼊数据源，设置与绑定变量，⾃动⽣成带有数据库引⽤的代码。
从上面截图示例的代码来看就能看出，能生成有语义的代码。代码的语义化是非常重要的。
产品特点：
- ⽆约束：⽆需标注，⽆需设计规范，不需要改变现有⼯作⽅式与流程。
- 设计师友好：注册即可使⽤，设计师⽆额外⼯作量，免去设计师UI标注、UI⾛查的时间。
- 学习成本极低：⼀键上传设计稿，⼀键复制源代码，⽆需帮助，即刻上⼿。
- 易于跟现有⼯作流程整合：有设计稿就能得到完整可⽤源代码，⽆需引⼊额外流程，也不破坏既有流程。
打工人！你还不来跟我一起体验一下我的“外挂”？
附录：
设计稿上传
codeFun上传设计稿文档链接：code.fun/docs/快速上手#上…
codeFun入门视频教程链接：www.bilibili.com/video/BV1CP…
