Xamarin.Forms ListView 大小到内容? [英] Xamarin.Forms ListView size to content?
问题描述
我有一个非常大的表单(主要适用于平板电脑),它有一个 TabbedPage
嵌套一个 ScrollView
和一个垂直的 StackPanel
包含许多控制.
I have a pretty large form (adapted mainly for tablets), that has a TabbedPage
nesting a ScrollView
and a vertical StackPanel
containing many controls.
我很少有一个 ListView
包含几个单行项目的情况,我需要它来调整内容的大小.
我想去掉它的滚动条,但无论如何我不希望它占用的空间超过其项目所需的空间.
有没有一种方法(甚至是丑陋的方法)无需编写 x3 平台的渲染器即可实现这一目标?
I have few occurrences where I have a ListView
that contains a few single-line items, and I need it to size to content.
I'd like to get rid of its scroll-bars, but anyway I don't want it to take up more space than what's required for its items.
Is there a way (even an ugly one) to achieve that without have to write a renderer x3 platforms?
这是一个描述我的树的伪代码:
Here's a pseudo describing my tree:
<ContentPage>
<MasterDetailPage>
<MasterDetailPage.Detail>
<TabbedPage>
<ContentPage>
<ScrollView>
<StackPanel>
<!-- many controls-->
<ListView>
渲染时,在 ListView
之后有一个巨大的差距.我怎样才能避免这种情况?
When rendered, there is a huge gap coming after the ListView
. How can I avoid that?
我尝试使用 VerticalOptions
和 HeightRequest
,但都没有奏效.
I tried messing around with the VerticalOptions
and HeightRequest
, non of which worked.
我正在寻找一种动态方式(最好没有继承)来实现这一点,而无需涉及自定义渲染器.
I'm looking for a dynamic way (preferably without inheritance) to achieve that without involving custom renderers.
推荐答案
基于Lutaaya的answer,我做了一个行为自动执行此操作,确定和设置行高(Gist).
Based on Lutaaya's answer, I made a behavior that automates this, determining and setting the row-height (Gist).
namespace Xamarin.Forms
{
using System;
using System.Linq;
public class AutoSizeBehavior : Behavior<ListView>
{
ListView _ListView;
ITemplatedItemsView<Cell> Cells => _ListView;
protected override void OnAttachedTo(ListView bindable)
{
bindable.ItemAppearing += AppearanceChanged;
bindable.ItemDisappearing += AppearanceChanged;
_ListView = bindable;
}
protected override void OnDetachingFrom(ListView bindable)
{
bindable.ItemAppearing -= AppearanceChanged;
bindable.ItemDisappearing -= AppearanceChanged;
_ListView = null;
}
void AppearanceChanged(object sender, ItemVisibilityEventArgs e) =>
UpdateHeight(e.Item);
void UpdateHeight(object item)
{
if (_ListView.HasUnevenRows)
{
double height;
if ((height = _ListView.HeightRequest) ==
(double)VisualElement.HeightRequestProperty.DefaultValue)
height = 0;
height += MeasureRowHeight(item);
SetHeight(height);
}
else if (_ListView.RowHeight == (int)ListView.RowHeightProperty.DefaultValue)
{
var height = MeasureRowHeight(item);
_ListView.RowHeight = height;
SetHeight(height);
}
}
int MeasureRowHeight(object item)
{
var template = _ListView.ItemTemplate;
var cell = (Cell)template.CreateContent();
cell.BindingContext = item;
var height = cell.RenderHeight;
var mod = height % 1;
if (mod > 0)
height = height - mod + 1;
return (int)height;
}
void SetHeight(double height)
{
//TODO if header or footer is string etc.
if (_ListView.Header is VisualElement header)
height += header.Height;
if (_ListView.Footer is VisualElement footer)
height += footer.Height;
_ListView.HeightRequest = height;
}
}
}
用法:
<ContentPage xmlns:xf="clr-namespace:Xamarin.Forms">
<ListView>
<ListView.Behaviors>
<xf:AutoSizeBehavior />
这篇关于Xamarin.Forms ListView 大小到内容?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!