Search code examples
iosnativescriptnativescript-angular

Unable to set GridLayout height programatically


I am trying to implement swipe actions on ListView for each element. Whole view is AbsoluteLayout, with two GridLayouts: one acting as "foreground"(list element) and other as "background" (swipe actions). I want them both to have equal height of "foreground" (which is dynamic and differs for every list element).

I succesfully implemented this on Android - I call a method on layoutChanged event

onLayoutChanged(args: EventData) {
    const foregroundNotificationTemplate = (<AbsoluteLayout>(args.object)).getChildAt(1);
    const backgroundButtons = (<AbsoluteLayout>args.object).getChildAt(0);
    backgroundButtons.height = foregroundNotificationTemplate.getActualSize().height;
}

This unfortunatelly is not working on iOS. I tried to access Frame and UiView, but with no success - it has height of background content.

Demo presenting the problem on Nativescript Playground: https://play.nativescript.org/?template=play-ng&id=4LRwDC


Solution

  • You don't necessarily have to use AbsoluteLayout as you are animating the position with translate which is possible with any layout. So using GridLayout instead of AbsoluteLayout should solve your problem on both platforms and you may also get rid layoutChanged event for measuring height.

    Also note that your ListView item template can not be dynamic, you should not use ngIf or anything that would alter the structure of the list item, use multiple templates instead.