美文网首页
SAP UI5 SimpleForm 里在水平方向显示多组 Fo

SAP UI5 SimpleForm 里在水平方向显示多组 Fo

作者: _扫地僧_ | 来源:发表于2022-09-30 12:48 被阅读0次

    本教程前几个步骤,介绍了如何在 SAP UI5 SimpleForm 控件里显示单组的元素,如下图所示:

    并且我们花费了整整 4 个步骤的篇幅,重点讲解了 SAP UI5 屏幕宽度类型检测的实现原理,以及 columns 和 labelSpan 系列属性的工作原理。

    相信几乎所有学习者在跟着本教程的步骤做练习时,使用的都是笔记本电脑或者台式机,根据笔者步骤 135 的介绍,在这些环境下,SAP UI5 调用函数 Device.media.getCurrentRange 返回的屏幕类型,在 Range Set StdExt 里的记录为 Desktop

    我们把水平方向上从左到右显示的一个 Label 控件和一个与之匹配的 Text 控件,看作一组 Form 元素

    在 Desktop 这种宽屏下,如果水平方向上一行只显示一组 Form 元素,未免有点浪费屏幕空间了。

    本步骤我们介绍一种方式,可以使用 SimpleForm 的 ResponsiveGridLayout(响应式网格布局),把 SimpleForm 占据的屏幕宽度平均分为三个网格,每个网格内显示一组 Form 元素,如下图所示:

    然后我们进入 Chrome 开发者工具,点击下图图标1 所示的设备模拟的按钮,然后从图例2的模拟设备列表里,选择 iPAD Air,然后响应式网格布局里的网格个数自动从 3 个变为了 2个,如下图所示:

    下面是这个响应式效果的具体的实现步骤。

    相关文章

      网友评论

          本文标题:SAP UI5 SimpleForm 里在水平方向显示多组 Fo

          本文链接:https://www.haomeiwen.com/subject/znvlartx.html