Difference between margin and padding in android


Download difference between padding and margin sample

Most of the beginners miss-understand the difference between margin and padding. android margin and padding is similar to css margin and padding. So, lets try to understand android:layout_margin and android:layout_padding with an example.

Margin | android:layout_margin

If View/ViewGroup need to enforce some distance from other View/ViewGroup then that View/ViewGroup should use android:layout_margin. Basically, margin is a way for a View/ViewGroup to enforce specified distance or space from other View/ViewGroup. For example, If a view need 20 dp space from its right View/ViewGroup then this view will set android:layout_marginRight="20dp"

In android there are these 5 type of margin:

  • android:layout_margin : To enforce space from left, right, top as well as bottom side of the view
  • android:layout_marginLeft : To enforce space from left side of the view
  • android:layout_marginRight : To enforce space from right side of the view
  • android:layout_top : To enforce space from top side of the view
  • android:layout_bottom : To enforce space from botton side of the view

Example

Visual representation of above layout file is:

android margin and padding difference


As you can see, there is a linear layout as root viewGroup without any margin. The parent linear layout has 5 textView as children. Now, lets see what was the effect of margin in these views...

  • First textView has no margin, so it's top, left and right sides are matching with parent without any space.
  • Second textView has android:layout_margin="20dp" so, second textView enforces an space of 20 dp from top, left, right and bottom sides of other view.
  • Third textView has android:layout_marginTop="20dp", so it enforced an space of 20 dp from top side view that is Second view.

    Second textView also has margin of 20 dp, so total space between bottom of Second textView and top of third textView becomes 40dp.

  • Fourth textView has android:layout_marginLeft and android:layout_marginTop equals to 20dp so, it enforced 20 dp space from left side of its parent and enforced 20 dp space from top side to third textView

    In fourth textView, there was no marginRight set so there is no space between right side of fourth textView to its parent.

  • Fifth textView has set marginLeft, marginRight and marginTop so it has enforced specified distance in left, right and top side of the view.

Padding | android:padding

Padding is a way of pushing content of a view to specified direction of view's own boundary. In simple words, if I am saying left padding of a view is 20 dp, that means push the content of that view 20 dp from it's left boundary.

Like margin, there is 5 types of padding in android...

  • android:padding : To push content of a view to specified space from the left, right, top and bottom boundary of the view.
  • android:paddingLeft : To push content of a view to specified space from the left boundary of the view.
  • android:paddingRight : To push content of a view to specified space from the right boundary of the view.
  • android:paddingTop : To push content of a view to specified space from the top boundary of the view.
  • android:paddingBottom : To push content of a view to specified space from the bottom boundary of the view.

Example

Visual representation of above layout file is:

android margin and padding difference

Now let's look closely on padding demo image...

  • First textView has no padding, so it's content is aligned to top left inner boundary of the view.
  • Second textView has android:padding="10dp" so, content of second textView was pushed 10 dp space from top and 10 dp space from left boundary of the view.

    Please note that content has no effect from bottom and right boundary of the view because it has already more space than 10 dp from left and bottom boundary of the view .

  • Third textView has android:padding="10dp", so it's content was pushed 10dp from the top boundary of the view.
  • Fourth textView has android:paddingLeft and android:paddingTop equals to 10dp so, it's content was pushed 10 dp from left and top boundary of the view.
  • Fifth textView has set paddingLeft, paddingRight and paddingTop so content of the view was pushed 10dp top and left boundary of the view.

Conclusion

So, after discussing this topic, our conclusion is the difference between margin and padding is that margin keeps the other views away from a view and padding pushes its contents away from view’s own inner boundaries.

Share & Like

Tutorial topics

About ApnaTutorials.com

ApnaTutorials.com is for Java, J2ee, Html5 and android developers. All tutorials are well explained and are easy to understand. We have tested every tutorials on our developement environment before posting it in public domain.