如何在 MasterDetail 页面上的项目之间添加空格？答案

【问题标题】：How to add space between items on MasterDetail Page?如何在 MasterDetail 页面上的项目之间添加空格？
【发布时间】：2017-04-05 00:30:42
【问题描述】：

我想知道如何使项目分开，而不是彼此非常接近。现在，每个项目在 iOS 上都太接近了。我尝试在 ListView 和 StackLayout 上设置 Margin 和 Space，但每个项目之间的空间没有改变。为了增加空间，我发现我需要对图像单元做一些事情。图像单元格继承自文本单元格，但没有设置边距或空格的属性。有谁知道这个技巧吗？

public MasterPageCS ()
{
    var masterPageItems = new List<MasterPageItem> ();
    masterPageItems.Add (new MasterPageItem {
        Title = "Contacts",
        IconSource = "contacts.png",
        TargetType = typeof(ContactsPageCS)
    });
    masterPageItems.Add (new MasterPageItem {
        Title = "TodoList",
        IconSource = "todo.png",
        TargetType = typeof(TodoListPageCS)
    });
    masterPageItems.Add (new MasterPageItem {
        Title = "Reminders",
        IconSource = "reminders.png",
        TargetType = typeof(ReminderPageCS)
    });

    listView = new ListView {
        ItemsSource = masterPageItems,
        ItemTemplate = new DataTemplate (() => {
            var imageCell = new ImageCell ();   //This one!!!!
            imageCell.SetBinding (TextCell.TextProperty, "Title");
            imageCell.SetBinding (ImageCell.ImageSourceProperty, "IconSource");
            return imageCell;
        }),
        VerticalOptions = LayoutOptions.FillAndExpand,
        SeparatorVisibility = SeparatorVisibility.None
    };

    Padding = new Thickness (0, 40, 0, 0);
    Icon = "hamburger.png";
    Title = "Personal Organiser";
    Content = new StackLayout {
        VerticalOptions = LayoutOptions.FillAndExpand,
        Children = {
            listView
        }
    };
}

【问题讨论】：

标签： xamarin.forms

【解决方案1】：

有人问类似问题：link

使用ViewCell，这样你就可以控制布局和间距，内置的布局模板只对基本的东西有用。

这里有一个使用 ViewCell 的示例。

Adding padding inside ViewCell xamarin

我的建议是在可能的情况下使用 Grid 进行自定义布局，以获得更好的性能和更少的跨平台麻烦，stacklayouts 可能会在 iOS 中导致数据模板出现问题，尤其是高度为 Auto。

如果您使用 TextCell 和 ImageCell，那么 Forms 会为您提供最佳猜测。

此外，如果您为 MasterPageItem 子项使用 Grid，请将 Grid 中的 RowSpacing 设置为 0，然后您在数据模板中设置的边距才会开始按预期工作。

【讨论】：