web-dev-qa-db-fra.com

Xamarin Forms Margins

J'essaie de trouver des marges analogiques dans Xamarin.Forms documentation . Est-ce que quelqu'un sait qu'il y a quelque chose ou des rembourrages est tout ce que nous avons?

Mise à jour: Pour une meilleure compréhension de ce qu'est la marge (c'est de MSDN pour WPF): enter image description here

26
ad1Dima

Enfin! Xamarin Forms 2.2. inclut Marges support!

Voici les documents avec un super visuel. enter image description here

[~ # ~] upd [~ # ~] Spécial pour @AUSTX_RJL La valeur de la marge est Thickness, comme dans tout autre framework XAML.

Vous pouvez définir Thickness en XAML en définissant une, deux ou quatre valeurs séparées par une virgule ou un espace: "1 2 3 4" est identique à "1, 2, 3, 4" et ensembles:

  • 1 pour Left
  • 2 pour Top
  • 3 pour Right
  • 4 pour Bottom

Champs de Thickness

"1 2" ensembles:

  • 1 pour les champs Left et Right
  • 2 pour les champs Top et Bottom

"1" définit 1 pour tous les champs de Thickness

24
ad1Dima

Depuis le 06/06/2014, il n'y a pas de marge dans Xamarin.Forms. Enveloppez votre contenu dans ContentView, Frame ou toute autre disposition, et utilisez la propriété Padding.

15
 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"}
            }
        };  

À l'aide de la propriété Espacement, vous pouvez ajouter de l'espace entre toutes les vues enfants dans la mise en page.

En utilisant la propriété Padding, vous pouvez ajouter de l'espace dans les positions (gauche, haut, droite et bas) de la mise en page.

Si vous souhaitez que chaque vue enfant d'étiquette ait une marge différente, vous pouvez procéder comme suit. 1) Créez et utilisez une étiquette personnalisée comme celle-ci:

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) Créez votre iOS et vos rendus Android

Rendu 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);
    }
  }
}
12
Ahmed Hesham

Les mises en page prennent en charge une propriété Padding qui s'applique aux enfants contenus dans la mise en page. Je pense que c'est le plus proche d'un concept de marge qu'ils soutiennent actuellement

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

Voici une extension de Xamarin.Forms.View pour ajouter un remplissage à n'importe quel élément:

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)
        };
    }
}

Avec cette classe statique référencée, vous pouvez maintenant créer le contenu de votre page à l'intérieur du constructeur, en utilisant WithPadding pour plus de commodité:

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

Marges - contrôlez l'espace entre les commandes.
Padding - contrôle l'espacement entre un contrôle parent et ses contrôles enfants.

Comme l'a déclaré @ ad1dima, les formulaires Xamarin 2.2 (publiés le 27 avril) ont introduit des marges. Vous pouvez trouver de la documentation sur la propriété margin à https://developer.xamarin.com/guides/xamarin-forms/user-interface/layouts/margin-and-padding/

1
lyndon hughey