mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-08-16 11:42:04 +08:00
41 lines
3.7 KiB
XML
41 lines
3.7 KiB
XML
<Page xmlns="http://schemas.nativescript.org/tns.xsd" android:actionBarHidden="true" loaded="onLoaded">
|
|
<GridLayout rows="200, *">
|
|
<FlexboxLayout style="flex-wrap: wrap;" automationText="container">
|
|
|
|
<!--container-->
|
|
<Button text="f" tag="flex-flow: row-reverse wrap-reverse;" tap="flexFlow" automationText="flexFlow" />
|
|
|
|
<!--items-->
|
|
<Button text="o1" tag="#container { flex-wrap: wrap; } #itemRowReverse-0 { order: 0; } #itemRowReverse-1 { order: 2; }" tap="applyStyles" automationText="o1" />
|
|
<Button text="g1" tag="#container { flex-wrap: wrap; } #itemColumnReverse-0 { flex-grow: 1; } #itemColumnReverse-1 { flex-grow: 1; }" tap="applyStyles" automationText="g1" />
|
|
<Button text="s1" tag="#container { flex-wrap: nowrap; } #itemColumnReverse-0 { flex-shrink: 0; } #itemColumnReverse-1 { flex-shrink: 0; }" tap="applyStyles" automationText="s1" />
|
|
<Button text="a1" tag="#container { flex-wrap: nowrap; } .one { align-self: center; }" tap="applyStyles" automationText="a1" />
|
|
|
|
<!--flex-->
|
|
<Button text="f0" tag="#container { flex-wrap: nowrap; } #itemRowReverse-1 { flex: 0 1; } #itemColumn-1 { flex: 0 1; } #itemColumnReverse-1 { flex: 0 1; }" tap="applyStyles" automationText="f0" />
|
|
<Button text="f1" tag="#container { flex-wrap: wrap; } #itemRowReverse-1 { flex: 3; } #itemColumn-1 { flex: 2; } #itemColumnReverse-1 { flex: 1; }" tap="applyStyles" automationText="f1" />
|
|
<Button text="f2" tag="#container { flex-wrap: nowrap; } #itemRowReverse-1 { flex: 3 0; } #itemColumn-1 { flex: 2 0; } #itemColumnReverse-1 { flex: 1 0; }" tap="applyStyles" automationText="f2" />
|
|
|
|
</FlexboxLayout>
|
|
|
|
<FlexboxLayout id="container" row="1">
|
|
<Label text="row" tap="select" backgroundColor="yellow" automationText="itemRow-0" id="itemRow-0" class="zero" margin="10" />
|
|
<Label text="row-reverse" tap="select" backgroundColor="lightgreen" automationText="itemRowReverse-0" id="itemRowReverse-0" class="zero" />
|
|
<Label text="column" tap="select" backgroundColor="lightblue" automationText="itemColumn-0" id="itemColumn-0" class="zero" />
|
|
<Label text="column-reverse" tap="select" backgroundColor="lightsalmon" automationText="itemColumnReverse-0" id="itemColumnReverse-0" class="zero" />
|
|
|
|
<Label text="row" tap="select" backgroundColor="yellow" automationText="itemRow-1" id="itemRow-1" class="one" />
|
|
<Label text="row-reverse" tap="select" backgroundColor="lightgreen" automationText="itemRowReverse-1" id="itemRowReverse-1" class="one" />
|
|
<Label text="column" tap="select" backgroundColor="lightblue" automationText="itemColumn-1" id="itemColumn-1" class="one" />
|
|
<Label text="column-reverse" tap="select" backgroundColor="lightsalmon" automationText="itemColumnReverse-1" id="itemColumnReverse-1" class="one" />
|
|
|
|
<!--
|
|
<Label text="row" tap="select" backgroundColor="yellow" automationText="itemRow-2" id="itemRow-2" class="two" />
|
|
<Label text="row-reverse" tap="select" backgroundColor="lightgreen" automationText="itemRowReverse-2" id="itemRowReverse-2" class="two" />
|
|
<Label text="column" tap="select" backgroundColor="lightblue" automationText="itemColumn-2" id="itemColumn-2" class="two" />
|
|
<Label text="column-reverse" tap="select" backgroundColor="lightsalmon" automationText="itemColumnReverse-2" id="itemColumnReverse-2" class="two" />
|
|
-->
|
|
|
|
</FlexboxLayout>
|
|
</GridLayout>
|
|
</Page> |