How to position element at the bottom of Absolute Layout in NativeScript?
Asked 07 September, 2021
Viewed 509 times
  • 59
Votes

I want to position an element at the bottom of the screen in Absolute Layout in NativeScript.

I have this code:

<AbsoluteLayout>
    <maps:mapView 
        left="0"
        top="0"
        width="100%"
        height="100%"
        latitude="{{ map.latitude }}" 
        longitude="{{ map.longitude }}" 
        zoom="{{ map.zoom }}"
        padding="{{ map.padding }}"  
        mapReady="onMapReady"
        coordinateTapped="onCoordinateTapped"
        markerSelect="onMarkerSelect"
        shapeSelect="onShapeSelect"
        cameraChanged="onMapCameraChanged"/>

    <ScrollView
        left="0"
        top="0"
        width="100%"
        orientation="horizontal">
        <!-- More XML -->
    </ScrollView>

    <StackLayout
        left="0"
        bottom="0"
        width="100%"
        visibility="visible"
        orientation="horizontal"
        style="background-color: red;">

        <Label text="TITLE"></Label>

    </StackLayout>
</AbsoluteLayout>

I figured out that there is no bottom attribute for AbsoluteLayout... Here is the picture of what I want to create:

enter image description here

So how to arange items like in the picture, especially the bottom one?

EDIT: I should note that dimensions of this bottom rectangle may not be always same....

5 Answer