@openui5/sap.ui.layout 1.105.1 → 1.107.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.reuse/dep5 +20 -17
- package/THIRDPARTY.txt +31 -21
- package/package.json +2 -2
- package/src/sap/ui/layout/.library +1 -1
- package/src/sap/ui/layout/AlignedFlowLayout.js +4 -3
- package/src/sap/ui/layout/AssociativeSplitter.js +1 -1
- package/src/sap/ui/layout/BlockLayout.js +29 -26
- package/src/sap/ui/layout/BlockLayoutCell.js +4 -3
- package/src/sap/ui/layout/BlockLayoutCellData.js +1 -2
- package/src/sap/ui/layout/BlockLayoutRow.js +4 -3
- package/src/sap/ui/layout/DynamicSideContent.js +84 -80
- package/src/sap/ui/layout/DynamicSideContentRenderer.js +3 -3
- package/src/sap/ui/layout/FixFlex.js +9 -7
- package/src/sap/ui/layout/Grid.js +74 -71
- package/src/sap/ui/layout/GridData.js +1 -2
- package/src/sap/ui/layout/GridRenderer.js +1 -1
- package/src/sap/ui/layout/HorizontalLayout.js +22 -19
- package/src/sap/ui/layout/PaneContainer.js +1 -1
- package/src/sap/ui/layout/ResponsiveFlowLayout.js +35 -30
- package/src/sap/ui/layout/ResponsiveFlowLayoutData.js +1 -2
- package/src/sap/ui/layout/ResponsiveSplitter.js +1 -1
- package/src/sap/ui/layout/ResponsiveSplitterPage.js +1 -1
- package/src/sap/ui/layout/SplitPane.js +1 -1
- package/src/sap/ui/layout/Splitter.js +6 -5
- package/src/sap/ui/layout/SplitterLayoutData.js +1 -2
- package/src/sap/ui/layout/VerticalLayout.js +29 -26
- package/src/sap/ui/layout/changeHandler/AddFormContainer.js +1 -1
- package/src/sap/ui/layout/changeHandler/AddFormField.js +1 -1
- package/src/sap/ui/layout/changeHandler/AddSimpleFormField.js +10 -3
- package/src/sap/ui/layout/changeHandler/AddSimpleFormGroup.js +11 -5
- package/src/sap/ui/layout/changeHandler/HideSimpleForm.js +3 -2
- package/src/sap/ui/layout/changeHandler/MoveSimpleForm.js +14 -17
- package/src/sap/ui/layout/changeHandler/RenameFormContainer.js +1 -1
- package/src/sap/ui/layout/changeHandler/RenameSimpleForm.js +6 -4
- package/src/sap/ui/layout/changeHandler/UnhideSimpleForm.js +3 -2
- package/src/sap/ui/layout/cssgrid/CSSGrid.js +1 -2
- package/src/sap/ui/layout/cssgrid/GridBasicLayout.js +1 -2
- package/src/sap/ui/layout/cssgrid/GridBoxLayout.js +1 -2
- package/src/sap/ui/layout/cssgrid/GridItemLayoutData.js +1 -2
- package/src/sap/ui/layout/cssgrid/GridLayoutBase.js +1 -2
- package/src/sap/ui/layout/cssgrid/GridLayoutDelegate.js +1 -1
- package/src/sap/ui/layout/cssgrid/GridResponsiveLayout.js +1 -2
- package/src/sap/ui/layout/cssgrid/GridSettings.js +1 -2
- package/src/sap/ui/layout/cssgrid/ResponsiveColumnItemLayoutData.js +1 -2
- package/src/sap/ui/layout/cssgrid/ResponsiveColumnLayout.js +1 -2
- package/src/sap/ui/layout/form/ColumnContainerData.js +1 -2
- package/src/sap/ui/layout/form/ColumnElementData.js +1 -2
- package/src/sap/ui/layout/form/ColumnLayout.js +41 -38
- package/src/sap/ui/layout/form/Form.js +78 -75
- package/src/sap/ui/layout/form/FormContainer.js +1 -2
- package/src/sap/ui/layout/form/FormElement.js +1 -3
- package/src/sap/ui/layout/form/FormLayout.js +22 -18
- package/src/sap/ui/layout/form/GridContainerData.js +1 -2
- package/src/sap/ui/layout/form/GridElementData.js +1 -2
- package/src/sap/ui/layout/form/GridLayout.js +19 -16
- package/src/sap/ui/layout/form/ResponsiveGridLayout.js +138 -135
- package/src/sap/ui/layout/form/ResponsiveLayout.js +15 -12
- package/src/sap/ui/layout/form/SemanticFormElement.js +1 -2
- package/src/sap/ui/layout/form/SimpleForm.js +437 -404
- package/src/sap/ui/layout/library.js +2 -25
- package/src/sap/ui/layout/rules/Form.support.js +32 -32
|
@@ -26,13 +26,12 @@ sap.ui.define([
|
|
|
26
26
|
* @extends sap.ui.core.Element
|
|
27
27
|
*
|
|
28
28
|
* @author SAP SE
|
|
29
|
-
* @version 1.
|
|
29
|
+
* @version 1.107.0
|
|
30
30
|
*
|
|
31
31
|
* @constructor
|
|
32
32
|
* @public
|
|
33
33
|
* @since 1.16.0
|
|
34
34
|
* @alias sap.ui.layout.form.FormElement
|
|
35
|
-
* @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
|
|
36
35
|
*/
|
|
37
36
|
var FormElement = Element.extend("sap.ui.layout.form.FormElement", /** @lends sap.ui.layout.form.FormElement.prototype */ { metadata : {
|
|
38
37
|
|
|
@@ -209,7 +208,6 @@ sap.ui.define([
|
|
|
209
208
|
*
|
|
210
209
|
* @returns {sap.ui.core.Label} <code>Label</code> control used to render the label
|
|
211
210
|
* @public
|
|
212
|
-
* @ui5-metamodel This method also will be described in the UI5 (legacy) designtime metamodel
|
|
213
211
|
*/
|
|
214
212
|
FormElement.prototype.getLabelControl = function() {
|
|
215
213
|
|
|
@@ -11,11 +11,12 @@ sap.ui.define([
|
|
|
11
11
|
'./FormLayoutRenderer',
|
|
12
12
|
'sap/ui/core/theming/Parameters',
|
|
13
13
|
'sap/ui/thirdparty/jquery',
|
|
14
|
+
"sap/ui/core/Configuration",
|
|
14
15
|
// jQuery custom selectors ":sapFocusable"
|
|
15
16
|
'sap/ui/dom/jquery/Selectors',
|
|
16
17
|
// jQuery Plugin "control"
|
|
17
18
|
'sap/ui/dom/jquery/control'
|
|
18
|
-
], function(Control, library, FormLayoutRenderer, Parameters, jQuery) {
|
|
19
|
+
], function(Control, library, FormLayoutRenderer, Parameters, jQuery, Configuration) {
|
|
19
20
|
"use strict";
|
|
20
21
|
|
|
21
22
|
// shortcut for sap.ui.layout.BackgroundDesign
|
|
@@ -36,28 +37,31 @@ sap.ui.define([
|
|
|
36
37
|
* @extends sap.ui.core.Control
|
|
37
38
|
*
|
|
38
39
|
* @author SAP SE
|
|
39
|
-
* @version 1.
|
|
40
|
+
* @version 1.107.0
|
|
40
41
|
*
|
|
41
42
|
* @constructor
|
|
42
43
|
* @public
|
|
43
44
|
* @since 1.16.0
|
|
44
45
|
* @alias sap.ui.layout.form.FormLayout
|
|
45
|
-
* @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
|
|
46
46
|
*/
|
|
47
|
-
var FormLayout = Control.extend("sap.ui.layout.form.FormLayout", /** @lends sap.ui.layout.form.FormLayout.prototype */ {
|
|
47
|
+
var FormLayout = Control.extend("sap.ui.layout.form.FormLayout", /** @lends sap.ui.layout.form.FormLayout.prototype */ {
|
|
48
|
+
metadata : {
|
|
48
49
|
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
50
|
+
library : "sap.ui.layout",
|
|
51
|
+
properties : {
|
|
52
|
+
/**
|
|
53
|
+
* Specifies the background color of the <code>Form</code> content.
|
|
54
|
+
*
|
|
55
|
+
* <b>Note:</b> The visualization of the different options depends on the theme used.
|
|
56
|
+
*
|
|
57
|
+
* @since 1.36.0
|
|
58
|
+
*/
|
|
59
|
+
backgroundDesign : {type : "sap.ui.layout.BackgroundDesign", group : "Appearance", defaultValue : BackgroundDesign.Translucent}
|
|
60
|
+
}
|
|
61
|
+
},
|
|
62
|
+
|
|
63
|
+
renderer: FormLayoutRenderer
|
|
64
|
+
});
|
|
61
65
|
|
|
62
66
|
/* eslint-disable no-lonely-if */
|
|
63
67
|
|
|
@@ -143,7 +147,7 @@ sap.ui.define([
|
|
|
143
147
|
FormLayout.prototype.onsapright = function(oEvent){
|
|
144
148
|
|
|
145
149
|
if (library.form.FormHelper.bArrowKeySupport) {
|
|
146
|
-
var bRtl =
|
|
150
|
+
var bRtl = Configuration.getRTL();
|
|
147
151
|
|
|
148
152
|
if (!bRtl) {
|
|
149
153
|
this.navigateForward(oEvent);
|
|
@@ -157,7 +161,7 @@ sap.ui.define([
|
|
|
157
161
|
FormLayout.prototype.onsapleft = function(oEvent){
|
|
158
162
|
|
|
159
163
|
if (library.form.FormHelper.bArrowKeySupport) {
|
|
160
|
-
var bRtl =
|
|
164
|
+
var bRtl = Configuration.getRTL();
|
|
161
165
|
|
|
162
166
|
if (!bRtl) {
|
|
163
167
|
this.navigateBack(oEvent);
|
|
@@ -22,13 +22,12 @@ sap.ui.define([
|
|
|
22
22
|
* @extends sap.ui.core.LayoutData
|
|
23
23
|
*
|
|
24
24
|
* @author SAP SE
|
|
25
|
-
* @version 1.
|
|
25
|
+
* @version 1.107.0
|
|
26
26
|
*
|
|
27
27
|
* @constructor
|
|
28
28
|
* @public
|
|
29
29
|
* @since 1.16.0
|
|
30
30
|
* @alias sap.ui.layout.form.GridContainerData
|
|
31
|
-
* @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
|
|
32
31
|
*/
|
|
33
32
|
var GridContainerData = LayoutData.extend("sap.ui.layout.form.GridContainerData", /** @lends sap.ui.layout.form.GridContainerData.prototype */ { metadata : {
|
|
34
33
|
|
|
@@ -22,13 +22,12 @@ sap.ui.define([
|
|
|
22
22
|
* @extends sap.ui.core.LayoutData
|
|
23
23
|
*
|
|
24
24
|
* @author SAP SE
|
|
25
|
-
* @version 1.
|
|
25
|
+
* @version 1.107.0
|
|
26
26
|
*
|
|
27
27
|
* @constructor
|
|
28
28
|
* @public
|
|
29
29
|
* @since 1.16.0
|
|
30
30
|
* @alias sap.ui.layout.form.GridElementData
|
|
31
|
-
* @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
|
|
32
31
|
*/
|
|
33
32
|
var GridElementData = LayoutData.extend("sap.ui.layout.form.GridElementData", /** @lends sap.ui.layout.form.GridElementData.prototype */ { metadata : {
|
|
34
33
|
|
|
@@ -28,7 +28,7 @@ sap.ui.define(['sap/ui/layout/library', './FormLayout', './GridLayoutRenderer'],
|
|
|
28
28
|
* @extends sap.ui.layout.form.FormLayout
|
|
29
29
|
*
|
|
30
30
|
* @author SAP SE
|
|
31
|
-
* @version 1.
|
|
31
|
+
* @version 1.107.0
|
|
32
32
|
*
|
|
33
33
|
* @constructor
|
|
34
34
|
* @public
|
|
@@ -37,22 +37,25 @@ sap.ui.define(['sap/ui/layout/library', './FormLayout', './GridLayoutRenderer'],
|
|
|
37
37
|
* as <code>sap.ui.commons</code> library is deprecated and the <code>GridLayout</code> must not be used in responsive applications.
|
|
38
38
|
* Please use <code>ResponsiveGridLayout</code> or <code>ColumnLayout</code> instead.
|
|
39
39
|
* @alias sap.ui.layout.form.GridLayout
|
|
40
|
-
* @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
|
|
41
40
|
*/
|
|
42
|
-
var GridLayout = FormLayout.extend("sap.ui.layout.form.GridLayout", /** @lends sap.ui.layout.form.GridLayout.prototype */ {
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
41
|
+
var GridLayout = FormLayout.extend("sap.ui.layout.form.GridLayout", /** @lends sap.ui.layout.form.GridLayout.prototype */ {
|
|
42
|
+
metadata : {
|
|
43
|
+
|
|
44
|
+
library : "sap.ui.layout",
|
|
45
|
+
deprecated: true,
|
|
46
|
+
properties : {
|
|
47
|
+
|
|
48
|
+
/**
|
|
49
|
+
* If set, the grid renders only one <code>FormContainer</code> per column. That means one <code>FormContainer</code> is below the other. The whole grid has 8 cells per row.
|
|
50
|
+
*
|
|
51
|
+
* If not set, <code>FormContainer</code> can use the full width of the grid or two <code>FormContainers</code> can be placed beside each other. In this case the whole grid has 16 cells per row.
|
|
52
|
+
*/
|
|
53
|
+
singleColumn : {type : "boolean", group : "Misc", defaultValue : false}
|
|
54
|
+
}
|
|
55
|
+
},
|
|
56
|
+
|
|
57
|
+
renderer: GridLayoutRenderer
|
|
58
|
+
});
|
|
56
59
|
|
|
57
60
|
GridLayout.prototype.toggleContainerExpanded = function(oContainer){
|
|
58
61
|
|
|
@@ -53,140 +53,143 @@ sap.ui.define([
|
|
|
53
53
|
*
|
|
54
54
|
* This control cannot be used stand-alone, it just renders a <code>Form</code>, so it must be assigned to a <code>Form</code> using the <code>layout</code> aggregation.
|
|
55
55
|
* @extends sap.ui.layout.form.FormLayout
|
|
56
|
-
* @version 1.
|
|
56
|
+
* @version 1.107.0
|
|
57
57
|
*
|
|
58
58
|
* @constructor
|
|
59
59
|
* @public
|
|
60
60
|
* @since 1.16.0
|
|
61
61
|
* @alias sap.ui.layout.form.ResponsiveGridLayout
|
|
62
|
-
* @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
|
|
63
62
|
*/
|
|
64
|
-
var ResponsiveGridLayout = FormLayout.extend("sap.ui.layout.form.ResponsiveGridLayout", /** @lends sap.ui.layout.form.ResponsiveGridLayout.prototype */ {
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
63
|
+
var ResponsiveGridLayout = FormLayout.extend("sap.ui.layout.form.ResponsiveGridLayout", /** @lends sap.ui.layout.form.ResponsiveGridLayout.prototype */ {
|
|
64
|
+
metadata : {
|
|
65
|
+
|
|
66
|
+
library : "sap.ui.layout",
|
|
67
|
+
properties : {
|
|
68
|
+
|
|
69
|
+
/**
|
|
70
|
+
* Default span for labels in extra large size.
|
|
71
|
+
*
|
|
72
|
+
* <b>Note:</b> If the default value -1 is not overwritten with the meaningful one then the <code>labelSpanL</code> value is used.
|
|
73
|
+
* @since 1.34.0
|
|
74
|
+
*/
|
|
75
|
+
labelSpanXL : {type : "int", group : "Misc", defaultValue : -1},
|
|
76
|
+
|
|
77
|
+
/**
|
|
78
|
+
* Default span for labels in large size.
|
|
79
|
+
*
|
|
80
|
+
* <b>Note:</b> If <code>adjustLabelSpan</code> is set, this property is only used if more than 1 <code>FormContainer</code> is in one line. If only 1 <code>FormContainer</code> is in the line, then the <code>labelSpanM</code> value is used.
|
|
81
|
+
* @since 1.16.3
|
|
82
|
+
*/
|
|
83
|
+
labelSpanL : {type : "int", group : "Misc", defaultValue : 4},
|
|
84
|
+
|
|
85
|
+
/**
|
|
86
|
+
* Default span for labels in medium size.
|
|
87
|
+
*
|
|
88
|
+
* <b>Note:</b> If <code>adjustLabelSpan</code> is set this property is used for full-size <code>FormContainers</code>. If more than one <code>FormContainer</code> is in one line, <code>labelSpanL</code> is used.
|
|
89
|
+
* @since 1.16.3
|
|
90
|
+
*/
|
|
91
|
+
labelSpanM : {type : "int", group : "Misc", defaultValue : 2},
|
|
92
|
+
|
|
93
|
+
/**
|
|
94
|
+
* Default span for labels in small size.
|
|
95
|
+
* @since 1.16.3
|
|
96
|
+
*/
|
|
97
|
+
labelSpanS : {type : "int", group : "Misc", defaultValue : 12},
|
|
98
|
+
|
|
99
|
+
/**
|
|
100
|
+
* If set, the usage of <code>labelSpanL</code> and <code>labelSpanM</code> are dependent on the number of <code>FormContainers</code> in one row.
|
|
101
|
+
* If only one <code>FormContainer</code> is displayed in one row, <code>labelSpanM</code> is used to define the size of the label.
|
|
102
|
+
* This is the same for medium and large <code>Forms</code>.
|
|
103
|
+
* This is done to align the labels on forms where full-size <code>FormContainers</code> and multiple-column rows are used in the same <code>Form</code>
|
|
104
|
+
* (because every <code>FormContainer</code> has its own <code>Grid</code> inside).
|
|
105
|
+
*
|
|
106
|
+
* If not set, the usage of <code>labelSpanL</code> and <code>labelSpanM</code> are dependent on the <code>Form</code> size.
|
|
107
|
+
* The number of <code>FormContainers</code> doesn't matter in this case.
|
|
108
|
+
* @since 1.34.0
|
|
109
|
+
*/
|
|
110
|
+
adjustLabelSpan : {type : "boolean", group : "Misc", defaultValue : true},
|
|
111
|
+
|
|
112
|
+
/**
|
|
113
|
+
* Number of grid cells that are empty at the end of each line on extra large size.
|
|
114
|
+
*
|
|
115
|
+
* <b>Note:</b> If the default value -1 is not overwritten with the meaningful one then the <code>emptySpanL</code> value is used.
|
|
116
|
+
* @since 1.34.0
|
|
117
|
+
*/
|
|
118
|
+
emptySpanXL : {type : "int", group : "Misc", defaultValue : -1},
|
|
119
|
+
|
|
120
|
+
/**
|
|
121
|
+
* Number of grid cells that are empty at the end of each line on large size.
|
|
122
|
+
* @since 1.16.3
|
|
123
|
+
*/
|
|
124
|
+
emptySpanL : {type : "int", group : "Misc", defaultValue : 0},
|
|
125
|
+
|
|
126
|
+
/**
|
|
127
|
+
* Number of grid cells that are empty at the end of each line on medium size.
|
|
128
|
+
* @since 1.16.3
|
|
129
|
+
*/
|
|
130
|
+
emptySpanM : {type : "int", group : "Misc", defaultValue : 0},
|
|
131
|
+
|
|
132
|
+
/**
|
|
133
|
+
* Number of grid cells that are empty at the end of each line on small size.
|
|
134
|
+
* @since 1.16.3
|
|
135
|
+
*/
|
|
136
|
+
emptySpanS : {type : "int", group : "Misc", defaultValue : 0},
|
|
137
|
+
|
|
138
|
+
/**
|
|
139
|
+
* Number of columns for extra large size.
|
|
140
|
+
*
|
|
141
|
+
* The number of columns for extra large size must not be smaller than the number of columns for large size.
|
|
142
|
+
* <b>Note:</b> If the default value -1 is not overwritten with the meaningful one then the <code>columnsL</code> value is used (from the backward compatibility reasons).
|
|
143
|
+
* @since 1.34.0
|
|
144
|
+
*/
|
|
145
|
+
columnsXL : {type : "int", group : "Misc", defaultValue : -1},
|
|
146
|
+
|
|
147
|
+
/**
|
|
148
|
+
* Number of columns for large size.
|
|
149
|
+
*
|
|
150
|
+
* The number of columns for large size must not be smaller than the number of columns for medium size.
|
|
151
|
+
* @since 1.16.3
|
|
152
|
+
*/
|
|
153
|
+
columnsL : {type : "int", group : "Misc", defaultValue : 2},
|
|
154
|
+
|
|
155
|
+
/**
|
|
156
|
+
* Number of columns for medium size.
|
|
157
|
+
* @since 1.16.3
|
|
158
|
+
*/
|
|
159
|
+
columnsM : {type : "int", group : "Misc", defaultValue : 1},
|
|
160
|
+
|
|
161
|
+
/**
|
|
162
|
+
* If the <code>Form</code> contains only one single <code>FormContainer</code> and this property is set,
|
|
163
|
+
* the <code>FormContainer</code> is displayed using the full size of the <code>Form</code>.
|
|
164
|
+
* In this case the properties <code>columnsXL</code>, <code>columnsL</code> and <code>columnsM</code> are ignored.
|
|
165
|
+
*
|
|
166
|
+
* In all other cases the <code>FormContainer</code> is displayed in the size of one column.
|
|
167
|
+
* @since 1.34.0
|
|
168
|
+
*/
|
|
169
|
+
singleContainerFullSize : {type : "boolean", group : "Misc", defaultValue : true},
|
|
170
|
+
|
|
171
|
+
/**
|
|
172
|
+
* Breakpoint (in pixel) between large size and extra large (XL) size.
|
|
173
|
+
* @since 1.34.0
|
|
174
|
+
*/
|
|
175
|
+
breakpointXL : {type : "int", group : "Misc", defaultValue : 1440},
|
|
176
|
+
|
|
177
|
+
/**
|
|
178
|
+
* Breakpoint (in pixel) between Medium size and Large size.
|
|
179
|
+
* @since 1.16.3
|
|
180
|
+
*/
|
|
181
|
+
breakpointL : {type : "int", group : "Misc", defaultValue : 1024},
|
|
182
|
+
|
|
183
|
+
/**
|
|
184
|
+
* Breakpoint (in pixel) between Small size and Medium size.
|
|
185
|
+
* @since 1.16.3
|
|
186
|
+
*/
|
|
187
|
+
breakpointM : {type : "int", group : "Misc", defaultValue : 600}
|
|
188
|
+
}
|
|
189
|
+
},
|
|
190
|
+
|
|
191
|
+
renderer: ResponsiveGridLayoutRenderer
|
|
192
|
+
});
|
|
190
193
|
|
|
191
194
|
/*
|
|
192
195
|
* The ResponsiveGridLayout uses Grid controls to render the Form
|
|
@@ -1197,7 +1200,7 @@ sap.ui.define([
|
|
|
1197
1200
|
var oContainer;
|
|
1198
1201
|
var sContainerId;
|
|
1199
1202
|
var iLength = aVisibleContainers.length;
|
|
1200
|
-
var
|
|
1203
|
+
var iContentLength = 0;
|
|
1201
1204
|
var i = 0;
|
|
1202
1205
|
var j = 0;
|
|
1203
1206
|
|
|
@@ -1240,10 +1243,10 @@ sap.ui.define([
|
|
|
1240
1243
|
this._mainGrid.setDefaultSpan(sDefaultSpan);
|
|
1241
1244
|
// update containers
|
|
1242
1245
|
var aLayoutContent = this._mainGrid.getContent();
|
|
1243
|
-
|
|
1246
|
+
iContentLength = aLayoutContent.length;
|
|
1244
1247
|
var bExchangeContent = false;
|
|
1245
1248
|
// check if content has changed
|
|
1246
|
-
for ( i = 0; i <
|
|
1249
|
+
for ( i = 0; i < iContentLength; i++) {
|
|
1247
1250
|
var oContentElement = aLayoutContent[i];
|
|
1248
1251
|
oContainer = undefined;
|
|
1249
1252
|
if (oContentElement.getContainer) {
|
|
@@ -1281,7 +1284,7 @@ sap.ui.define([
|
|
|
1281
1284
|
if (bExchangeContent) {
|
|
1282
1285
|
// remove all content and add it new.
|
|
1283
1286
|
this._mainGrid.removeAllContent();
|
|
1284
|
-
|
|
1287
|
+
iContentLength = 0;
|
|
1285
1288
|
}
|
|
1286
1289
|
}
|
|
1287
1290
|
this._mainGrid._setBreakPointTablet(this.getBreakpointM());
|
|
@@ -1289,11 +1292,11 @@ sap.ui.define([
|
|
|
1289
1292
|
this._mainGrid._setBreakPointLargeDesktop(this.getBreakpointXL());
|
|
1290
1293
|
this._mainGrid.__bIsUsed = true;
|
|
1291
1294
|
|
|
1292
|
-
if (
|
|
1295
|
+
if (iContentLength < iLength) {
|
|
1293
1296
|
// new containers added
|
|
1294
1297
|
var iStartIndex = 0;
|
|
1295
|
-
if (
|
|
1296
|
-
iStartIndex =
|
|
1298
|
+
if (iContentLength > 0) {
|
|
1299
|
+
iStartIndex = iContentLength--;
|
|
1297
1300
|
}
|
|
1298
1301
|
for ( i = iStartIndex; i < iLength; i++) {
|
|
1299
1302
|
oContainer = aVisibleContainers[i];
|
|
@@ -50,19 +50,22 @@ sap.ui.define([
|
|
|
50
50
|
* @extends sap.ui.layout.form.FormLayout
|
|
51
51
|
*
|
|
52
52
|
* @author SAP SE
|
|
53
|
-
* @version 1.
|
|
53
|
+
* @version 1.107.0
|
|
54
54
|
*
|
|
55
55
|
* @constructor
|
|
56
56
|
* @public
|
|
57
57
|
* @since 1.16.0
|
|
58
58
|
* @deprecated As of version 1.93, replaced by {@link sap.ui.layout.form.ColumnLayout ColumnLayout}
|
|
59
59
|
* @alias sap.ui.layout.form.ResponsiveLayout
|
|
60
|
-
* @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
|
|
61
60
|
*/
|
|
62
|
-
var ResponsiveLayout = FormLayout.extend("sap.ui.layout.form.ResponsiveLayout", /** @lends sap.ui.layout.form.ResponsiveLayout.prototype */ {
|
|
61
|
+
var ResponsiveLayout = FormLayout.extend("sap.ui.layout.form.ResponsiveLayout", /** @lends sap.ui.layout.form.ResponsiveLayout.prototype */ {
|
|
62
|
+
metadata : {
|
|
63
|
+
|
|
64
|
+
library : "sap.ui.layout"
|
|
65
|
+
},
|
|
63
66
|
|
|
64
|
-
|
|
65
|
-
}
|
|
67
|
+
renderer: ResponsiveLayoutRenderer
|
|
68
|
+
});
|
|
66
69
|
|
|
67
70
|
/*
|
|
68
71
|
* The ResponsiveLayout for forms inside is using ResponsiveFlowLayouts to render the form.
|
|
@@ -812,7 +815,7 @@ sap.ui.define([
|
|
|
812
815
|
var aVisibleContainers = oForm.getVisibleFormContainers();
|
|
813
816
|
var oContainer;
|
|
814
817
|
var iLength = aVisibleContainers.length;
|
|
815
|
-
var
|
|
818
|
+
var iContentLength = 0;
|
|
816
819
|
var i = 0;
|
|
817
820
|
var j = 0;
|
|
818
821
|
|
|
@@ -823,10 +826,10 @@ sap.ui.define([
|
|
|
823
826
|
} else {
|
|
824
827
|
// update containers
|
|
825
828
|
var aLayoutContent = this._mainRFLayout.getContent();
|
|
826
|
-
|
|
829
|
+
iContentLength = aLayoutContent.length;
|
|
827
830
|
var bExchangeContent = false;
|
|
828
831
|
// check if content has changed
|
|
829
|
-
for ( i = 0; i <
|
|
832
|
+
for ( i = 0; i < iContentLength; i++) {
|
|
830
833
|
var oContentElement = aLayoutContent[i];
|
|
831
834
|
oContainer = undefined;
|
|
832
835
|
if (oContentElement.getContainer) {
|
|
@@ -864,14 +867,14 @@ sap.ui.define([
|
|
|
864
867
|
if (bExchangeContent) {
|
|
865
868
|
// remove all content and add it new.
|
|
866
869
|
this._mainRFLayout.removeAllContent();
|
|
867
|
-
|
|
870
|
+
iContentLength = 0;
|
|
868
871
|
}
|
|
869
872
|
}
|
|
870
|
-
if (
|
|
873
|
+
if (iContentLength < iLength) {
|
|
871
874
|
// new containers added
|
|
872
875
|
var iStartIndex = 0;
|
|
873
|
-
if (
|
|
874
|
-
iStartIndex =
|
|
876
|
+
if (iContentLength > 0) {
|
|
877
|
+
iStartIndex = iContentLength--;
|
|
875
878
|
}
|
|
876
879
|
for ( i = iStartIndex; i < iLength; i++) {
|
|
877
880
|
oContainer = aVisibleContainers[i];
|
|
@@ -30,14 +30,13 @@ sap.ui.define([
|
|
|
30
30
|
* @extends sap.ui.layout.form.FormElement
|
|
31
31
|
*
|
|
32
32
|
* @author SAP SE
|
|
33
|
-
* @version 1.
|
|
33
|
+
* @version 1.107.0
|
|
34
34
|
*
|
|
35
35
|
* @constructor
|
|
36
36
|
* @public
|
|
37
37
|
* @experimental As of version 1.86
|
|
38
38
|
* @since 1.86.0
|
|
39
39
|
* @alias sap.ui.layout.form.SemanticFormElement
|
|
40
|
-
* @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
|
|
41
40
|
*/
|
|
42
41
|
var SemanticFormElement = FormElement.extend("sap.ui.layout.form.SemanticFormElement", /** @lends sap.ui.layout.form.SemanticFormElement.prototype */ { metadata : {
|
|
43
42
|
|