Have to nest custom views to work in container views?


#1

Hi all, can anyone tell me if I have to nest custom views within a container view to work, as it seems this is the only way?

<!-- Doesnt work -->
    <DockLayout stretchLastChild="true">
        <top-bar dock="top"></top-bar>
        <bottom-bar dock="bottom" backgroundColor="red"></bottom-bar>
        <main-content="left" backgroundColor="green"></main-content>
    </DockLayout>

    <!-- works -->
    <DockLayout stretchLastChild="true">
        <StackLayout dock="top">
            <top-bar></signup-toolbar>
        </StackLayout>
        <StackLayout dock="bottom">
            <bottom-bar></bottom-bar>
        </StackLayout>
        <StackLayout dock="left">
            <main-content></main-content>
        </StackLayout>
    </DockLayout>

#2

Can anyone respond on this?


#3

Hi @johnnyzen

Unfortunately that’s the lesser of two evils.

We’ve had the same problem all the way back with nativescript-angular-1.0.0.

I had a link to an explanation but I can’t find it right now.
As I remember it Layout properties like row/col are not applied to the content of a custom component with nativescript-angular.
So either you wrap your components inside a StackLayout like you did, or you add the layout property under another name and apply them inside your custom component.

I just gave an example on this issue:


#4

Thanks m_abs for the reply.

Thats fine, I can live with it, just wasnt sure if I had missed something !

Best wishes

Johnny