如何在 Grid 中制作可扩展的 listView？

Question

我想让 ui 喜欢这张图片。但我不知道如何在网格中制作可扩展的列表视图。

    <?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                 x:Class="ElronWebtoon_Test.myLibrary.LibTab" BackgroundColor="White">

    <Grid RowSpacing="0">
        <Grid.RowDefinitions>
            <RowDefinition x:Name="TopGrid"/>
            <RowDefinition />
            <RowDefinition x:Name="menuRow"/>
        </Grid.RowDefinitions>

        <Grid Grid.Row="0" x:Name="GlobalLayout" >

            <Grid.RowDefinitions>
                <RowDefinition x:Name="TopBtn_Grid"/>
                <RowDefinition x:Name="menu_Grid"/>
            </Grid.RowDefinitions>

            <Grid Grid.Row="0" VerticalOptions="Start" >
                <Label x:Name="labelBox1" Text="LabelBox1" Font="Bold, 16" TextColor="Black" HorizontalOptions="Start"  HorizontalTextAlignment="Center" VerticalTextAlignment="Center" VerticalOptions="Center" Grid.Column="0" BackgroundColor="#A8D2F1">
                    <Label.GestureRecognizers>
                        <TapGestureRecognizer/>
                    </Label.GestureRecognizers>
                </Label>
                <Label x:Name="LabelBox2" Text="LabelBox2" Font="Bold, 16" TextColor="Black" HorizontalOptions="End"  HorizontalTextAlignment="Center" VerticalTextAlignment="Center" VerticalOptions="Center" Grid.Column="0" BackgroundColor="#A8D2F1">
                    <Label.GestureRecognizers>
                        <TapGestureRecognizer />

                    </Label.GestureRecognizers>
                </Label>
            </Grid>

            <Grid Grid.Row="1" x:Name="libMenu" RowSpacing="0" HorizontalOptions="CenterAndExpand">

                <Grid Grid.Column="0" x:Name="menuGrid_1" HorizontalOptions="Center">
                    <Button   BorderRadius="30" BorderColor="Black" BorderWidth="2" BackgroundColor="White"  VerticalOptions="Center"/>
                    <Label x:Name="BtnText1" Text="BtnText1" TextColor="Black" VerticalOptions="Center" HorizontalOptions="Center" VerticalTextAlignment="Center"/>
                </Grid>
                <Grid Grid.Column="1" x:Name="menuGrid_2" HorizontalOptions="Center">
                    <Button   BorderRadius="30" BorderColor="Black" BorderWidth="2" BackgroundColor="White"  VerticalOptions="Center"/>
                    <Label x:Name="BtnText2" Text="BtnText2" TextColor="Black" VerticalOptions="Center" HorizontalOptions="Center" VerticalTextAlignment="Center"/>
                </Grid>
                <Grid Grid.Column="2" x:Name="menuGrid_3" HorizontalOptions="Center">
                    <Button   BorderRadius="30" BorderColor="Black" BorderWidth="2" BackgroundColor="White"  VerticalOptions="Center"/>
                    <Label x:Name="BtnText3" Text="BtnText3" TextColor="Black" VerticalOptions="Center" HorizontalOptions="Center" VerticalTextAlignment="Center"/>
                </Grid>


            </Grid>

        </Grid>

        <Grid Grid.Row="1" VerticalOptions="Fill" x:Name="inner_Content">

        </Grid>


        <Grid Grid.Row="2" >
            <Grid>
                <Button Text="BTN1" Grid.Column="0" />
                <Button Text="BTN2" Grid.Column="1"/>
                <Button Text="BTN3" Grid.Column="2"/>
                <Button Text="BTN4" Grid.Column="3"/>
                <Button Text="BTN5" Grid.Column="4"/>
            </Grid>
        </Grid>
    </Grid>

</ContentPage>

这是我的示例代码。

我想在网格中插入可扩展列表视图，在此代码中命名为 inner_Content。

但如果我搜索可扩展列表视图，那只能在 contentPage 中搜索。

不在网格中。

你能帮帮我吗？

Answer 1

我猜您正在寻找 Xamarin 中使用的类似手风琴控件的东西。

Check the URL below: https://www.codeproject.com/Articles/1088093/Simple-Accordion-User-Control-in-Xamarin-Forms

希望对您有所帮助，如果您认为这符合您的要求，请标记为答案。

此致，

N 鲍阿

如何在 Grid 中制作可扩展的 listView？

how can i make expandable listView in Grid?

android

expandablelistview

xamarin.forms