本机脚本Listview无法正常显示

时间:2016-08-30 21:11:49

标签: nativescript angular2-nativescript

我有一个页面,我在顶部显示一个ActionBar,在下面我看到了一个SegmentedBar。对于SegmentedBar的第一个标签,我会显示一个列表。列表正在渲染,但不占用剩余空间。这是我的代码 -

<ActionBar title="NS Learning" android:position="right">
    <StackLayout orientation="horizontal" horizontalAlignment="stretch">
       <Label text="Jahid Shohel" horizontalAlignment="center"></Label>
    </StackLayout>
</ActionBar>
<GridLayout rows="auto, *" columns="*">
    <SegmentedBar row="0" #tabs [items]="items" [(ngModel)]="selectedIndex" selectedBackgroundColor="#fac950"></SegmentedBar>

    <StackLayout row="1" *ngIf="selectedIndex === 0" height="stretch">
        <tab1></tab1>
    </StackLayout>
    <StackLayout row="1" *ngIf="selectedIndex === 1" width="100%">
        <tab2></tab2>
    </StackLayout>
    <StackLayout row="1" *ngIf="selectedIndex === 2" width="100%">
        <tab3></tab3>
    </StackLayout>
</GridLayout>

我的<tab1></tab1>代码是 -

<DockLayout>
    <ListView [items]="items" dock="top">
        <template let-item="item">
            <GridLayout columns="auto, *, auto" rows="auto,auto">
                <Image row="0" rowSpan="2" col="0" src="res://user" class="post-image"></Image>
                <Label row="0" col="1" colSpan="2" text="Good morning! Have a nice day"></Label>
                <Image row="1" col="1" src="res://facebook_thumb" class="social-icon"></Image>
                <Label row="1" col="2" text="15 August 2016 11:17:26"></Label>
            </GridLayout>
        </template>
    </ListView>
</DockLayout>

渲染列表就像这样 -

enter image description here

我知道如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

在ListView上应用高度属性,值为&#34; 100%&#34;

<ListView [items]="items" dock="top" height="100%">