[英]Xamarin.Forms ListView with an AutoSize height
I've read many stackoverflow articles to find out how to set height of the ListView
so that the ListView
is exactly as high as is its content.我已经阅读了许多 stackoverflow 文章,以了解如何设置
ListView
高度,以便ListView
与其内容完全一样高。 But none of the many answer solve my needs.但是很多答案都没有解决我的需求。
I tried to adapt the basiclist sample in https://docs.microsoft.com/en-us/samples/xamarin/xamarin-forms-samples/workingwithlistview/ with this code我尝试使用此代码调整https://docs.microsoft.com/en-us/samples/xamarin/xamarin-forms-samples/workingwithlistview/ 中的 basiclist 示例
<AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<StackLayout AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1">
<ScrollView>
<StackLayout>
<StackLayout VerticalOptions="StartAndExpand">
<Label Text="Hallo"/>
</StackLayout>
<StackLayout VerticalOptions="StartAndExpand" >
<ListView x:Name="listView" BackgroundColor="Green" VerticalOptions="Start"
ItemsSource="{Binding .}" >
<ListView.Footer>
<Label />
</ListView.Footer>
</ListView>
</StackLayout>
<StackLayout>
<Label Text="Hallosdf"/>
</StackLayout>
</StackLayout>
</ScrollView>
</StackLayout>
</AbsoluteLayout>
but no matter what I do, all results in a list thats too high.但无论我做什么,都会导致列表太高。 The green element is the oversized listview.
绿色元素是超大的列表视图。 All content below the listview is outside of the viewport.
列表视图下方的所有内容都在视口之外。
Thanks a lot.非常感谢。 Uwe
乌韦
The problem is, that you have nested 2 scroll views with the same direction into each other ( ScrollView
and ListView
) without one having a fixed height.问题是,您嵌套了 2 个具有相同方向的滚动视图(
ScrollView
和ListView
),但没有一个具有固定的高度。
Solution if you want the ListView to shrink to it's contents: Remove the ListView如果您希望 ListView 缩小到它的内容,解决方案:删除 ListView
There is a BindableLayout
that can be used with StackLayout
and other layouts.有一个
BindableLayout
与StackLayout
和其他布局一起使用的BindableLayout
。 ( https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/bindable-layouts ) ( https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/bindable-layouts )
<AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<ScrollView AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1">
<StackLayout >
<Label Text="Hallo"/>
<StackLayout BindableLayout.ItemsSource="{Binding .}" BackgroundColor="Green">
<BindableLayout.ItemTemplate>
<DataTemplate>
<Label Text="{Binding .}"/>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
<Label Text="Hallosdf"/>
</StackLayout>
</ScrollView>
</AbsoluteLayout>
Solution if you want the ListView to stretch: Remove the Scrollview如果您希望 ListView 拉伸,解决方案:删除 Scrollview
The Hallosdf
Label will be shown below the ListView
and only the ListView will scroll. Hallosdf
标签将显示在ListView
下方,并且只有 ListView 会滚动。 Btw: You don't need to wrap every view in a StackLayout
.顺便说一句:您不需要将每个视图都包装在
StackLayout
。 Try to avoid unnecessary layout nesting to gain the best performance.尽量避免不必要的布局嵌套以获得最佳性能。 If the
StackLayout
is the only layout within your AbsoluteLayout
, you can also get rid of the AbsoluteLayout
.如果
StackLayout
是您的AbsoluteLayout
的唯一布局,您也可以摆脱AbsoluteLayout
。
<AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<StackLayout AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1">
<Label Text="Hallo"/>
<ListView x:Name="listView" BackgroundColor="Green" VerticalOptions="FillAndExpand"
ItemsSource="{Binding .}" >
</ListView>
<Label Text="Hallosdf"/>
</StackLayout>
</AbsoluteLayout>
Ahhh, its the RowHeight that matters.啊,它的 RowHeight 很重要。 I have no uneven rows and therefore I can set the RowHeight.
我没有不均匀的行,因此我可以设置 RowHeight。
<StackLayout Orientation="Vertical"
VerticalOptions="Fill"
HorizontalOptions="StartAndExpand">
<ListView VerticalOptions="FillAndExpand"
RowHeight="<some row height>">
</ListView>
</StackLayout>
Answer #7 found in Xamarin.Forms: ListView inside StackLayout: How to set height?在Xamarin.Forms 中找到答案 #7 :StackLayout 中的 ListView:如何设置高度?
Thanks a lot非常感谢
use DLToolkit.Forms.Controls.FlowListView使用 DLToolkit.Forms.Controls.FlowListView
xmal极小的
SfListView Orientation="Horizontal" QueryItemSize="ListItems_QueryItemSize" ItemsSource="{Binding FavItemList}" SfListView Orientation="Horizontal" QueryItemSize="ListItems_QueryItemSize" ItemsSource="{Binding FavItemList}"
QueryItemSize is use to Set Custom Height of each item QueryItemSize 用于设置每个项目的自定义高度
in Code Behind在代码背后
private void ListItems_QueryItemSize(object sender,Syncfusion.ListView.XForms.QueryItemSizeEventArgs e)
{
if (e.ItemData != null && !string.IsNullOrEmpty((e.ItemData as FavItemsList).Name))
{
e.ItemSize = (e.ItemData as FavItemsList).Name.Count() + 80;
e.Handled = true;
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.