Xamarin Forms-內裝有ListView的卡的高度非常大

Question

我有一個帶有項目的ListView，其中一個項目是其中帶有ListView的DataTemplate。

這里的問題是不需要任何渲染就可以很高地渲染此DataTemplate。

這是結果截圖的鏈接：

https://i.imgur.com/bYpTbMX.jpg

這是代碼：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:vm="clr-namespace:MyNotes.ViewModels"
    xmlns:converters="clr-namespace:MyNotes.Converters"
    xmlns:behaviors="clr-namespace:MyNotes.Behavior"
    xmlns:selectors="clr-namespace:MyNotes.Selectors"
    x:Class="MyNotes.Views.MainView">

    <ContentPage.Resources>
        <converters:CollectionEmptyConverter x:Key="CollectionEmptyConverter"/>
        <DataTemplate x:Key="StringTemplate">
            <ViewCell>
                <Label Text="{Binding}"/>
            </ViewCell>
        </DataTemplate>
        <DataTemplate x:Key="DefaultItemTemplate">
            <ViewCell>
                <Frame OutlineColor="Black" Margin="10">
                    <Grid Margin="10">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                        </Grid.RowDefinitions>
                        <Label Text="{Binding Title}" FontAttributes="Bold"/>
                        <Label Text="Unknow Item" Margin="0,10,0,0" Grid.Row="1"/>
                    </Grid>
                </Frame>
            </ViewCell>
        </DataTemplate>
        <DataTemplate x:Key="TodoItemTemplate">
            <ViewCell>
                <Frame OutlineColor="Black" Margin="10">
                    <Grid Margin="10">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                        </Grid.RowDefinitions>
                        <Label Text="{Binding Title}" FontAttributes="Bold"/>
                        <Label Text="{Binding Content}" Margin="0,10,0,0" Grid.Row="1"/>
                    </Grid>
                </Frame>
            </ViewCell>
        </DataTemplate>
        <DataTemplate x:Key="ListItemTemplate">
            <ViewCell>
                <Frame OutlineColor="Black">
                    <Grid Margin="10">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                        </Grid.RowDefinitions>
                        <Label Text="{Binding Title}"
                                FontAttributes="Bold"/>
                        <ListView ItemsSource="{Binding Items}"
                                    Margin="0,10,0,0"
                                    Grid.Row="1"
                                    ItemTemplate="{StaticResource StringTemplate}"/>
                    </Grid>
                </Frame>
            </ViewCell>
        </DataTemplate>
        <selectors:ItemTypeSelector x:Key="ItemTypeSelector"
                                    TodoItemTemplate="{StaticResource TodoItemTemplate}"
                                    ListItemTemplate="{StaticResource ListItemTemplate}"/>
    </ContentPage.Resources>
    <ContentPage.BindingContext>
        <vm:MainViewModel/>
    </ContentPage.BindingContext>
    <ContentPage.Content>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="auto"/>
            </Grid.RowDefinitions>
            <Label Text="No notes yet. Add some."
                    IsVisible="{Binding Collection, Converter={StaticResource CollectionEmptyConverter}}"
                    VerticalOptions="CenterAndExpand"
                    HorizontalOptions="CenterAndExpand" />
            <ListView ItemsSource="{Binding Collection}"
                        IsVisible="{Binding Collection, Converter={StaticResource CollectionEmptyConverter}, ConverterParameter=true}"
                        ItemTemplate="{StaticResource ItemTypeSelector}"/>
        </Grid>
    </ContentPage.Content>
</ContentPage>

我嘗試了很多沒有運氣的解決方案，例如：

1. I can't set the height of the listview
2. HasUnevenRows didn't work for me
3. I have rows of different height so setting RowHeight is not an option
4. Tried to investigate using behaviors and found nothing to assist me.

我已經在幾個地方閱讀過，該問題最有可能與我在DataView中的ListView內有一個ListView的事實有關。 由於它是項目的集合，其中某些項目可以在其中包含項目列表，所以我看不到如何解決這個問題。

任何幫助方向都很好。

謝謝

編輯：我已經檢查了一個更小的例子的理論

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <ListView ItemsSource="{Binding Collection}"
              BackgroundColor="Yellow"/>
    <Label Text="bla bla bla"
           Grid.Row="1"/>
</Grid>

在此示例中，我假設listview僅占據了所需的位置，但沒有，占據了整個應用程序的高度，並且我無法看到文本“ bla bla bla”。 為什么會這樣呢？？？

Answer 1

對於第二個問題：

在您的代碼段中，第一行的高度設置為“ Auto ，這意味着

對象的大小應調整為布局中的可用大小，以便第一行的大小適合其內容。

並且ListView在此行中，在這種情況下，ListView將自動填充整個屏幕以適合其內容。

第二行設置為* ，這意味着

計算自動行后，該行將成為剩余高度的一部分。

因此，在計算了自動行之后，標簽的剩余高度為0。這就是為什么您甚至看不到文本“ bla bla bla”的原因。

我通過在后面的代碼中查看ListView和Label's高度來驗證此結論。

 public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();


            this.SizeChanged += MainPage_SizeChanged; 

        }

        private void MainPage_SizeChanged(object sender, EventArgs e)
        {
            //ListView height
            Double a = myListView.Height;

            //Label height
            Double b = myLabel.Height;

        }
    }

結果如下：

Answer 2

我找到了第一個問題“任何幫助方向都很好”的解決方案。 我在此鏈接中找到了一個github項目，該項目做得很好。 它給了我一個ItemsControl，可以為其分配源和項目模板。 我將其包裝在ScrollView中，並得到了可以按預期工作的ListView。

這是一個示例用法：

<ScrollView>
    <!-- Place new controls here -->
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <controls:ItemsControl ItemsSource="{Binding Collection}"
                           BackgroundColor="Beige">
            <controls:ItemsControl.ItemTemplate>
                <DataTemplate>
                    <ContentView>
                        <Frame OutlineColor="Black" HasShadow="True" IsClippedToBounds="True" Margin="10">
                            <StackLayout>
                                <Label Text="{Binding Title}"
                                   FontAttributes="Bold"/>
                                <ScrollView>
                                    <controls:ItemsControl ItemsSource="{Binding InnerCollection}"
                                                   Margin="10,0,0,0"/>
                                </ScrollView>
                            </StackLayout>
                        </Frame>
                    </ContentView>
                </DataTemplate>
            </controls:ItemsControl.ItemTemplate>
        </controls:ItemsControl>
        <!--<ListView ItemsSource="{Binding Collection}"
              BackgroundColor="Yellow"/>-->
        <Label Text="bla bla bla"
           Grid.Row="1"/>
    </Grid>
</ScrollView>

至於我的第二個問題“為什么會這樣？” -我仍然不知道答案，但至少我可以取得進步