水平 StackLayout 中的 ListView - Nativescript Vue

Posted 2023-04-13

【中文标题】水平 StackLayout 中的 ListView - Nativescript Vue

【英文标题】：ListView in horizontal StackLayout - Nativescript Vue

【发布时间】：2021-06-28 20:38:21

【问题描述】：

我是使用 Vue 的 Nativescript 的新手，我正在尝试在具有水平方向的 StackLayout 中使用 ListView 显示项目列表。

我期望 ListView 将循环的三个元素将显示在同一行，这要归功于 StackLayout。

相反，这三个元素显示在不同的行上。

看到这个游乐场：https://play.nativescript.org/?template=play-vue&id=cHwk9f

如何在同一行显示所有项目（作为按钮）？

感谢您的帮助！ :)

【参考方案1】：

ListView 目前不支持水平方向。

如果您仍然想要 ListView 行为，您可以使用 RadListView，尤其是当您有很多要显示的项目时。

ns plugin add nativescript-ui-listview

 <RadListView scrollOrientation="horizontal>
  ...
</RadListView>

更多关于here

如果您不想在ListView 中显示很多项目，您也可以选择ScrollView 和StackLayout：

<ScrollView orientation="horizontal">
  <StackLayout orientation="horizontal">
     <!-- your item templates goes here maybe in a v-for -->
  </StackLayout>
</ScrollView>

【讨论】：

谢谢你，RadListView 组件原来是完美的