揭秘最受程序员喜爱的低代码三大功能之三:页面自由布局(页面代码源)

10月27日,活字格开发团队负责人雷学斌代表葡萄城做客掘金稀土开发者大会,在低代码探索专题分享中首次揭秘活字格最受专业开发者欢迎的三个特色功能及其实现原理,让我们一起看看低代码如何赢得程序员的“芳心”。本文将重点为大家介绍特色功能三:自由设计页面布局和样式。

可自由布局的解决方案

低代码是覆盖软件开发全生命周期的可视化解决方案。在用户界面设计阶段,低代码开发平台应该提供怎样的设计模式,在确保高度定制化的基础上,尽可能提升开发效率呢?为了解开这一难题,活字格的开发团队决定从“可视化开发”的源头寻找思路。

作为微软最早期的合作伙伴,葡萄城在为微软平台开发者提供大量控件的同时,对该平台的技术特性和背后的实现原理也有深刻理解。在开发WinForm程序的时代,Visual Studio的使用者将控件拖入窗体,IDE根据控件的位置和层次关系,自动生成包含这些信息的代码。运行时,这些代码被顺次执行,还原抽出与设计时一致的样式,达到所见即所得的效果。这种开发方式很快就成为了Windows程序开发的标准模式,程序员不需要将程序运行起来,就能在设计器上看到页面布局的效果。时至今日,市面上用户群体最大的ERP软件——用友U8 就是基于微软的技术栈,用这种可视化的方式完成开发的,在用户体验层面得到了企业用户的广泛认可。

揭秘最受程序员喜爱的低代码三大功能之三:页面自由布局(页面代码源)

(使用Visual Studio开发WinForm程序的体验)

于是,活字格将这种设计思想,结合Excel的操作体验,应用在Web页面开发中,最终提供了以绝对坐标为基准的页面设计方案。针对不同的应用场景,该方案有“固定布局”和“网格布局”两种模式。

两种布局模式

固定布局

固定布局是活字格的默认做法。开发者在设计器中像操作Excel一样在网格中完成页面元素的布置和样式设置;设计器会在发布时将包含有绝对坐标的页面设计存储为模型文件,并上传到服务器;在最终用户浏览器中运行的解析引擎会把元数据还原为与设计器中一致的Web界面。

揭秘最受程序员喜爱的低代码三大功能之三:页面自由布局(页面代码源)

(固定布局可实现严格意义上的所见即所得)

除了所见即所得带来的高开发效率,这种设计体验有以下三个显而易见的优势:

  1. 布局灵活:开发者可以在页面的任意位置放置任意元素,并设置为任意样式,而不必拘泥于平台内置的模板。
  2. 门槛更低:页面布局和样式设置的方式高度类似Excel,全程可视化;开发者不需要具备CSS知识即可完成页面设计;对于熟悉CSS的开发者,活字格还提供了对样式进行进一步调整的能力。
  3. 兼容性好:活字格的元数据解析引擎不依赖任何第三方JS框架或CSS样式库,可以确保页面在不同浏览器和设备上的表现一致。

此外,如果开发的目标是代替现有的Excel模板,或者需求方提供的设计方案是用Excel描述的,开发者还可以直接将Excel文件导入活字格。活字格将根据Excel自动生成页面,还原其中的内容和大部分样式,进一步减少页面开发工作量。

揭秘最受程序员喜爱的低代码三大功能之三:页面自由布局(页面代码源)

(使用活字格开发的“仿纸质单据”页面)

网格布局

固定布局可以确保最终页面的布局和预期完全一致,通常用于开发对界面布局要求非常严格的场景,比如,那些需要延续现有体验、降低使用人员培训成本的内部应用。但是,对于面向外部用户的应用,开发者通常需要提供更加“现代化”的界面,以提升用户满意度。此时,活字格提供的“网格布局”将会派上用场。

与固定布局参考了WinForm的设计思路类似,网格布局的设计思想则源于WPF。为了实现页面布局根据屏幕尺寸自动调整,WPF提供了Grid布局控件,并允许开发者通过在Grid.ColumnDefinition中设置Width=”25*”的形式控制各元素的尺寸占比。简单地说,在固定布局的基础上,将页面元素所在位置的绝对定位坐标,转换为可根据设定规则计算得出的动态坐标,就实现了网格布局(Grid Layout)。

在活字格的页面设计界面中,元素的绝对定位坐标是通过其所在的单元格来确定的,而单元格的位置则以行和列的方式进行描述。当我们将这些行和列设置成“根据内容自适应”或者“在指定的范围内按照比例进行分配”后,绝对定位的坐标就变成了根据规则计算得出的动态坐标。这种做法一方面提供了更具弹性的页面布局方式,另一方面因为延续了固定布局的使用体验,而不是将其割裂,最终使得活字格页面布局的学习曲线更平滑,开发者上手更容易。

揭秘最受程序员喜爱的低代码三大功能之三:页面自由布局(页面代码源)

(使用网格布局开发出的页面效果)

为开发者提供最大的自由度

不同的应用场景和最终用户群体,对页面布局和样式有着完全不同的要求。作为开发工具,低代码平台理应允许开发者自由开发各种风格的页面,但是很多低代码平台却没有这一点。所以,“用固定布局和网格布局的方式,自由设计页面”入选程序员最喜爱的活字格功能,也就很容易理解了。

活字格,出自专业控件厂商

在低代码领域,葡萄城具有得天独厚的自身条件。在2012年启动低代码预研前,葡萄城已经专注于软件开发工具领域32年,先后基于VBX、COM、.NET和纯前端等技术平台推出各类开发控件产品,并根据技术环境和用户需求的变化,积极进行产品和技术迭代,不断降低软件开发所需的代码量,提升软件开发生产力,积累了丰厚的技术实力和领先的研发经验。经过4年的研发,活字格低代码开发平台于2016年正式推出。为了与更多开发者共创共建,葡萄城采取了面向开发者免费的商业模式,迄今为止已有超过6万名开发者通过活字格走上低代码开发之旅,其中不乏来自软件公司和大企业信息化部门的专业开发者。

揭秘最受程序员喜爱的低代码三大功能之三:页面自由布局(页面代码源)

如果你是一名对低代码技术持观望态度的开发者,不妨搜索“活字格”,免费下载这款被数万名开发者选择的企业级低代码开发平台,和葡萄城一道,开启您的低代码之旅!

揭秘最受程序员喜爱的低代码三大功能之三:页面自由布局(页面代码源)

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

(0)
上一篇 2024年1月1日 上午9:20
下一篇 2024年1月1日 上午9:32

相关推荐

  • 公司管理制度各部门职责(公司管理制度各部门职责是什么)

    目 录 第一章 总则 一、公司管理大纲 二、员工守则 第一部分 公司管理制度 第一章 文件管理制度 第二章 档案管理制度 第三章 保密制度 第四章 印章使用管理制度度 第五章 证照…

    科研百科 2022年12月20日
    209
  • 实验室管理系统招标项目

    实验室管理系统招标项目 随着科技的不断进步,实验室管理也变得越来越复杂。为了提高工作效率和管理水平,许多实验室都在招标寻找一套优秀的实验室管理系统。本文将介绍一个实验室管理系统招标…

    科研百科 2025年1月26日
    1
  • 科研时间多少才够(科研时间多少才够成功)

    作者丨陈辉 做科研花多少时间才够?这原本不是一个值得探讨,更不会给出明确答案的问题。一旦开始关注这个问题,就意味着科研工作的自由可能受到了威胁。这个威胁有可能来自于环境,比如,每天…

    科研百科 2024年4月18日
    101
  • 学校优秀科研项目评选

    学校优秀科研项目评选:探索科技新领域 随着科技的不断发展,学校在科研领域也越来越重视。为了推动学校科研事业的发展,学校每年都会评选出优秀的科研项目。这些项目不仅体现了学校在科研领域…

    科研百科 2025年3月21日
    1
  • 宝马的那些个性化定制,据说知道的人不超过10个(宝马个性化定制在哪弄)

    对于“豪华”一词,在不同时期,不同领域会有迥异的理解,汽车作为移动的“起居室”,它的豪华常与我们对建筑内部设计的审美相一致,不过这种一致也会变化。举例来说,柔软的大沙发、实木家具对…

    科研百科 2024年5月2日
    81
  • 科研项目委托 科研项目委托测试加工需要招投标吗

    科研项目委托测试加工需要招投标吗? 科研项目的委托测试加工是一种重要的项目合作方式,通常涉及到对某种产品或服务进行测试、评估或加工。在进行此类项目时,通常会涉及到多个供应商,因此选…

    科研百科 2024年3月31日
    156
  • 合同管理的app

    合同管理app:实现合同管理的数字化时代 随着数字化时代的到来,合同管理已经成为了一个日益重要的话题。传统的合同管理方式已经无法满足现代商业的需求,因此,一款高效的合同管理app成…

    科研百科 2024年8月26日
    30
  • 苏州项目管理系统品牌

    苏州项目管理系统品牌 苏州是一个历史悠久、文化底蕴深厚的城市,被誉为“东吴故里”。在这个城市里,有许多著名的企业和机构,其中包括苏州的项目管理系统品牌。 苏州项目管理系统品牌是一家…

    科研百科 2024年12月17日
    0
  • 项目管理合同管理的程序(项目管理 合同管理)

    项目管理合同管理项目管理合同管理合同1.项目管理项目管理:本公司主要由项目管理部门任职于项目管理部门,业务管理部门主要负责企业级与企业级对项目管理进行了初步的划分,其中包括具体实施…

    科研百科 2024年9月29日
    23
  • 为什么同一款APP定制开发,有的软件公司报价5万,有报价50万?

    01 最近有粉丝问我:同一款APP定制开发,有的软件公司报价50万,有报价5万的,还有报价5000的,到底是为什么?利润空间这么大吗? 我相信大家在想要定制开发软件,去咨询报价的时…

    科研百科 2023年3月15日
    269