NativeScript: scrollable application with a fixed bottom navigation with nice icon buttons

NativeScript_Bottom_Nav_templ.jsx

<ActionBar title="All cocktails"></ActionBar>
<GridLayout rows="*,60">
    <ScrollView row="0">
        <WrapLayout orientation="horizontal">
            <GridLayout *ngFor="let item of data" width="50%" height="150">
                <Image
                    src="~/images/{{ item.imageURL }}"
                    stretch="aspectFill"
                    row="1"
                ></Image>
                <Label
                    row="1"
                    text="{{ item.title }}"
                    horizontalAlignment="center"
                    verticalAlignment="bottom"
                    backgroundColor="rgb(81,197,247, 0.8)"
                    width="100%"
                    padding="10"
                    fontSize="13"
                    color="white"
                ></Label>
            </GridLayout>
        </WrapLayout>
    </ScrollView>
    <StackLayout row="1" orientation="horizontal">
        <Button textWrap="true" width="25%" textAlignment="text">
            <FormattedString>
                <Span text="&#xf015;\n" fontFamily="FontAwesome"></Span>
                <Span text="Home"></Span>
            </FormattedString>
        </Button>
        <Button textWrap="true" width="25%" textAlignment="text">
            <FormattedString>
                <Span text="&#xf000;\n" fontFamily="FontAwesome"></Span>
                <Span text="All Cocktails"></Span>
            </FormattedString>
        </Button>
        <Button textWrap="true" width="25%" textAlignment="text">
            <FormattedString>
                <Span text="&#xf005;\n" fontFamily="FontAwesome"></Span>
                <Span text="Favorite"></Span>
            </FormattedString>
        </Button>
        <Button textWrap="true" width="25%" textAlignment="text">
            <FormattedString>
                <Span text="&#xf007;\n" fontFamily="FontAwesome"></Span>
                <Span text="Profile"></Span>
            </FormattedString>
        </Button>
    </StackLayout>
</GridLayout>

This template is a part of my Medium article: https://medium.com/@hristo.eftimov/nativescript-how-to-create-a-fixed-bottom-navigation-bfe8b059ad1e