香港服务器_cdn带宽_9元

2021-05-03 15:25

您好,

在我之前的博客中,我展示了如何"在Lumira Designer/Design Studio中最大化和最小化面板容器"。在SAP Lumira 2.x中,SAP引入了"组件"和"自适应布局",您可能知道,您需要始终将块的高度设置为固定高度。同事问我:如何在Lumira Designer 2.x中使用自适应布局时最大化和最小化容器。本博客将向您展示以下步骤:

背景:

添加"最小化和最大化"功能在Lumira Designer中不可用(现成);此方法(启用最大化/最小化)是一个"好把戏",因为它使用一个名为:

的面板属性。移动组件(component)

此方法也使用弹出窗口来实现此目标。请注意,此方法不需要创建任何额外的容器(或复制组件-这可能会影响性能)。

只需,我们将把所需的组件从一个容器移到另一个容器中(从原来的容器移到最大化的新容器中)!

请注意,此属性".move component(component)"适用于面板组件(但不适用于所有组件)!通常,面板可以是任何其他容器的容器。所以,如果你想把东西从一个位置移到另一个位置…简单地说,用一个面板容器包装!

以下步骤将向您展示如何将最小化/最大化功能从头添加到仪表板中。如果需要将此仪表板中的功能复制到另一个仪表板中,可以将已创建的组件/功能从现有仪表板复制到新仪表板中。您可能需要修复脚本以引用正确的容器id。

目标是在平铺(面板/容器)中添加新功能,您可以将其最大化和最小化(请参阅屏幕截图)

也适用于自适应布局

1.在应用程序的根目录上,创建一个弹出组件,bi大数据分析,配置如下:

注意弹出组件应该在根目录下创建,剩下的内容(主体)可以在根目录下创建。这是为了防止Lumira的意外行为(一些可点击的按钮不起作用,因为弹出窗口在顶层–即使弹出窗口关闭)!

2.创建一个面板组件(在步骤#1中创建的弹出组件中作为子组件)。

3.创建一个类(在CSS文件中)并将其分配给创建的组件,云服务器和普通服务器,设置如下:

4.创建一个面板组件(在步骤#2中创建的面板组件中作为子组件)。

5.创建一个类(在CSS文件中)将其分配给已创建的组件,大数据前景怎么样,并按如下方式设置:

6.您的组件应如下所示:

请注意,您可以根据需要通过单独配置每个组件来增加或减少填充。您也可以选择较暗的颜色作为应用程序的背景(白色除外),以创建对比度!

根据需要创建自适应布局。对于本演示,我已经使用自适应布局创建了5个不同大小的平铺。您的要求可能不同…但相同的概念可以应用于任何设计/布局。

请注意,物联网是啥,每个块中都创建了一个面板,作为平铺内容的容器。这一点很重要,因为我们将使用此面板容器ID来移动将内容放入其中(还原最大化屏幕时)。

7.创建面板组件(作为块组件中的子组件)并按图所示进行配置。

8.创建一个类(在CSS文件中)并将其分配给创建的组件,并将其设置为:

9.创建面板组件(作为在步骤#7–中创建的面板组件中的子组件)用于平铺的标题容器)并如图所示进行配置。

10.创建一个类(在CSS文件中)并将其分配给已创建的组件,并按如下所示进行设置:

11.创建一个文本组件(作为面板组件中的子组件-在步骤#9中创建)用作标题,并如图所示进行配置。

12.创建类(在CSS文件中)并将其分配给已创建的组件,并按如下所示进行设置:

13.创建一个图标组件(作为面板组件内的子组件–在步骤#9中创建)以用作图标,以最大化标题并按图所示进行配置。

14.创建一个图标组件(作为面板组件内的子组件–已创建)在步骤#9)中,将其用作图标以还原标题并按图示进行配置。

15.创建图表组件(作为面板组件内的子组件–在步骤#7中创建)并按图示进行配置。

请注意,除了图表之外,您还可以有不同类型的组件(例如交叉表、带内容的网格等)

16.重复上述步骤步骤(#7–#15)用于所有瓷砖/块。

17.创建两个函数("onmax"和"onRestore")

18.在下面的步骤中,我们需要捕获/识别用户点击的图标/平铺,以便最大化它。我们可以通过在用户点击最大化图标时传递参数来实现这一点,并调用函数onmax()。

19.对于onmax()函数,创建一个输入参数(例如"panel\u id")作为字符串,然后添加以下代码:

请确保为应用程序引用正确的组件id,以避免任何错误!

20.对于最大化图标(在步骤#13中创建),在单击时添加以下脚本:

分享到:
收藏
相关阅读