web-dev-qa-db-fra.com

Différence entre le rembourrage et la marge d'une vue

Quelle est la différence entre une marge de View et un rembourrage?

548
Ragunath Jawahar

Pour m'aider à me rappeler la signification de rembourrage , je pense à un grand manteau avec beaucoup de rembourrage en coton épais . Je suis à l'intérieur de mon manteau, mais mon manteau matelassé et moi sommes ensemble. Nous sommes une unité.

Mais pour rappeler marge , je pense à " Hé, donnez-moi une marge! "C'est l'espace vide entre toi et moi. Ne pas entrer dans ma zone de confort - ma marge.

Pour que ce soit plus clair, voici une image du remplissage et de la marge dans un TextView:

enter image description here

mise en page XML pour l'image ci-dessus

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:orientation="vertical" >

    <TextView
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_margin="10dp"
        Android:background="#c5e1b0"
        Android:textColor="#000000"
        Android:text="TextView margin only"
        Android:textSize="20sp" />

    <TextView
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_margin="10dp"
        Android:background="#f6c0c0"
        Android:textColor="#000000"
        Android:text="TextView margin only"
        Android:textSize="20sp" />

    <TextView
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:background="#c5e1b0"
        Android:padding="10dp"
        Android:textColor="#000000"
        Android:text="TextView padding only"
        Android:textSize="20sp" />

    <TextView
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:background="#f6c0c0"
        Android:padding="10dp"
        Android:textColor="#000000"
        Android:text="TextView padding only"
        Android:textSize="20sp" />

    <TextView
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_margin="10dp"
        Android:background="#c5e1b0"
        Android:textColor="#000000"
        Android:padding="10dp"
        Android:text="TextView padding and margin"
        Android:textSize="20sp" />

    <TextView
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_margin="10dp"
        Android:background="#f6c0c0"
        Android:textColor="#000000"
        Android:padding="10dp"
        Android:text="TextView padding and margin"
        Android:textSize="20sp" />

    <TextView
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:background="#c5e1b0"
        Android:textColor="#000000"
        Android:text="TextView no padding no margin"
        Android:textSize="20sp" />

    <TextView
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:background="#f6c0c0"
        Android:textColor="#000000"
        Android:text="TextView no padding no margin"
        Android:textSize="20sp" />

</LinearLayout>

Apparenté, relié, connexe

541
Suragch

Le bourrage est l'espace situé à l'intérieur de la bordure, entre la bordure et le contenu de la vue. Notez que le rembourrage fait complètement le tour du contenu: il y a du rembourrage en haut, en bas, à droite et à gauche (qui peuvent être indépendants).

Les marges sont les espaces situés en dehors de la bordure, entre la bordure et les autres éléments adjacents à cette vue. Dans l'image, la marge est la zone grise à l'extérieur de l'objet entier. Notez que, tout comme le rembourrage, la marge contourne complètement le contenu: il existe des marges en haut, en bas, à droite et à gauche.

Une image dit plus de 1000 mots (extraits de Margin Vs Padding - CSS Properties ):

alt text

574
Cristian

Le rembourrage est à l'intérieur d'une vue.

La marge est en dehors d'une vue.

Cette différence peut être pertinente pour les propriétés d’arrière-plan ou de taille.

72
Floern

Le rembourrage est dans la vue, la marge est à l'extérieur. Le rembourrage est disponible pour toutes les vues. Selon la vue, il peut y avoir ou non une différence visuelle entre le remplissage et la marge.

Pour les boutons, par exemple, l’image d’arrière-plan du bouton caractéristique comprend le remplissage, mais pas la marge. En d'autres termes, l'ajout de rembourrage rend le bouton plus visuellement plus grand, tandis que l'ajout de marges élargit l'espace entre le bouton et le contrôle suivant.

Par contre, pour TextViews, l'effet visuel du remplissage et de la marge est identique.

La disponibilité de la marge est déterminée par le conteneur de la vue et non par la vue elle-même. Dans LinearLayout la marge est prise en charge, dans AbsoluteLayout (considéré comme obsolète maintenant) - non.

41
Seva Alekseyev

L'image ci-dessous vous permettra de comprendre le rembourrage et les marges.

enter image description here

23
Akshay Paliwal

Parfois, vous pouvez obtenir le même résultat en jouant uniquement avec la marge de remplissage OR. Exemple :

Say View X contient la vue Y (alias: La vue Y est dans la vue X).

-View Y avec Marge = 30 OR View X avec Padding = 30 donnera le même résultat: View Y aura un décalage de 30.

7
Akli

Le rembourrage est l'espace situé à l'intérieur de la bordure entre la bordure et le contenu réel de l'image ou de la cellule. Les marges sont les espaces situés à l'extérieur de la bordure, entre la bordure et les autres éléments adjacents à cet objet.

7
raja

Rembourrage signifie espace entre le widget et le cadre d'origine du widget. Mais la marge est un espace entre le cadre d'origine du widget et les limites du cadre d'un autre widget . enter image description here .

7
Ananthakrishnan

Rembourrage
Le rembourrage est à l'intérieur d'une vue. Par exemple, si vous donnez Android:paddingLeft=20dp, les éléments de la vue s'organiseront avec 20dp width à partir de la gauche. Vous pouvez également utiliser paddingRight , paddingBottom, paddingTop qui doivent donner un remplissage de droite, de bas et de haut respectivement.

marge
La marge est en dehors d’un View. Par exemple, si vous donnez Android:marginLeft=20dp, la vue sera organisée après 20dp de gauche.

7
jinosh

Supposons simplement que vous ayez un bouton dans une vue et que la taille de la vue soit de 200 sur 200, de 50 à 50 et que le titre du bouton soit HT. Maintenant, la différence entre marge et remplissage est que vous pouvez définir la marge du bouton dans la vue, par exemple 20 à gauche, 20 à partir du haut, et le remplissage ajustera la position du texte dans le bouton ou la vue, etc., par exemple. , la valeur de remplissage est 20 à partir de la gauche, il va donc ajuster la position du texte.

3
Steve

La marge fait référence à l'espace supplémentaire à l'extérieur d'un élément. Le rembourrage fait référence à l'espace supplémentaire dans un élément. La marge est l'espace supplémentaire autour du contrôle. Le rembourrage est un espace supplémentaire à l'intérieur du contrôle.

Il est difficile de voir la différence avec la marge et le rembourrage avec un remplissage blanc, mais avec un remplissage coloré, vous pouvez le voir très bien.

2
Pawan Kumar Singh

En mots simples:
padding change la taille de la boîte (avec quelque chose).
margin modifie l'espace entre les différentes cases

1
user4702646

En termes simples:

  1. Rembourrage - crée un espace à l'intérieur de la bordure de la vue.
  2. Marge - crée un espace en dehors de la vue.
0
mohammed nathar

En plus de toutes les bonnes réponses ci-dessus, une autre différence est que padding augmente la zone cliquable d'une vue, alors que les marges ne le font pas . Ceci est utile si vous avez une petite image cliquable mais que vous voulez que le gestionnaire de clics pardonne.

Voir, par exemple, cette image de ma mise en page avec un ImageView (l'icône Android) où je règle le paddingBotton sur 100dp (l'image est le lanceur d'actions) mipmap ic_launcher). Avec le gestionnaire de clics attaché, j'ai pu cliquer de manière à l'extérieur et au-dessous de l'image tout en enregistrant un clic.

enter image description here

0
scorpiodawg