当前位置: 首页 > news >正文

前端低代码必备:FrontendBlocks 4.0版本重磅发布,助力Uniapp-X原生APP开发

项目介绍

本软件是一款强大的所见即所得前端页面设计器,是低代码开发领域的基础设施,生成的代码不依赖于任何框架,实测可以将前端布局工作的耗时减少80%以上,最关键的是,它实现了人人都可以写前端页面的梦想。
不用写一行代码即可让设计师、前端开发人员轻松设计出前端代码的利器,100%还原设计稿不再是梦。对于Uniapp开发非常友好,可以快速生成组件和页面。
本软件可以生成HTML5代码、按2x生成手机端VUE代码、按1x生成电脑端VUE代码,也可以直接生成JSON串,供其他开发工具(包括自主研发的)进行二次加工。
本软件采用Apache 2.0协议开源,可以免费商用。如有任何问题欢迎反馈,让我们共同建设好该开源项目。突出代码贡献者将会把名字写入README.md中,欢迎贡献。
简而言之:本项目主要用于快速布局,特别适用于个性化定制时的开发,帮你快速把页面的骨架搭出来,摆脱那些琐碎的CSS样式,专注于业务。
当然它也有不适用的场景:大量依赖ElementUI、AndDesign等第三方库的项目。如果你要做一个互联网应用,比如APP、小程序、H5应用、HTML单页,甚至是PC端结构特别复杂的布局时,它就非常有用了。

更新日志

4.0版本支持将设计稿生成为Uniapp-X的uvue代码,可以被直接编译成原生Android(Kotlin)、iOS(Swift)、鸿蒙(ArtTs)代码。不得不说,Uniapp-X是真的很牛,强烈推荐

项目仓库位置

官网
https://www.yumeisoft.com/h-col-149.html

仓库位置
https://gitcode.com/yumeisoft/frontend-blocks

视频教程
https://edu.csdn.net/course/detail/38322

范例

首先像在原型设计软件里一样去设计页面的样式、弹性布局、对齐、元素表达,只需点一点即可
在这里插入图片描述
点击生成Uniapp-X手机端
在这里插入图片描述
生成的代码非常规整
在这里插入图片描述
运行后效果
在这里插入图片描述
开发者选项开启布局边界显示后可以明显看到是由一个一个组件构成的(注:这是Uniapp-X的能力),而非整体是个WebView
在这里插入图片描述
通过查看中间代码index.kt,可以明显看到已经编译成了Kotlin语言
在这里插入图片描述

相关文章:

  • 北京网站建设多少钱?
  • 辽宁网页制作哪家好_网站建设
  • 高端品牌网站建设_汉中网站制作
  • ChatGPT能代替网络作家吗?
  • 主题巴巴WordPress主题合辑打包下载+主题巴巴SEO插件
  • 深入理解接口测试:实用指南与最佳实践(一) 环境安装
  • Vue学习指南
  • 洛谷 P1347 排序(福建省历届夏令营)(图论:拓扑排序)
  • 暂存篇:高频面试题基本总结回顾(含笔试高频算法整理)
  • windows中node版本的切换(nvm管理工具),解决项目兼容问题 node版本管理、国内npm源镜像切换(保姆级教程,值得收藏)
  • Spring-创建bean
  • 谷粒商城实战笔记-122~124-全文检索-ElasticSearch-分词
  • JVM—虚拟机类加载器
  • 机器学习练手(三):基于决策树的iris 多分类和波士顿房价预测
  • 华为的流程体系
  • 【大模型】【面试】独家总结表格
  • ISA95-Part8-错误处理的设计与集成
  • 【二】测试工具
  • IE9 : DOM Exception: INVALID_CHARACTER_ERR (5)
  • [译] React v16.8: 含有Hooks的版本
  • 【EOS】Cleos基础
  • export和import的用法总结
  • interface和setter,getter
  • JavaScript/HTML5图表开发工具JavaScript Charts v3.19.6发布【附下载】
  • JavaWeb(学习笔记二)
  • mysql 5.6 原生Online DDL解析
  • Redis中的lru算法实现
  • Vue2.0 实现互斥
  • Work@Alibaba 阿里巴巴的企业应用构建之路
  • 飞驰在Mesos的涡轮引擎上
  • 机器学习学习笔记一
  • 极限编程 (Extreme Programming) - 发布计划 (Release Planning)
  • 力扣(LeetCode)56
  • 猫头鹰的深夜翻译:JDK9 NotNullOrElse方法
  • 一天一个设计模式之JS实现——适配器模式
  • 中文输入法与React文本输入框的问题与解决方案
  • ​14:00面试,14:06就出来了,问的问题有点变态。。。
  • ​埃文科技受邀出席2024 “数据要素×”生态大会​
  • ​二进制运算符:(与运算)、|(或运算)、~(取反运算)、^(异或运算)、位移运算符​
  • # Pytorch 中可以直接调用的Loss Functions总结:
  • # 移动硬盘误操作制作为启动盘数据恢复问题
  • (2024)docker-compose实战 (9)部署多项目环境(LAMP+react+vue+redis+mysql+nginx)
  • (4)logging(日志模块)
  • (8)STL算法之替换
  • (PADS学习)第二章:原理图绘制 第一部分
  • (博弈 sg入门)kiki's game -- hdu -- 2147
  • (二十三)Flask之高频面试点
  • (九)c52学习之旅-定时器
  • (力扣)循环队列的实现与详解(C语言)
  • (三维重建学习)已有位姿放入colmap和3D Gaussian Splatting训练
  • (一)模式识别——基于SVM的道路分割实验(附资源)
  • .mat 文件的加载与创建 矩阵变图像? ∈ Matlab 使用笔记
  • .net 7 上传文件踩坑
  • .NET Core、DNX、DNU、DNVM、MVC6学习资料
  • .NET NPOI导出Excel详解
  • .NET 中小心嵌套等待的 Task,它可能会耗尽你线程池的现有资源,出现类似死锁的情况
  • .netcore 6.0/7.0项目迁移至.netcore 8.0 注意事项
  • .NetCore部署微服务(二)