| /ohos5.0/docs/zh-cn/application-dev/reference/apis-arkui/js-service-widget-ui/ |
| H A D | js-service-widget-container-div.md | 26 | flex-direction | string | row | 否 | flex容器主轴方向。可选项有：<br/>- column：垂直方向从上到下。<br/>- row：水…
31 | display | string | flex | 否 | 确定该元素视图框的类型，该值暂不支持动态修改。可选值为：<br/>- flex：弹性布局<br/>- none：不…
52 <div class="flex-box">
64 flex-direction: column;
70 .flex-box {
77 .flex-item {
101 <div class="flex-box">
113 flex-direction: column;
119 .flex-box {
122 flex-wrap: wrap;
[all …]
|
| H A D | js-service-widget-basic-divider.md | 29 | display | string | flex | 否 | 确定分割线所产生的框的类型。值flex/none，默认值flex。 |
32 | flex | number | - | 否 | 规定了分割线如何适应父组件中的可用空间。作为一个简写属性，用来设置组件的flex-grow。<br/>仅父容器为<div>、<l…
33 | flex-grow | number | 0 | 否 | 设置分割线的伸展因子，指定父组件容器主轴方向上剩余空间（容器本身大小减去所有flex项加起来的大小）的分配系数。0为不伸展。<br/>仅…
34 | flex-shrink | number | 1 | 否 | 设置分割线的收缩因子，flex元素仅在默认宽度之和大于容器的时候才会发生收缩，0为不收缩。<br/>仅父容器为<div>…
35 | flex-basis | <length> | - | 否 | 设置分割线在主轴方向上的初始大小。<br/>仅父容器为<div>、<list-item>、&l…
60 flex-direction:column;
72 flex-direction:column;
|
| H A D | js-service-widget-common-atomic-layout.md | 13 在非折行flex布局基础上，增加了显示优先级标记，可以调整组件内元素水平/垂直方向的显示优先级，根据当前组件容器的可用空间来显示内容。
17 | display-index | number | 0 | 适用于div等支持flex布局的容器组件中的子组件上，当容器组件在flex主轴上尺寸不足以显示全部内容时，按照display-in…
22 在非折行的flex布局中，定义了占比能力的组件，保证指定元素始终在容器的某一个比例空间中进行布局。
26 | flex-weight | number | - | 指明当前元素在flex主轴方向上尺寸权值，当且仅当容器组件中所有节点均设置此属性时生效，当前元素尺寸为： 容器主轴尺寸&nb…
35 …为该节点的宽度与高度比，设置该属性后，该元素尺寸宽高比按照此属性值进行调整。<br/> 遵守最大值与最小值的限制。<br/> 在flex布局中，主轴尺寸先进行调整，后根据该尺寸…
|
| /ohos5.0/docs/zh-cn/application-dev/reference/apis-arkui/arkui-js-lite/ |
| H A D | js-lite-components-container-div.md | 38 | flex-direction | string | row | 否 | flex容器主轴方向。可选项有：<br/>- column：垂直方向从上到下<br/>- row：水平…
42 | display | string | flex | 否 | 确定该元素视图框的类型，该值暂不支持动态修改。可选值为：<br/>- flex：弹性布局<br/>- none：不…
64 <div class="flex-box">
76 flex-direction: column;
82 .flex-box {
89 .flex-item {
112 <div class="flex-box">
124 flex-direction: column;
130 .flex-box {
133 flex-wrap: wrap;
[all …]
|
| H A D | js-lite-components-container-list.md | 41 | flex-direction | string | column | 否 | 设置flex容器主轴的方向，指定flex项如何放置在flex容器中，可选值为：<br/>- column：…
53 | display | string | flex | 否 | 确定一个元素所产生的框的类型，可选值为：<br/>- flex：弹性布局。<br/>- none：不渲染此元素。 |
99 display: flex;
114 flex-direction: column;
|
| /ohos5.0/foundation/arkui/ace_engine/frameworks/bridge/declarative_frontend/jsview/models/ |
| H A D | flex_model_impl.cpp | 52 if (flex) { in SetFlexWidth()
53 …if (flex->GetDirection() == FlexDirection::ROW || flex->GetDirection() == FlexDirection::ROW_REVER… in SetFlexWidth()
72 if (flex) { in SetFlexHeight()
73 …if (flex->GetDirection() == FlexDirection::COLUMN || flex->GetDirection() == FlexDirection::COLUMN… in SetFlexHeight()
90 if (flex) { in SetJustifyContent()
104 if (flex) { in SetAlignItems()
136 if (flex) { in SetDirection()
137 flex->SetDirection(direction); in SetDirection()
145 if (flex) { in SetMainAxisAlign()
146 flex->SetMainAxisAlign(flexAlign); in SetMainAxisAlign()
[all …]
|
| /ohos5.0/docs/zh-cn/application-dev/reference/apis-arkui/arkui-js/ |
| H A D | js-components-grid-row.md | 6 grid-row是栅格布局容器grid-container的子容器组件，使用flex横向布局，排列每个grid-col容器，justify-content与align-items默认为flex-st…
29 | flex-wrap | string | nowrap | 否 | flex容器是单行还是多行显示，该值暂不支持动态修改。可选项有：<br/>- nowrap：不换行，单行显示。<br…
30 | justify-content | string | flex-start | 否 | flex容器当前行的主轴对齐格式。可选项有：<br/>- flex-start：项目位于容器的开…
31 …tring | flex-start | 否 | flex容器当前行的交叉轴对齐格式，可选值为：<br/>- stretch：弹性元素被在交叉轴方向被拉伸到与容器相同的高度或宽度。<br…
32 … string | flex-start | 否 | 交叉轴中有额外的空间时，多行内容对齐格式，可选值为：<br/>- flex-start：所有行从交叉轴起点开始填充。第一行的交叉轴起…
|
| H A D | js-components-container-div.md | 90 <div class="flex-box">
101 flex-direction: column;
107 .flex-box {
114 .flex-item {
136 <div class="flex-box">
147 flex-direction: column;
153 .flex-box {
156 flex-wrap: wrap;
161 .flex-item {
257 flex-direction: column;
[all …]
|
| H A D | js-components-basic-divider.md | 40 …play | string | flex | 否 | 确定分割线所产生的框的类型。值flex/none，默认值…
43 | flex | number | - | 否 | 规定了分割线如何适应父组件中的可用空间，用来设置…
44 | flex-grow | number | 0 | 否 | 设置分割线的伸展因子，指定父组件容器主轴方向上剩…
45 | flex-shrink | number | 1 | 否 | 设置分割线的收缩因子，flex元素仅在默认宽度之…
46 | flex-basis | <length> | - | 否 | 设置分割线在主轴方向上的初始大小。<br>仅父容…
74 flex-direction:column;
85 flex-direction:column;
|
| H A D | js-components-grid-col.md | 38 | flex-direction | string | row | 否 | flex容器主轴方向。可选项有：<br/>- …
39 | flex-wrap | string | nowrap | 否 | flex容器是单行还是多行显示，该值暂不支持动态修改。可…
40 … | string | flex-start | 否 | flex容器当前行的主轴对齐格式。可选项有：<br/>- flex-start：项目…
41 …tch | 否 | flex容器当前行的交叉轴对齐格式，可选值为：<br/>- stretch：弹性元素被在交叉轴方向被拉伸到与容器相同的高度或宽度。<br/>- …
42 … | flex-start | 否 | 交叉轴中有额外的空间时，多行内容对齐格式，可选值为：<br/>- flex-start：所有行从交叉轴起点开始填充。第一行的交叉…
43 …ay | string | flex | 否 | 确定该元素视图框的类型，该值暂不支持动态修改。可选值为：<br/>-…
88 flex-direction: column;
|
| H A D | js-components-common-atomic-layout.md | 11 在非折行flex布局基础上，增加了显示优先级标记，可以调整组件内元素水平/垂直方向的显示优先级，根据当前组件容器的可用空间来显示内容。
15 | display-index | number | 适用于div等支持flex布局的容器组件中的子组件，当容器组件在flex主轴上尺寸不足以显示全部内容时，按照display-index值从小到大…
20 在非折行的flex布局中，定义了占比能力的组件，保证指定组件始终在容器的某一个比例空间中进行布局。
24 | flex-weight | number | 指明当前元素在flex主轴方向上尺寸权值。如果容器组件中所有节点均设置此属性，当前元素尺寸为： 容器主轴尺寸 \* 当…
33 …的宽度与高度比，设置该属性后，该元素尺寸宽高比按照此属性值进行调整。<br/>2. 遵守最大值与最小值的限制。<br/>3. 在flex布局中，主轴尺寸先进行调整，后根据该尺寸…
|
| H A D | js-components-grid-container.md | 52 | justify-content | string | flex-start | 否 | flex容器当前行的主轴对齐格式。可选项有：<br/>- flex-start：项目位于容器的开…
53 …| stretch | 否 | flex容器当前行的交叉轴对齐格式，可选值为：<br/>- stretch：弹性元素被在交叉轴方向被拉伸到与容器相同的高度或宽度。<br/>- …
54 … string | flex-start | 否 | 交叉轴中有额外的空间时，多行内容对齐格式，可选值为：<br/>- flex-start：所有行从交叉轴起点开始填充。第一行的交叉轴起…
|
| H A D | js-components-svg-animatetransform.md | 77 flex-direction: column;
79 align-items: flex-start;
84 flex-direction: row;
86 align-items: flex-start;
137 flex-direction: column;
139 align-items: flex-start;
143 flex-direction: row;
145 align-items: flex-start;
209 flex-direction: column;
211 align-items: flex-start;
[all …]
|
| /ohos5.0/foundation/arkui/ace_engine_lite/test/moduletest/common/test_app/access_app_data_test/pages/third/ |
| H A D | index.hml | 21 <list-item class="flex-box">
22 <div class="flex-item color-add" on:click="addBigData">
27 <div class="flex-item color-modify" on:click="addEmptyData">
33 <list-item class="flex-box">
34 <div class="flex-item color-modify" on:click="addChinese">
39 <div class="flex-item color-add" on:click="saveNullData">
45 <list-item class="flex-box">
46 <div class="flex-item color-modify" on:click="saveNotObjectData">
52 <list-item class="flex-box">
53 <div class="flex-item color-modify" on:click="terminateApp">
[all …]
|
| /ohos5.0/docs/en/application-dev/reference/apis-arkui/arkui-js-lite/ |
| H A D | js-lite-components-container-div.md | 64 <div class="flex-box">
65 <div class="flex-item color-primary"></div>
66 <div class="flex-item color-warning"></div>
76 flex-direction: column;
82 .flex-box {
89 .flex-item {
112 <div class="flex-box">
124 flex-direction: column;
130 .flex-box {
133 flex-wrap: wrap;
[all …]
|
| /ohos5.0/docs/en/application-dev/reference/apis-arkui/js-service-widget-ui/ |
| H A D | js-service-widget-container-div.md | 52 <div class="flex-box">
53 <div class="flex-item color-primary"></div>
54 <div class="flex-item color-warning"></div>
64 flex-direction: column;
70 .flex-box {
77 .flex-item {
101 <div class="flex-box">
113 flex-direction: column;
119 .flex-box {
122 flex-wrap: wrap;
[all …]
|
| /ohos5.0/docs/zh-cn/application-dev/ui/ |
| H A D | ui-js-components-input.md | 24 flex-direction: column;
53 <input type="date" class="flex" placeholder="Enter data"></input>
64 flex-direction: column;
69 flex-direction: column;
86 .flex {
129 flex-direction: column;
186 flex-direction: column;
254 <input class="flex" id="input1" placeholder="Enter content" />
278 flex-direction: column;
295 .flex {
[all …]
|
| /ohos5.0/foundation/arkui/ace_engine_lite/test/moduletest/common/test_app/ui_auto_test/src/main/js/default/pages/input/ButtonB30/ |
| H A D | index.css | 27 display: flex;
31 flex-direction: row;
32 flex-wrap: wrap;
33 display: flex;
50 display: flex;
51 flex-direction: row;
52 flex-wrap: wrap;
53 display: flex;
69 display: flex;
|
| /ohos5.0/docs/en/application-dev/reference/apis-arkui/arkui-js/ |
| H A D | js-components-svg-animatetransform.md | 78 flex-direction: column;
80 align-items: flex-start;
85 flex-direction: row;
87 align-items: flex-start;
138 flex-direction: column;
140 align-items: flex-start;
144 flex-direction: row;
146 align-items: flex-start;
210 flex-direction: column;
212 align-items: flex-start;
[all …]
|
| H A D | js-components-grid-row.md | 7 …tainer>**. Each **\<grid-col>** component is arranged horizontally with **flex**-related styles. B…
30 | flex-wrap | string | nowrap | No| Whether items in the flex container are displayed in a single l…
31 …flex-start | No| How items are aligned along the main axis of the flex container. Available values…
32 …flex-start | No| How items are aligned along the cross axis in a flex container. Available values …
33 …flex-start | No| Multi-row alignment mode when there is extra space in the cross axis. Available v…
|
| H A D | js-components-container-div.md | 91 <div class="flex-box">
102 flex-direction: column;
108 .flex-box {
115 .flex-item {
137 <div class="flex-box">
148 flex-direction: column;
154 .flex-box {
157 flex-wrap: wrap;
162 .flex-item {
258 flex-direction: column;
[all …]
|
| /ohos5.0/foundation/arkui/ace_engine_lite/frameworks/examples/showcase/src/main/js/default/pages/component/list/list/list14/ |
| H A D | index.css | 17 display: flex;
18 flex-direction: column;
28 display: flex;
29 flex-direction: row;
39 display: flex;
40 flex-direction: row;
54 flex-direction: column;
63 display: flex;
74 flex-direction: column;
87 flex-direction: column;
[all …]
|
| /ohos5.0/foundation/arkui/ace_engine_lite/frameworks/examples/alarm/src/main/js/default/pages/index/ |
| H A D | index.css | 24 justify-content: flex-start;
36 flex-direction: column;
42 flex-direction: column;
48 flex-direction: column;
49 justify-content: flex-end;
50 align-items: flex-start;
60 flex-direction: column;
|
| /ohos5.0/foundation/ability/form_fwk/test/resource/benchmark/form_test_bundle/src/main/js/widget/pages/index/ |
| H A D | index.css | 2 flex-direction: column;
8 flex-shrink: 0;
13 flex-direction: column;
14 justify-content: flex-end;
15 align-items: flex-start;
|
| /ohos5.0/foundation/ability/ability_runtime/test/resource/benchmark/form_test_bundle/src/main/js/widget/pages/index/ |
| H A D | index.css | 2 flex-direction: column;
8 flex-shrink: 0;
13 flex-direction: column;
14 justify-content: flex-end;
15 align-items: flex-start;
|