如何在xamrin.forms中创建具有不同行高的动态列表?

时间:2019-05-06 16:18:53

标签: xamarin.forms collectionview

我想创建一个“笔记”的列表视图,其中每个笔记根据用户编写的文本都有自己的高度。

我使用了集合视图来实现这一点,但是该视图不是动态的,并且对于具有相同高度的行似乎很丑陋。

<?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="KiaiDay.Views.Main.Notas" xmlns:resource="clr-namespace:KiaiDay.Resources">
    <ContentPage.Content>
        <StackLayout Padding="10">
            <SearchBar Placeholder="{x:Static resource:AppResource.Pesquisa}" TextChanged="SearchBar_TextChanged"></SearchBar>
            <CollectionView ItemsSource="{Binding Notas}">
                <CollectionView.ItemsLayout>
                    <GridItemsLayout Orientation="Vertical" Span="3"/>
                </CollectionView.ItemsLayout>
                <CollectionView.ItemTemplate>
                    <DataTemplate>
                        <StackLayout Padding="5">
                        <Frame BackgroundColor="{Binding Cor}"
                                    OutlineColor="Black"
                                    CornerRadius="10" Padding="0">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="15"/>
                                    <RowDefinition Height="Auto"/>
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>

                                <Label Grid.Row="0" FontSize="Micro" FontAttributes="Bold" Text="{Binding Titulo}" VerticalTextAlignment="Center" HorizontalTextAlignment="Center"/>
                                <Label LineBreakMode="WordWrap" Grid.Row="1" VerticalTextAlignment="Start" Text="{Binding Descricao}" HorizontalTextAlignment="Center"/>
                            </Grid>
                            </Frame>
                        </StackLayout>
                    </DataTemplate>
                </CollectionView.ItemTemplate>
            </CollectionView>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

我想要这样的东西: https://imgur.com/rsPiExl 但是我现在得到的是: https://imgur.com/rvuuOis

0 个答案:

没有答案