Nativescript+Angular 上的 ListView 仅占据垂直屏幕的一半。使用 Iphone 模拟器

Question

我在 actionBar 下有一个列表视图，它似乎只占用了屏幕垂直空间的一半。列表在半个屏幕内滚动。

<StackLayout orientation="vertical" height="100%">
    <ActionBar class="action-bar">
        <NavigationButton visibility="collapsed"></NavigationButton>
        <GridLayout columns="auto,*,auto" height="100%" width="100%">
            <Label col="0" text="&#xf0c9;" class="fa" (tap)="onDrawerButtonTap()"></Label>
            <Label col="1" text="Menu" class="action-bar-title"></Label>
        </GridLayout>
    </ActionBar>
    <!-- <ScrollView orientation="vertical"> -->
        <ListView [items]="restaurant_menu" class="list-group">
                <ng-template let-item="item" let-i="index">
                    <StackLayout orientation="vertical" class="list-group-item">
                        <Label [text]="item.name"></Label>
                        <GridLayout columns="*,auto,auto,auto" rows="auto" orientation="horizontal" class="list-group-item">
                            <Label [text]="'Rs. '+item.price" col="0" row="0" verticalAlignment="top"></Label>
                            <Label *ngIf="order && order[item.name]>0" text="-" col="1" row="0" verticalAlignment="top" horizontalAlignment="right"></Label>
                            <Label *ngIf="order && order[item.name]>0" [text]="order[item.name]" col="1" row="0" verticalAlignment="top" horizontalAlignment="right"></Label>
                            <Label (tap)="build_order(item.name, '+')" text="+" col="1" row="0" verticalAlignment="top" horizontalAlignment="right"></Label>
                        </GridLayout>
                    </StackLayout>
                </ng-template>
            </ListView> 
    <!-- </ScrollView> -->
</StackLayout>

将高度设置为 100% 不会改变结果。我错过了什么？我正在使用 native-core-theme 并且没有 css 决定高度的变化。

Answer 1

尝试删除 ActionBar 上方的 StackLayout。 ActionBar 应该是 Page 实例的一部分，或者在 {N} Angular 的情况下只是在根级别。 ListView 可以放在它的正下方，你不需要 StackLayout 来包裹它们。

Nativescript+Angular 上的 ListView 仅占据垂直屏幕的一半。使用 Iphone 模拟器

ListView on Nativescript+Angular is taking up only half of the vertical screen. Using Iphone simulator

css

ios

ios-simulator

nativescript

angular