如何在列表视图中分组的最后一项之后添加填充? (xaml)

时间:2019-10-11 12:50:51

标签: listview xamarin.forms

我试图在列表视图中分组的最后一项之后添加一些填充/空格。像下面的图片一样,我该如何实现?

![https://imgur.com/s4yx99b]“列表视图”

<ListView.GroupHeaderTemplate>
        <DataTemplate>
            <ViewCell>
                <Frame Margin="0,0,0,0" Padding="0,0,0,0" BackgroundColor="#2D3334" CornerRadius="0" >
                    <Frame Margin="0,15,0,0" Padding="0,8,0,15" BackgroundColor="#324458" CornerRadius="0" >
                        <Grid >
                            <Grid.RowDefinitions>
                                <RowDefinition Height="40" />
                            </Grid.RowDefinitions>

                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="50" />
                                <ColumnDefinition Width="7*"/>
                                <ColumnDefinition Width="2*"/>
                            </Grid.ColumnDefinitions>
                            <Label HorizontalOptions="StartAndExpand"  VerticalOptions="CenterAndExpand" HorizontalTextAlignment="Start" VerticalTextAlignment="Center"  TextColor="white" Grid.Row="0" Grid.Column="1" Text="{Binding Name}"/>
                            <Label HorizontalOptions="FillAndExpand"  VerticalOptions="FillAndExpand" VerticalTextAlignment="Center" HorizontalTextAlignment="Center" Grid.Row="0"  Grid.Column="0" BackgroundColor="#2D3334" Margin="0,3,0,3"  TextColor="#C4ced8" Text="LPic" />
                            <Label HorizontalOptions="FillAndExpand"  VerticalOptions="FillAndExpand" VerticalTextAlignment="Center" HorizontalTextAlignment="Center"  BackgroundColor="#2D3334" Grid.Row="0" Grid.Column="2"  TextColor="#C4ced8" Margin="0,3,0,3"  Text="30. SEP" />

                        </Grid>
                    </Frame>
                </Frame>
            </ViewCell>
        </DataTemplate>
    </ListView.GroupHeaderTemplate>

2 个答案:

答案 0 :(得分:0)

在列表视图的RowHeight(行正常高度+所需的填充量)属性中添加一些像素,然后将VerticalOptions="StartAndExpand"添加到Frame标记

答案 1 :(得分:0)

根据您的代码,我看到ListView标头中有三个标签,因此您希望最后一个项目与右边的屏幕相距一点吗?如果可以,建议您看一下以下代码:

首先,请为第三个ColumnDefinition添加足够的空间,然后将标签设置为Horizo​​ntalOptions =“ StartAndExpand”。

<ListView.GroupHeaderTemplate>
                <DataTemplate>
                    <ViewCell>
                        <Frame
                            Margin="0,15,0,0"
                            Padding="0,8,0,15"
                            BackgroundColor="#324458">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="40" />
                                </Grid.RowDefinitions>

                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="50" />
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="*" />
                                </Grid.ColumnDefinitions>

                                <Label
                                    Grid.Row="0"
                                    Grid.Column="0"
                                    Margin="0,3,0,3"
                                    BackgroundColor="#2D3334"
                                    HorizontalOptions="EndAndExpand"
                                    Text="LPic"
                                    TextColor="#C4ced8"
                                    VerticalOptions="CenterAndExpand" />

                                <Label
                                    Grid.Row="0"
                                    Grid.Column="1"
                                    HorizontalOptions="CenterAndExpand"
                                    Text="{Binding Heading}"
                                    TextColor="white"
                                    VerticalOptions="CenterAndExpand" />
                                <Label
                                    Grid.Row="0"
                                    Grid.Column="2"
                                    Margin="0,3,0,3"
                                    BackgroundColor="#2D3334"
                                    HorizontalOptions="StartAndExpand"
                                    Text="30. SEP"
                                    TextColor="#C4ced8"
                                    VerticalOptions="CenterAndExpand" />

                            </Grid>
                        </Frame>

                    </ViewCell>
                </DataTemplate>
            </ListView.GroupHeaderTemplate>