NativeScript Scroll ListView with Title - nativescript

Question

I have this code in main-page.xml:
<GridLayout rows="auto, *">
<Label text="Title" class="title" row="0" />
<ListView id="listView" items="{{ listItems }}" row="1">
<ListView.itemTemplate>
<StackLayout>
<Button text="{{ name }}" tap="dd" />
</StackLayout>
</ListView.itemTemplate>
</ListView>
</GridLayout>
When I scroll the title stick to the top (stay and don't move), is there is a way to make it behave normally ?

Answer 1

I found a cleaner solution using : https://docs.nativescript.org/cookbook/ui/repeater
<ScrollView>
<StackLayout>
<Label text="Title" class="title" />
<Repeater id="listItems" items="{{ listItems }}">
<Repeater.itemTemplate>
<StackLayout>
<Button text="{{ name }}" tap="loadGuide" />
</StackLayout>
</Repeater.itemTemplate>
</Repeater>
</StackLayout>

Answer 2

This is definitely the expected behavior when placing a Label at a row of a GridLayout which is set to auto. What you want to achieve can be done but will require additional implementations for example like this (No boring ActionBar) third party Android library. What you can do is either implement the same using pure JavaScript/TypeScript directly in your app (by managing the size of the ActionBar) or create a custom NativeScript plugin that uses the mentioned android library.
One of the many beauties of NativeScript is that 100% of the native iOS and Android APIs are accessible meaning anything that is achievable in an native iOS or Android app is achievable in {N}.