删除 Xamarin.Forms 中 ListView GroupHeaders 之间不需要的间距

Question

我想删除ListView组标题之间的间距。

我想摆脱那个空间，让我的UI更紧凑。 我尝试了所有方法，从设置Spacing=0 、 RowSpacing=0 、 ItemSpacing=0等。现在真的不知道该怎么做。

这是列表视图GroupHeader模板和ListView一些其他设置

private void SetListViewDataAsync()
{
    string PageTerm = GradesPage.PageTermGlobal;
    List<Data> ItemSourceData = Globals.Dataset.FindAll(item => item.TermCode == PageTerm);

    listView.ItemsSource = ItemSourceData;
    listView.AllowGroupExpandCollapse = true;

    listView.Loaded += ListView_Loaded;
    listView.PropertyChanged += ListView_PropertyChanged;

    listView.GroupExpanding += ListView_GroupExpanding;
    listView.GroupCollapsing += ListView_GroupCollapsing;

    listView.ItemSpacing = 0;

    listView.ItemSize = 200;
    listView.GroupHeaderSize = 80;

    SetItemTemplate();

    listView.DataSource.GroupDescriptors.Add(new GroupDescriptor()
    {
        PropertyName = "CourseName",
        KeySelector = (object obj1) =>
        {
            var item = (obj1 as Data);
            return item;
        }
    });
    listView.GroupHeaderTemplate = new DataTemplate(() =>
    {
        /*
        * Remove mail text, change name to a mailto:
        * Remove vertical whitespacing.
        * 
        */

        var MainGrid = new Grid() { VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.FillAndExpand, HeightRequest = 50 };

        MainGrid.BackgroundColor = Xamarin.Forms.Color.FromRgba(0, 0, 0, 0.60);

        MainGrid.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(1, GridUnitType.Star) });
        MainGrid.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(1, GridUnitType.Star) });
        MainGrid.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(1, GridUnitType.Star) });

        Binding binding1 = new Binding("Key");
        binding1.Converter = new GroupHeaderConverter();
        binding1.ConverterParameter = 0;

        var label = new Label() { VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Start, FontSize = 17, FontAttributes = FontAttributes.Bold, TextColor = Color.White, Margin = new Thickness(5, 0, 0, 0) };
        label.SetBinding(Label.TextProperty, binding1);

        Binding binding4 = new Binding("Key");
        binding4.Converter = new GroupHeaderConverter();
        binding4.ConverterParameter = 3;
        var classType = new Label() { VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center, FontSize = 10, TextColor = Color.White };
        classType.SetBinding(Label.TextProperty, binding4);


        var stackLayout = new StackLayout();
        stackLayout.Orientation = StackOrientation.Horizontal;
        stackLayout.Children.Add(label);
        stackLayout.Children.Add(classType);


        Binding binding2 = new Binding("Key");
        binding2.Converter = new GroupHeaderConverter();
        binding2.ConverterParameter = 1;

        Frame border = new Frame() { Padding = 0, WidthRequest = 75, HeightRequest = 50, Margin = 10, VerticalOptions = LayoutOptions.CenterAndExpand, HorizontalOptions = LayoutOptions.End };
        StackLayout score = new StackLayout() { VerticalOptions = LayoutOptions.CenterAndExpand, HorizontalOptions = LayoutOptions.Center };
        Label scoreLabel = new Label() { TextColor = Color.White, FontAttributes = FontAttributes.Bold, VerticalOptions = LayoutOptions.Center, VerticalTextAlignment = TextAlignment.Center };
        scoreLabel.SetBinding(Label.TextProperty, binding2);
        score.Children.Add(scoreLabel);
        Binding binding3 = new Binding("Key");
        binding3.Converter = new GroupHeaderConverter();
        binding3.ConverterParameter = 2;
        border.SetBinding(BackgroundColorProperty, binding3);
        border.Content = score;

        MainGrid.Children.Add(stackLayout);
        Grid.SetColumn(stackLayout, 0);
        Grid.SetColumnSpan(stackLayout, 2);

        MainGrid.Children.Add(border);
        Grid.SetColumn(border, 2);
        return MainGrid;
    });

}

这是ListView的ItemTemplate

private void SetItemTemplate()
{
    listView.ItemTemplate = new DataTemplate(() => {


        SfEffectsView effectsView = new SfEffectsView();
        effectsView.TouchDownEffects = SfEffects.Ripple;
        effectsView.CornerRadius = new Thickness(25, 0);

        var grid = new StackLayout() { VerticalOptions = LayoutOptions.Start };
        grid.BackgroundColor = Xamarin.Forms.Color.FromRgba(0, 0, 0, 0.35);
        SfListView embeddedView = new SfListView() { VerticalOptions = LayoutOptions.Start };


        embeddedView.AutoFitMode = AutoFitMode.Height;
        embeddedView.LayoutManager = new GridLayout();
        embeddedView.SelectionMode = Syncfusion.ListView.XForms.SelectionMode.None;

        embeddedView.LayoutManager.SetBinding(GridLayout.SpanCountProperty, new Binding("NoOfCat"));
        embeddedView.SetBinding(SfListView.ItemsSourceProperty, new Binding("CatInfoSet"));
        embeddedView.ItemTemplate = new DataTemplate(() => {
            var MainGrid = new StackLayout() { VerticalOptions = LayoutOptions.Start };

            SfCircularProgressBar circularProgressBar = new SfCircularProgressBar() { VerticalOptions = LayoutOptions.End, HorizontalOptions = LayoutOptions.Center };
            circularProgressBar.SetBinding(ProgressBarBase.ProgressProperty, new Binding("Percent"));
            circularProgressBar.AnimationDuration = 0;
            circularProgressBar.IndicatorOuterRadius = 0.7;
            circularProgressBar.IndicatorInnerRadius = 0.6;

            Binding bind = new Binding("Percent");
            bind.Converter = new ColorGradientConverter();
            circularProgressBar.SetBinding(ProgressBarBase.ProgressColorProperty, bind);

            Grid content = new Grid();
            content.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Star) });
            Label score = new Label() { FontAttributes = FontAttributes.Bold, TextColor = Color.White };
            score.BindingContext = circularProgressBar;
            Binding scoreBinding = new Binding();
            scoreBinding.Path = "Progress";
            scoreBinding.StringFormat = "{0}%";
            score.SetBinding(Label.TextProperty, scoreBinding);
            score.HorizontalTextAlignment = TextAlignment.Center;
            score.VerticalOptions = LayoutOptions.Center;
            score.TextColor = Color.White;
            score.FontSize = 14;
            content.Children.Add(score);
            circularProgressBar.Content = content;


            Label label = new Label() { HorizontalOptions = LayoutOptions.Center, VerticalOptions = LayoutOptions.Start, FontAttributes = FontAttributes.Bold, FontSize = 14, TextColor = Color.White };
            label.SetBinding(Label.TextProperty, new Binding("Description"));

            MainGrid.Children.Add(circularProgressBar);
            MainGrid.Children.Add(label);

            return MainGrid;

        });
        grid.Children.Add(embeddedView);

        Label l = new Label() { FontAttributes = FontAttributes.Bold, VerticalOptions = LayoutOptions.End, FontSize = 13, TextColor = Color.White, Margin = new Thickness(5, 0, 0, 0) };
        l.SetBinding(Label.TextProperty, new Binding("TeachersName"));
        grid.Children.Add(l);
        Label l2 = new Label() { FontAttributes = FontAttributes.Italic, VerticalOptions = LayoutOptions.Center, FontSize = 12, TextColor = Color.White, Margin = new Thickness(5, 0, 0, 5) };
        Binding periodB = new Binding("Period");
        periodB.StringFormat = "Period {0}";
        l2.SetBinding(Label.TextProperty, periodB);
        grid.Children.Add(l2);

        effectsView.Content = grid;
        return effectsView;
    });
}

Answer 1

只是一种感觉：

在您设置的SetListViewDataAsync()方法中：

listView.GroupHeaderSize = 80;

但另一方面，当您为listView.GroupHeaderTemplate设置值时，您声明：

var MainGrid = new Grid() 
    { 
        VerticalOptions = LayoutOptions.Center, 
        HorizontalOptions = LayoutOptions.FillAndExpand, 
        HeightRequest = 50 
    };

这意味着您告诉ListView GroupHeaderSize应该设置为80的值，然后告诉GroupeHeaderTemplate它的大小应该设置为50 ，并且视图要垂直居中。

不知道，但它可能是你所看到的，额外的空间仅仅是那些80-50=30台被设置为15单位的顶部和15 ，在你的组头的按钮。

如果是这种情况，有多种方法可以解决该问题，其中一种方法是将GroupHeaderSize从80更改为50 ，即更改您的代码，例如：

listView.GroupHeaderSize = 50;

希望这可以帮助！