当前位置: 首页 > 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语言
在这里插入图片描述

相关文章:

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

项目介绍 本软件是一款强大的所见即所得前端页面设计器,是低代码开发领域的基础设施,生成的代码不依赖于任何框架,实测可以将前端布局工作的耗时减少80%以上,最关键的是,它实现了人人都可以写前端页面的梦想。 不用写…...

如何将PyCharm 中使用 PDM 管理的 Django 项目迁移到 VS Code 并确保一切正常工作?

嗨,我是兰若姐姐,相信很多小伙伴都遇到过这种情况,使用pycharm用习惯了,想换个编辑器,比如换成vscode,今天就告诉大家,如果轻松切换到vscode 步骤 1:在 VS Code 中打开项目 打开 V…...

认识Android Handler

“Android Handler” 通常指的是 Android 开发中的 Handler 类,它是 Android SDK 的一部分,用于管理消息队列和线程之间的通信。它在 Android 开发中非常有用,特别是在计划消息和可运行对象(Runnables)在未来某个时间点…...

如何在 Ubuntu VPS 上安装 Cassandra 并运行单节点集群

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到网站。 介绍 Cassandra,或者说 Apache Cassandra,是一个高度可扩展的开源数据库系统,在多节点设置上能够实…...

Golang | Leetcode Golang题解之第316题去除重复字母

题目&#xff1a; 题解&#xff1a; func removeDuplicateLetters(s string) string {left : [26]int{}for _, ch : range s {left[ch-a]}stack : []byte{}inStack : [26]bool{}for i : range s {ch : s[i]if !inStack[ch-a] {for len(stack) > 0 && ch < stack…...

pxe的实验

首先搭好实验环境、 如果没有安装好图形&#xff0c;则需要用yum groups list找到有“GUI”的然后用yum groups " " 把含有GUI的复制到双引号里安装 然后再执行init 5 打开图形 Kickstart 如果dnf用不了改成yum 然后在用yum install httpd -y 安装好http的软件 之后…...

复杂智能软件系统开发

软件开发技术总是伴随着计算技术的时代问题向前发展,随着智能计算时代的到来,软件界需要回应智能软件开发的问题。 大型机时代,软件开发的主要问题是软件开发的效率和质量问题,用机器指令或汇编语言编写软件,效率低、质量差。随着高级程序设计语言的出现及其自动编译技术…...

kickstart自动安装脚本

当安装Linux操作系统时&#xff0c;安装过程会需要回答很多关于设定的问题 这些问题必须手动选择&#xff0c;否则无法进行安装。当只安装1台Linux系统&#xff0c;手动选择设定工作量比较轻松&#xff0c;当安装多台Linux&#xff0c;这些设定需要重复多次&#xff0c;这些重复…...

linux运维一天一个shell命令之grep详解

一、概念 grep 是 Linux 和 Unix 系统中一个非常常用的命令行工具&#xff0c;用于搜索文本文件中的特定模式。它支持正则表达式&#xff0c;并能在文件中快速查找匹配的行 二、正则表达式 1.概念 正则表达式&#xff08;Regular Expressions&#xff0c;简称 regex 或 reg…...

COMSOL金属氢化物-放氢过程

在此记录下放氢过程的软件设置思路 1、采用的是"达西定律""层流" 物理场&#xff0c;其中"层流"物理场选择了”弱可压缩流动“&#xff0c;这里主要是选择”可压缩流动“的话&#xff0c;算出来的瞬时流量值跟实测差距太大了。 2、设置"达西…...

(四)软件性能测试

1. 性能测试包含的方法有哪些&#xff08;至少列举5种&#xff09;&#xff1f; 正确回答通过率&#xff1a;69.0%[ 详情 ] 推荐指数&#xff1a; ★★★★★ 试题难度&#xff1a; 中级 性能测试大致分为以下六类 1、验收性能测试&#xff1a; 通过模拟生产运行的业务压力量…...

萱仔大模型学习记录5-langchain实战

前面我的bertlora微调已经跑出了不错的结果&#xff0c;我也学会了如何在bert上使用Lora进行微调&#xff0c;我后续会补充一个医疗意图识别的项目于这个系列&#xff0c;现在这个医疗意图识别代码还暂时不准备公开。我就继续按照我的计划学习一番LangChain。 LangChain是一个用…...

安装使用netron

1.安装netron pip install netron2.使用以下命令,然后打开浏览器查看。 netron netron --host 0.0.0.0 --port 6780 netron "model_path" --host 0.0.0.0 --port 67803.在jupyterlab中使用 github有人推荐的方法&#xff0c;jupyterlab部署在本地的可以用…...

JDFrame 一款比 Java 8 Stream 更灵活的数据处理工具

一、JDFrame 介绍 在大数据处理领域&#xff0c;Apache Spark以其强大的分布式计算能力和丰富的数据处理API而广受好评。然而&#xff0c;在许多日常的软件开发场景中&#xff0c;我们面临的数据量可能并不需要Spark这样的分布式系统来处理。相反&#xff0c;我们更希望有一种…...

《Android系统开发中高级定制专栏导读》

《Android系统开发中高级定制专栏导读》 欢迎来到【Android系统开发中高级定制‘】专栏&#xff01;在这里&#xff0c;将深入探讨Android系统开发与定制的方方面面&#xff0c;涵盖从系统接口定制、权限管理、系统应用配置、驱动入门配置等多个领域。无论你是刚接触Android系…...

LeetCode 114. 二叉树展开为链表

更多题解尽在 https://sugar.matrixlab.dev/algorithm 每日更新。 组队打卡&#xff0c;更多解法等你一起来参与哦&#xff01; LeetCode 114. 二叉树展开为链表&#xff0c;难度中等。 DFS 解题思路&#xff1a;先用 DFS 遍历二叉树&#xff0c;将树的结果存放在 List 中&am…...

78.子集

给你一个整数数组 nums &#xff0c;数组中的元素 互不相同 。返回该数组所有可能的子集&#xff08;幂集&#xff09;。 解集 不能 包含重复的子集。你可以按 任意顺序 返回解集。 &#xff1a;总 // 注释的都为后来思考不必要的 class Solution {List<List<Integer…...

历史标签如何时间迁移?

本文解析的论文是&#xff1a; Lin, C.; Du, P.; Samat, A.; Li, E.; Wang, X.; Xia, J. Automatic Updating of Land Cover Maps in Rapidly Urbanizing Regions by Relational Knowledge Transferring from GlobeLand30. Remote Sens. 2019, 11, 1397. https://doi.org/10.33…...

Jenkins参数化构建

目录 一. 准备ansible 二. Gitlab新建子项目 三. Jenkins建立任务&#xff0c;进行初步配置 四. 导入nginx主机的公钥 五. 配置ansible执行脚本 六. 构建测试 一. 准备ansible 在jenkins主机中安装ansible [rootjenkins ~]# yum install -y epel-release [rootjenkins…...

函数实例讲解(三)

文章目录 常用的三个数学函数1、绝对值函数ABS2、取整数部分INT3、求余数函数MOD 求极值函数max、min1、Max2、Min 附加条件下求平均数1、AVERAGE2、AVERAGEIF3、AVERAGEIFS VLOOKUP与COLUMN1、VLOOKUP2、COLUMN 查找函数LOOKUP1、基础语法2、向量形式3、数组形式 常用的三个数…...

网络编程(Modbus进阶)

思维导图 Modbus RTU&#xff08;先学一点理论&#xff09; 概念 Modbus RTU 是工业自动化领域 最广泛应用的串行通信协议&#xff0c;由 Modicon 公司&#xff08;现施耐德电气&#xff09;于 1979 年推出。它以 高效率、强健性、易实现的特点成为工业控制系统的通信标准。 包…...

【Python】 -- 趣味代码 - 小恐龙游戏

文章目录 文章目录 00 小恐龙游戏程序设计框架代码结构和功能游戏流程总结01 小恐龙游戏程序设计02 百度网盘地址00 小恐龙游戏程序设计框架 这段代码是一个基于 Pygame 的简易跑酷游戏的完整实现,玩家控制一个角色(龙)躲避障碍物(仙人掌和乌鸦)。以下是代码的详细介绍:…...

Leetcode 3576. Transform Array to All Equal Elements

Leetcode 3576. Transform Array to All Equal Elements 1. 解题思路2. 代码实现 题目链接&#xff1a;3576. Transform Array to All Equal Elements 1. 解题思路 这一题思路上就是分别考察一下是否能将其转化为全1或者全-1数组即可。 至于每一种情况是否可以达到&#xf…...

树莓派超全系列教程文档--(62)使用rpicam-app通过网络流式传输视频

使用rpicam-app通过网络流式传输视频 使用 rpicam-app 通过网络流式传输视频UDPTCPRTSPlibavGStreamerRTPlibcamerasrc GStreamer 元素 文章来源&#xff1a; http://raspberry.dns8844.cn/documentation 原文网址 使用 rpicam-app 通过网络流式传输视频 本节介绍来自 rpica…...

C++:std::is_convertible

C++标志库中提供is_convertible,可以测试一种类型是否可以转换为另一只类型: template <class From, class To> struct is_convertible; 使用举例: #include <iostream> #include <string>using namespace std;struct A { }; struct B : A { };int main…...

VB.net复制Ntag213卡写入UID

本示例使用的发卡器&#xff1a;https://item.taobao.com/item.htm?ftt&id615391857885 一、读取旧Ntag卡的UID和数据 Private Sub Button15_Click(sender As Object, e As EventArgs) Handles Button15.Click轻松读卡技术支持:网站:Dim i, j As IntegerDim cardidhex, …...

【ROS】Nav2源码之nav2_behavior_tree-行为树节点列表

1、行为树节点分类 在 Nav2(Navigation2)的行为树框架中,行为树节点插件按照功能分为 Action(动作节点)、Condition(条件节点)、Control(控制节点) 和 Decorator(装饰节点) 四类。 1.1 动作节点 Action 执行具体的机器人操作或任务,直接与硬件、传感器或外部系统…...

ESP32 I2S音频总线学习笔记(四): INMP441采集音频并实时播放

简介 前面两期文章我们介绍了I2S的读取和写入&#xff0c;一个是通过INMP441麦克风模块采集音频&#xff0c;一个是通过PCM5102A模块播放音频&#xff0c;那如果我们将两者结合起来&#xff0c;将麦克风采集到的音频通过PCM5102A播放&#xff0c;是不是就可以做一个扩音器了呢…...

【论文笔记】若干矿井粉尘检测算法概述

总的来说&#xff0c;传统机器学习、传统机器学习与深度学习的结合、LSTM等算法所需要的数据集来源于矿井传感器测量的粉尘浓度&#xff0c;通过建立回归模型来预测未来矿井的粉尘浓度。传统机器学习算法性能易受数据中极端值的影响。YOLO等计算机视觉算法所需要的数据集来源于…...

ETLCloud可能遇到的问题有哪些?常见坑位解析

数据集成平台ETLCloud&#xff0c;主要用于支持数据的抽取&#xff08;Extract&#xff09;、转换&#xff08;Transform&#xff09;和加载&#xff08;Load&#xff09;过程。提供了一个简洁直观的界面&#xff0c;以便用户可以在不同的数据源之间轻松地进行数据迁移和转换。…...