angular - Nativescript 中 RadListView 的中心项目

Question

我无法在 nativescript-angular 应用程序的屏幕中间将 RadViewList 的元素居中。参见游乐场：https ://play.nativescript.org/?template=play-ng&id=ZFOHYN&v=4

我尝试了几种没有结果的方法：FlexBoxLayout、horizo​​ntalAlignment 和 verticalAlignment、内联 css、css 显示 flex..

参见游乐场：https ://play.nativescript.org/?template=play-ng&id=ZFOHYN&v=4

---

<StackLayout class="page">
    <GridLayout tkExampleTitle tkToggleNavButton>
        <RadListView col="1" [items]="name" 
            selectionBehavior="LongPress"
            multipleSelection="true" reorderMode="Drag" 
            backgroundColor="gray"
            height="100%" itemReorder="true" padding="10">
            <ng-template tkListItemTemplate let-item="item">
                <GridLayout>
                    <Label [text]="item" textAlignment="center" 
                        witdh="95%"
                        height="95%" margin="5px" padding="15px"
                        backgroundColor="red" fontSize="30"></Label>
                </GridLayout>
            </ng-template>

            <ListViewGridLayout tkListViewLayout 
                 scrollDirection="Vertical"
                ios:itemHeight="250" spanCount="5"> 
            </ListViewGridLayout>
        </RadListView>
    </GridLayout>
</StackLayout>

---

元素停留在左上角！！

Answer 1

尝试将这样的垂直对齐添加到您的内部网格中：

<GridLayout class="vcenter">
...

在你的样式表中有这个：

.vcenter {
    vertical-align: center;
}

Answer 2

请删除此行

 <ListViewGridLayout tkListViewLayout scrollDirection="Vertical" ios:itemHeight="250" spanCount="5"> 
 </ListViewGridLayout>

并且应该按预期工作