mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-08-23 09:01:10 +08:00

* It looks like inline styles are making the flexbox example slow * FlexboxLayout createReorderIndices proper overload * Remove the getLayoutParams * Removed unnecessary reorder methods * Fix tslint errors
88 lines
6.0 KiB
XML
88 lines
6.0 KiB
XML
<Page>
|
|
<ActionBar id="actionbar">
|
|
<Label id="title" text="---" />
|
|
<ActionItem ios.systemIcon="17" android.systemIcon="ic_menu_play_clip" tap="generate" ios.position="right" />
|
|
</ActionBar>
|
|
<TabView id="tabview" selectedIndexChanged="selectionChanged">
|
|
<TabView.items>
|
|
<TabViewItem title="flex-grid">
|
|
<TabViewItem.view>
|
|
<ScrollView>
|
|
<!-- Fix this: style="flex: 1 0; height: 0;"-->
|
|
<Repeater id="repeaterFlexGrid" items="{{ $value }}">
|
|
<Repeater.itemTemplate>
|
|
<FlexboxLayout flexDirection="row" flexWrap="wrap" alignItems="center" borderWidth="0 0 1 0" borderColor="#EEEEEE">
|
|
<Image src="{{ icon }}" flexGrow="0" flexShrink="1" margin="6 4 4 4" borderWidth="1" borderColor="gray" borderRadius="16" width="32" height="32" />
|
|
<Label text="{{ title }}" flexGrow="1" flexShrink="0" width="0" margin="1 4 0 0" />
|
|
<Label text="{{ body }}" textWrap="true" width="100%" margin="4 4 6 4" fontSize="11" />
|
|
<Image src="~/ui-tests-app/flexbox/icons/thumbsdown.png" width="18" height="18" margin="4" />
|
|
<Label text="{{ up }}" flexGrow="1" flexShrink="0" width="0" fontSize="13" />
|
|
<Image src="~/ui-tests-app/flexbox/icons/thumbsup.png" width="18" height="18" margin="4" />
|
|
<Label text="{{ down }}" flexGrow="1" flexShrink="0" width="0" fontSize="13" />
|
|
</FlexboxLayout>
|
|
</Repeater.itemTemplate>
|
|
</Repeater>
|
|
</ScrollView>
|
|
</TabViewItem.view>
|
|
</TabViewItem>
|
|
<TabViewItem title="grid">
|
|
<TabViewItem.view>
|
|
<ScrollView>
|
|
<Repeater id="repeaterGrid" items="{{ $value }}">
|
|
<Repeater.itemTemplate>
|
|
<GridLayout columns="*, *" rows="auto, auto, auto" borderWidth="0 0 1 0" borderColor="#EEEEEE">
|
|
<Image src="{{ icon }}" colSpan="2" horizontalAlignment="left" width="32" height="32" margin="6 4 4 4" borderWidth="1" borderRadius="16" borderColor="16" borderColor="gray" />
|
|
<Label text="{{ title }}" colSpan="2" margin="4 4 0 41" verticalAlignment="center" />
|
|
<Label text="{{ body }}" colSpan="2" row="1" textWrap="true" margin="4 4 6 4" fontSize="11" />
|
|
<Image src="~/thumbsdown.png" row="2" width="18" height="18" margin="4" horizontalAlignment="left" />
|
|
<Label text="{{ up }}" row="2" fontSize="13" margin="0 0 0 26" verticalAlignment="center" />
|
|
<Image src="~/thumbsup.png" row="2" col="1" width="18" height="18" margin="4" horizontalAlignment="left" />
|
|
<Label text="{{ down }}" row="2" col="1" fontSize="13" margin="0 0 0 26" verticalAlignment="center" />
|
|
</GridLayout>
|
|
</Repeater.itemTemplate>
|
|
</Repeater>
|
|
</ScrollView>
|
|
</TabViewItem.view>
|
|
</TabViewItem>
|
|
<TabViewItem title="flex-stack">
|
|
<TabViewItem.view>
|
|
<ScrollView>
|
|
<Repeater id="repeaterFlexStack" items="{{ $value }}">
|
|
<Repeater.itemTemplate>
|
|
<FlexboxLayout flexDirection="column">
|
|
<Image src="{{ icon }}" alignSelf="center" width="32" height="32" margin="4" borderWidth="1" borderRadius="16" borderColor="16" borderColor="gray" />
|
|
<Label text="{{ title }}" margin="4" />
|
|
<Label text="{{ body }}" textWrap="true" margin="4" fontSize="11" />
|
|
<Image src="~/thumbsdown.png" width="18" height="18" margin="4" />
|
|
<Label text="{{ up }}" fontSize="13" alignSelf="center" />
|
|
<Image src="~/thumbsup.png" width="18" height="18" margin="4" />
|
|
<Label text="{{ down }}" fontSize="13" alignSelf="center" />
|
|
</FlexboxLayout>
|
|
</Repeater.itemTemplate>
|
|
</Repeater>
|
|
</ScrollView>
|
|
</TabViewItem.view>
|
|
</TabViewItem>
|
|
<TabViewItem title="stack">
|
|
<TabViewItem.view>
|
|
<ScrollView>
|
|
<Repeater id="repeaterStack" items="{{ $value }}">
|
|
<Repeater.itemTemplate>
|
|
<StackLayout>
|
|
<Image src="{{ icon }}" horizontalAlignment="center" width="32" height="32" margin="4" borderWidth="1" borderRadius="16" borderColor="16" borderColor="gray" />
|
|
<Label text="{{ title }}" margin="4" />
|
|
<Label text="{{ body }}" textWrap="true" margin="4" fontSize="11" />
|
|
<Image src="~/thumbsdown.png" width="18" height="18" margin="4" />
|
|
<Label text="{{ up }}" fontSize="13" horizontalAlignment="center" />
|
|
<Image src="~/thumbsup.png" width="18" height="18" margin="4" />
|
|
<Label text="{{ down }}" fontSize="13" horizontalAlignment="center" />
|
|
</StackLayout>
|
|
</Repeater.itemTemplate>
|
|
</Repeater>
|
|
</ScrollView>
|
|
</TabViewItem.view>
|
|
</TabViewItem>
|
|
</TabView.items>
|
|
</TabView>
|
|
</Page>
|