Xamarin.Forms。 Collectionview 在其内容后添加了很多额外的白色 space

Xamarin.Forms. Collectionview adds a lot of extra white space after its content

我希望集合视图的内容后面没有空space

我试图将我的按钮放在页脚中,但后来我 运行 遇到了问题,即 属性 isenabled = false 没有在我后面的代码中应用到它。 这是我的 xaml 文件:

<ContentPage.Content>
    <RefreshView x:DataType="local:QuestionViewModel" Command="{Binding LoadCommand}" IsRefreshing="{Binding IsBusy, Mode=TwoWay}">
        <ScrollView>
            <StackLayout>
                <views:MyTextView LaTeX="{Binding Formulation}" HorizontalOptions="Center" Margin="15, 10, 15, 0"/>
                <!--<RefreshView x:DataType="local:QuestionViewModel" Command="{Binding LoadCommand}" IsRefreshing="{Binding IsBusy, Mode=TwoWay}">-->
                    <CollectionView
                        ItemsSource="{Binding Answers, Mode=TwoWay}"
                        SelectedItems="{Binding SelectedAnswers, Mode=TwoWay}"
                        SelectionMode="Multiple"
                        x:Name="collectionView"
                        SelectionChanged="collectionView_SelectionChanged"
                        >
                        <CollectionView.ItemsLayout>
                            <LinearItemsLayout Orientation="Vertical"/>
                        </CollectionView.ItemsLayout>
                    <CollectionView.ItemTemplate>
                        <DataTemplate x:DataType="model:Answer">
                            <StackLayout Padding="10">
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup Name="CommonStates">
                                        <VisualState Name="Normal">
                                            <VisualState.Setters>
                                                <Setter TargetName="frame" Property="Frame.BackgroundColor" Value="{Binding AnswerColor}"/>
                                            </VisualState.Setters>
                                        </VisualState>
                                        <VisualState Name="Selected">
                                            <VisualState.Setters>
                                                <Setter TargetName="frame" Property="Frame.BackgroundColor" Value="{DynamicResource MainColor}"/>
                                                <Setter TargetName="label" Property="views:MyTextView.TextColor" Value="White"/>
                                            </VisualState.Setters>
                                        </VisualState>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>
                                <Frame CornerRadius="10" HasShadow="True" x:Name="frame" BackgroundColor="{Binding AnswerColor}">
                                    <views:MyTextView x:Name="label" LaTeX="{Binding Content}" />
                                </Frame>
                            </StackLayout>
                        </DataTemplate>
                    </CollectionView.ItemTemplate>
                </CollectionView>
                <!--</RefreshView>-->
                <StackLayout>
                    <Label x:Name="conditionLabel" TextColor="{DynamicResource AnswerColor}"/>
                    <Button x:Name="checkButton" Text="Проверить ответы" CornerRadius="10" Margin="10"
                                Command="{Binding CheckAnswersCommand}"/>
                </StackLayout>
            </StackLayout>
        </ScrollView>
    </RefreshView>
</ContentPage.Content>

结果: 1 part of screen 2 part of screen

不幸的是,这是一个已知问题,open issue

查看该线程以了解可能的解决方法。并跟踪修复它的任何进展。

底线:您必须手动 specify/calculate 高度。有多种方法可以做到,难度各不相同。主题提到了一些。您需要 Google 了解更多详情。

我喜欢的一个快速而肮脏的解决方案(如果可接受)是将 CollectionView 包装在 Grid 中,然后使用 RowDefinitions 强制为包含 CollectionView 的行指定多少高度,为其他所有内容指定多少高度。类似于:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="1*" />
        <RowDefinition Height="2*" />
    </Grid.RowDefinitions>

    <CollectionView Grid.Row="0" ...>
        ...
    </CollectionView>

    <StackLayout Grid.Row = "1" ...>
        ... everything that is below the CV ...
    </StackLayout>
 </Grid>

这会将第 0 行(包含 CollectionView)限制在屏幕的顶部 1/3。

您不应该按照官方文档中的描述在 Scrollview 中使用 Listview/CollectionView。

在 Scrollview 中有一个替代列表视图的方法。看下面的代码:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:ScrollViewDemos"
             x:Class="ScrollViewDemos.Views.ColorListPage"
             Title="ScrollView demo">
    <ScrollView>
        <StackLayout BindableLayout.ItemsSource="{x:Static local:NamedColor.All}">
            <BindableLayout.ItemTemplate>
                <DataTemplate>
                    <StackLayout Orientation="Horizontal">
                        <BoxView Color="{Binding Color}"
                                 HeightRequest="32"
                                 WidthRequest="32"
                                 VerticalOptions="Center" />
                        <Label Text="{Binding FriendlyName}"
                               FontSize="24"
                               VerticalOptions="Center" />
                    </StackLayout>
                </DataTemplate>
            </BindableLayout.ItemTemplate>
        </StackLayout>
    </ScrollView>
</ContentPage>

关注文档以获得更多支持: https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/scrollview