Xamarin 形成边距

Posted 2023-03-25

【中文标题】Xamarin 形成边距

【英文标题】：Xamarin Forms Margins

【发布时间】：2014-07-24 21:54:08

【问题描述】：

我试图在 Xamarin.Forms documentation 中找到一些类似的边距。有人知道我们有什么东西或填充物吗？

更新： 为了更好地理解什么是边距（它来自 MSDN for WPF）：

【问题讨论】：

如果您想添加分隔符，请看这里：***.com/questions/24102110/…

【参考方案1】：

终于！ Xamarin Forms 2.2.0 包括 Margins 支持！

Here are the docs 具有出色的视觉效果。

UPD @AUSTX_RJL 专用 保证金值是Thickness,，就像在任何其他 XAML 框架中一样。

您可以在 XAML 中设置Thickness，方法是设置一个、两个或四个以逗号或空格分隔的值： "1 2 3 4" 与 "1, 2, 3, 4" 相同并设置：

1 代表Left 2 代表Top 3 代表Right 4 代表Bottom

Thickness的字段

"1 2" 集：

Left 和 Right 字段为 1 Top 和 Bottom 字段为 2

"1" 为Thickness 的所有字段设置1

【讨论】：

这是真正的正确答案。只需更新到最新版本的 Xamarin.Forms。我可以确认 2.2.0.45 目前是一个稳定版本（不是预发布），Margin 属性似乎按预期工作：IE：所有 WPF 开发人员都习惯的方式。

这个答案没有说明边距值是多少，例如"1, 2, 3, 4" -- 定义每个参数。

@AUSTX_RJL 应该吗？

其实空格和逗号是有区别的。空格的顺序是 TRBL，而逗号的顺序是 LTRB。超级混乱。

【参考方案2】：

截至 2014 年 6 月 5 日，Xamarin.Forms 中没有边距。将您的内容包装在ContentView、Frame 或任何其他布局中，并使用Padding 属性。

【讨论】：

真可惜。有什么计划吗？

我支持他们。在布局引擎中实现边距是一件很麻烦的事，因为它给它添加了一个丑陋的层。边距可能（例如）作用于外部（外部）可用空间，而不会影响视图的原始大小。它涉及到引擎开发人员在不同的布局行为之间做出让步（是否允许 20% 的宽度包括边距等），并打破他们漂亮而简单的引擎。在 Xamarin.Forms 中实现它意味着处理所有平台布局 API 功能和行为。

对于投反对票深表歉意。有必要将此答案推到更新的、已接受的答案下方，以澄清现在有保证金支持。 （我最初没有注意到那个答案，因为它不在顶部。）

@ToolmakerSteve 没关系

【参考方案3】：

 StackLayout components = new StackLayout
        
            Orientation = StackOrientation.Vertical,
            Spacing=10,
            Padding = new Thickness (10, 10, 10, 20),
            Children = 
                new Label Text = "Hello",
                new Label Text = "World"
            
        ;  

使用 Spacing 属性，您可以在布局中的所有子视图之间添加空间。

使用 Padding 属性，您可以在布局的（左、上、右和下）位置添加空间。

如果您希望每个标签子视图具有不同的边距，您可以执行以下操作。 1）像这样创建和使用自定义标签：

using System;
using Xamarin.Forms;

namespace SharedViews


/// <summary>
/// Label propertis that will be rendered in native ios and native android Renderers.
/// </summary>
public class MyLabel : Label

    /// <summary>
    /// The x position of the label.
    /// </summary>
    public static readonly BindableProperty xProperty = BindableProperty.Create<MyLabel,int>(p => p.X,0);

    public int X
        get return (int)base.GetValue(xProperty);
        set base.SetValue(xProperty,value);
    

    /// <summary>
    /// The y position of the label.
    /// </summary>
    public static readonly BindableProperty yProperty = BindableProperty.Create<MyLabel,int>(p => p.Y,0);

    public int Y
        get return (int)base.GetValue(yProperty);
        set base.SetValue(yProperty,value);
    

   

2) 创建您的 iOS 和 android 渲染器

Android 渲染器：

using System;
using Android.Widget;
using Android.Graphics;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

[assembly: ExportRenderer (typeof (MyLabel), typeof (MyLabelRenderer))]
namespace ChessGame.Android
/// <summary>
/// Android label renderer:
/// here we set native Android label properties that can't be accessed in xamarin label.
/// </summary>
public class MyLabelRenderer : LabelRenderer

    protected override void OnElementChanged (ElementChangedEventArgs<Label> e) 
        base.OnElementChanged (e);
        MyLabel element = (MyLabel)this.Element;
        var nativeLabelView = (TextView)Control;
        nativeLabelView.SetX (element.X);
        nativeLabelView.SetY (element.Y);
    
  

【讨论】：

所有这些都是为了孩子的布局。边距以其他方式工作。例如，如果有边距，您将能够为 StackLayout 中的不同子项获得不同的剩余空间。或孩子之间的不同间距。如果没有边距，您必须将每个孩子放到单独的容器中才能达到。

@ad1Dima 是的，你是对的，间距和填充适用于所有子视图。因此，如果您希望每个标签子视图具有不同的边距，您可以使用 LabelRenderer。我将编辑答案以显示这一点。

【参考方案4】：

布局支持Padding 属性，该属性适用于布局中包含的子项。我认为这是最接近他们目前支持的保证金概念

  var stackLayout = new StackLayout 
    Padding = new Thickness (10, 10, 10, 20),
    Children = 
      new Label Text = "Hello",
      new Label Text = "World"
    
  

【讨论】：

我知道填充。但是，如果我们谈论您的样本，我想在两个标签之间设置间距。当然，我可以将每个标签放在布局中，但这会增加复杂性。

【参考方案5】：

这是 Xamarin.Forms.View 的扩展，用于向任何项目添加填充：

public static class XamarinFormsUtil

    public static View WithPadding(this View view, double all)
    
        return WithPadding (view, all, all, all, all);
    

    public static View WithPadding(this View view, double left, double top, double right, double bottom)
    
        return new Frame () 
            Content = view,
            Padding = new Thickness(left, top, right, bottom)
        ;
    

引用这个静态类后，您现在可以在构造函数中为您的页面创建内容，为方便起见，使用 WithPadding：

Content = new StackLayout () 
    Orientation = StackOrientation.Vertical,
    Children = 
        welcome.WithPadding(10),
        stars.WithPadding(10),
        starCount.WithPadding(10)
    
;

【讨论】：

如我所见，这是填充而不是边距。我说的对吗？

【参考方案6】：

边距 - 控制控件之间的间距。 Padding - 控制父控件与其子控件之间的间距。

正如@ad1dima 所说，Xamarin forms 2.2（4 月 27 日发布）引入了利润。您可以在 https://developer.xamarin.com/guides/xamarin-forms/user-interface/layouts/margin-and-padding/

找到有关 margin 属性的文档