TaskBuilder前端页面UI界面设计

taskbuilder
• 阅读 148

TaskBuilder前端页面UI界面设计 为了方便大家快速设计前端页面的UI界面,TaskBuilder提供了可视化的UI界面设计器,在该设计器内,可以从左侧的组件库中拖拽组件到页面上实现组件的添加,TaskBuilder提供了几十种丰富的UI组件,分为容器组件、只读组件、基础输入项、扩展输入项、不可视组件、导入导出组件、统计图表和媒体组件等,每个组件都可以设置详细的样式、属性和事件,可以实现UI界面的高保真设计。支持拖拽组件改变位置,支持剪切复制粘贴组件,支持撤销重做。 tfp前端页面的UI界面设计器如下图所示: TaskBuilder前端页面UI界面设计 从上图可知,整个UI界面设计器从上至下、从左至右分为以下几个区域: (1)工具栏:在此提供了保存、另存、预览、刷新、复制、剪切、粘贴、删除、撤销、重做、上移、下移等按钮,点击即可执行对应的操作; (2)样式设置栏:在此可以精确设置组件的各种外观样式,包括显示和定位、字体和文本、边框和边距、背景这几大类; (3)组件库和组件大纲:组件库里提供了几十款常用UI组件,点击左侧的组件分类图标可以分别查看各个类别里的组件列表,将组件库里的组件拖拽到页面上,即可实现组件的添加。点击组件大纲,可以按树形结构查看当前页面里所有组件的列表; (4)组件路径导航:在此可以查看从当前选中组件一直追溯到页面组件的所有父组件的路径,以便清晰了解当前组件的嵌套关系,点击其中任何一个父组件都可以直接选中该组件; (5)页面内容编辑区:在此编辑当前页面的内容,可以鼠标拖拽组件的位置,点击组件可以选中组件,然后在顶部样式栏设置组件样式,在右侧属性和事件栏设置组件的属性和事件; (6)不可视组件列表:用来显示当前页面里不可视的组件,例如服务请求组件和计时器; (7)属性和事件设置面板:在此可以设置组件的属性和事件,每种组件的属性和事件都不一样,默认显示属性列表,点击该面板顶部的“事件”选项卡,可以查看和设置组件的事件;

点赞
收藏
评论区
推荐文章
Alex799 Alex799
3年前
5款vue前端UI框架
Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue采用自底向上增量开发的设计。实用的Vue.js组件库可以帮助我们快速搭建页面,下面介绍小编认为比较受欢迎的五个vue前端ui框架。TOP5——VueBluVueBlu是基于Vuejs和Bulma开发的开源UI组件库。旨在为PC端的前端开发(特别是中后台产品)提供一个快速且灵
Wesley13 Wesley13
3年前
AT
!(https://oscimg.oschina.net/oscnet/9bcf9c4a197687d0f09aa8b0d010e9470c7.jpg)ATUI是一款基于Vue2.x的前端UI组件库,主要用于快速开发PC网站产品。没错,这是又一款基于Vue的前端UI组件库,又双叒叕款UI库~又双叒叕款轮子
Stella981 Stella981
3年前
Android学习笔记(二) 布局方式的介绍
Android应用的开发的一项内容就是用户界面开发了。Android提供了大量功能丰富的UI组件。Android的界面是由布局和组件协同完成的。!(http://static.oschina.net/uploads/space/2014/0304/213204_usD8_865771.gif) Android所有UI组件都继承了View
taskbuilder taskbuilder
1个月前
TaskBuilder前端组件简介
3.3.3.1前端组件的分类前端页面是由众多组件层层嵌套构成的,这些组件是任讯信息自主研发的一套前端UI组件,称为tfp组件,这些组件根据其功能和特点又分为几大类,它们的继承关系如下图所示:从图中可知,所有组件都是从一个名为Component的根组件继承过
taskbuilder taskbuilder
4星期前
TaskBuilder前端请求后台服务的方式
TaskBuilder前端请求后台服务的方式在TaskBuilder的前端页面设计器的组件库里,有一个名为“服务请求”的不可视组件,它是前后端沟通的桥梁,前端页面都是通过这个组件来实现与后台服务的通信,在这个组件的属性里可以设置具体要请求的后台服务的路径,
taskbuilder taskbuilder
4星期前
TaskBuilder前后端通讯的数据格式
TaskBuilder前后端通讯的数据格式用TaskBuilder开发的应用,前后端传输的数据都是JSON格式的。4.5.1前端页面向后台服务发送的数据格式前端页面通过“服务请求”组件发送给任擎后台服务的数据是JSON格式的,示例如下:"service":
taskbuilder taskbuilder
1星期前
TaskBuilder数据添加页面前后端交互原理解析
在TaskBuilder内打开学员管理项目前端文件里的add.tfp页面,下面以这个文件为例介绍一下数据添加页面如何实现前后端的数据交互。如果要将页面里输入项的数据提交到后台,需要将这些输入项都放到表单组件中,然后通过表单组件实现数据的统一提交,具体原理如
taskbuilder taskbuilder
3个月前
TaskBuilder功能特性
1、基础功能组件化TaskBuilder将常用的功能封装成了组件,包括前端UI组件、后台业务操作等,开发业务功能时,可以像搭积木一样,通过鼠标拖拽就能快速实现前端界面设计和后台功能开发。tfp前端UI组件组件整体结构2功能设计可视化使用TaskBuilde
taskbuilder taskbuilder
1个月前
前端页面的内容格式
TaskBuilder可以编辑的前端页面类型分为HTML和tfp(TaskmsgFrontPage)两种格式,HTML格式只能用代码编辑器编辑,这种模式基本很少有人用,大家都用tfp格式,因为使用TaskBuilder向导创建的前端页面都是采用的tfp格式
taskbuilder
taskbuilder
Lv1
免费开源的企业级低代码开发工具,研发团队任讯信息参与低代码国家标准编制
文章
47
粉丝
0
获赞
0