CODEWITHSUNDEEP
nativescriptnativescript-angular
bradrice
bradrice

Reputation: 1755

Nativescript GridLayout set row height in typescript

Is there a way to change/set the height of a GridLayout row after it has already been drawn?

For example, I have a GridLayout setup like this:

<GridLayout class="template_body" rows="40,*,60">
<StackLayout row="0" [visibility]="isTablet ? 'visible' : 'collapsed'">
    <Label text="Drag statements to the proper category."></Label>
    <FlexboxLayout flexDirection="row" row="1" [visibility]="isSubmitted ? 'visible' : 'collapsed'">
            <AbsoluteLayout height="10" width="10" class="correct-legend"></AbsoluteLayout><Label class="legend-label" text="Correct"></Label>
            <AbsoluteLayout height="10" width="10" class="incorrect-legend"></AbsoluteLayout><Label class="legend-label" text="Incorrect"></Label>
        </FlexboxLayout>
</StackLayout>

I want to change the height of the first row based on a condition. to rows="100,*,60"

I've tried getting the rows by using getRows() on the gridlayout, but seem to not be able to do anything with what is returned. It appears it is returning an Observable rather than an array of rows as the api says it should return.

Upvotes: 2

Views: 1644

Answers (1)

Tim
Tim

Reputation: 86

If you want more control than rows="auto, *,auto" will give, you can give the gridlayout an id such as id="someId" and then try in js/ts...

page.getViewById("someId").rows="100, *,60"; 
page.getViewById("someId").requestLayout();

Upvotes: 7

Related Questions