Question

目前我正在使用Angular 2开发{N}应用，我想在整个屏幕上放置4行，高度相等例如，

<GridLayout rows="*,*,*,*">
                        <StackLayout row="0"  backgroundColor="blue">
                            <Label text="row 0 "></Label>
                        </StackLayout>
                        <StackLayout row="1"  backgroundColor="red">
                            <Label text="row 1 with some large content and scrollable"></Label>
                        </StackLayout>
                        <StackLayout row="2"  backgroundColor="yellow">
                            <Label text="row 2 with some large content and scrollable"></Label>
                        </StackLayout>
                        <StackLayout row="3"  backgroundColor="green">
                            <Label text="row 3 with some large content and scrollable"></Label>
                        </StackLayout>
                    </GridLayout>

如果内容存在与否，我希望整个屏幕中的row1，row2和row3等于高度。如果行的内容很大并且想要将其放在ScrollView中。在web（html）中假设整个页面高度为1000，那么我将给出

row0 height="100" 
row1 height="300"
row2 height="300"
row3 height="300"

任何人都可以帮助我在{N}

中实现这一目标

Answer 1

基于此https://docs.nativescript.org/ui/layout-containers#sample-star-sizing

的样本

所以你的网格定义是这样的：

<GridLayout rows="*,3*,3*,3*">
    <!--Your content-->
<GridLayout>

您的网格包含10行，但它们会根据*定义中rows之前的数字进行分组

Answer 2

根据Marek Maszay的说法＆＃39;下面是我的最终布局。

$(document).on('click','button',function(){
    $("#flipbook").turn("page", $(this).data('page'));
});

NativeScript GridLayout整个屏幕中的行大小相等

2 个答案: