Files
NativeScript/apps/app/ui-tests-app/flexbox/flexbox-perf-comparison.xml
Panayot Cankov 56cd220c17 FlexboxLayout profiling and improvements (#3173)
* 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
2016-11-30 11:30:02 +02:00

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>