Apply css before the loading of a view


hello, this is my first post here…is possible to apply custom css to a view before the loading of a page?
i explain: I have an homepage with six blocks, so if I set fixed heights it would be good for my developement smartphone, but it won’t for different screens, so to “make responsive” this view before the loading of the home i calculate the height of the view with

var dynamicheight=(platformModule.screen.mainScreen.heightDIPs-80)/3

and would set this height to the blocks in the css.

i didn’t find a better way to do this, i tried with vh or % dimensions but seems NS don’t like these

any suggestion will be appreciated

thank you


Simply use a GridLayout, assign rows="*,*,*" so it splits the available space into 3 now set row index to each component inside. You don’t have to manually calculate height here.

Learn more about layouts at nslayouts


hi, thanks for the answer, in my case it doens’t work, i have a gridlayout with two rows, the second with fixed height and the first with the * and contains “height dynamic blocks” made with 6 images that should be of different sizes but wrapped in fixed containers


Then still a Grid Layout works, it should be something like

<GridLayout rows="*,100">
 <ScrollView row="0">
      <!-- your images here-->
 <!-- your fixed content -->
 <StackLayout row="1"></StackLayout>

Besides did you try the site in the link - it gives you several examples of different layouts - at least one of them always fulfills you requirement.


yes, this is the situation, but being the images of different sizes i need to lock them in fixed block, otherwise the result is ugly.


You have lot of options for images to get things right. I would recommend you to go though the layout and Image component docs.