代码之家 › 专栏 › 技术社区 › Tihomir Mitkov

在布局中包装时,ScrollView不工作

angular2-nativescript nativescript

Tihomir Mitkov · 技术社区 · 6 年前

我注意到当一个scrollview被包装在另一个布局小部件中时,它会停止对panning的响应。我正在寻找一个解决方案,即使在包装时也允许scrollview按预期工作。这里是一个 sample app in Playground 我把模板贴在这里

此示例不滚动:

<AbsoluteLayout #wrapTop class="wrapTop" left="0" top="0" width="100%" height="100%">
<ScrollView orientation="horizontal" sdkExampleTitle sdkToggleNavButton>
    <GridLayout class="m-15" columns="auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto">
         <Label width="50" height="50" class="h3 m-15" col="0" text="Title 1"></Label>
         <Label width="50" height="50" class="h3 m-15" col="1" text="Title 2"></Label>
         <Label width="50" height="50" class="h3 m-15" col="2" text="Title 3"></Label>
         <Label width="50" height="50" class="h3 m-15" col="3" text="Title 4"></Label>
         <Label width="50" height="50" class="h3 m-15" col="4" text="Title 5"></Label>
         <Label width="50" height="50" class="h3 m-15" col="5" text="Title 6"></Label>
         <Label width="50" height="50" class="h3 m-15" col="6" text="Title 7"></Label>
         <Label width="50" height="50" class="h3 m-15" col="7" text="Title 8"></Label>
         <Label width="50" height="50" class="h3 m-15" col="8" text="Title 9"></Label>
         <Label width="50" height="50" class="h3 m-15" col="9" text="Title 10"></Label>
         <Label width="50" height="50" class="h3 m-15" col="10" text="Title 10"></Label>
         <Label width="50" height="50" class="h3 m-15" col="11" text="Title 11"></Label>
         <Label width="50" height="50" class="h3 m-15" col="12" text="Title 12"></Label>
         <Label width="50" height="50" class="h3 m-15" col="13" text="Title 13"></Label>
         <Label width="50" height="50" class="h3 m-15" col="14" text="Title 14"></Label>
         <Label width="50" height="50" class="h3 m-15" col="15" text="Title 15"></Label>
    </GridLayout>
</ScrollView>
</AbsoluteLayout>

1 回复 | 直到 6 年前

Manoj 6 年前

我不认为你需要一个绝对的布局,至少当你不打算把你的孩子组件放在绝对的位置。

另外,当您想简单地以水平方向堆叠项目时,不需要GridLayout,您可以将StackLayout与水平方向一起使用。

我已经更新了你的 Playground 例子。

有关布局的详细信息,请访问 https://www.nslayouts.com/

更新:

感谢@drachernar提出了一个有效的观点。如果计划呈现n个看起来相似的项,则应考虑使用listview/radlistview。RadListView支持不同的布局和水平方向,这应该适合您的要求。