Calc(height) problem

android

#1

Hi

Because Nativescript does not support (yet) calc height functions in css like
height: calc(100% - 300px);
I am trying to find a suitable solution for it.

I can´t use platform like
platformModule.screen.mainScreen.heightPixels
to find the height of a screen and then take 300 from that because if I have a Samsung Galaxy S8 or S9 there are two different height´s the user can choose from and the platform always gives the same height.

What I am trying to do is basically
<StackLayout height=“150px” width="100%>
<StackLayout height=“calc(100%-300px)” width="100%>
<StackLayout height=“150px” width="100%>

Does anyone have any ideas how I can solve this for example using typescript variables, view or something comparable???

Thank you very much


#2

You may do something like this,


#3

Unfortunately, your method works the same as using platform and I still have the same problem.

You can check it by clicking the link


#4

I figured out what I was doing wrong.
GridLayout rows="*, auto"
StackLayout row=“0” /StackLayout
StackLayout row=“1” height=“150” /StackLayout
GridLayout

By doing this, the first StackLayout takes up all the available space except for the auto part which is fixed at 150 :smiley: