Margin in Android Layout

Margin in Android Layout

In simple terms, Margin in Android is outside the view. A View can be a Button, EditText, TextView, etc. Here, we will learn what are margins and how it can be worked easily on Android Layout. Demo app will be shown to make it easy for a Beginner to understand.

Let’s start with the following illustration, explaining the concept of Margins in Linear Layout. Here the text Studyopedia, is our TextView text. Whereas, the Gray rectangular Box is the space for our View TextView. A widget in Android occupies a rectangular space,

Margins in Android

Note:

If the minSdkVersion is 17 or more, then
Use layout_marginStart instead of layout_marginLeft attribute, and
Use layout_marginEnd instead of  layout_marginRight attribute.

If the minSdkVersion is 16 or less, then
Use both older layout_marginLeft and layout_marginStart attribute, and
layout_marginRight and layout_marginEnd attribute.

Here’s the demo code with Button UI widget, which will be discussed in a broader way later, with more examples,

Attributes

Here are the various attributes of margins in Android,

MethodDescription
android:layout_width Sets the width of the view.
android:layout_heightSets the height of the view.
android:layout_marginAdd extra space on the left, top, right and bottom sides of the view.
android:layout_marginLeft Add extra space on the left side of the view.
android:layout_marginTopAdd extra space on the top side of the view.
android:layout_marginRightAdd extra space on the right side of this view.
android:layout_marginBottomAdd extra space on the bottom side of the view.
android:layout_marginStartAdd extra space on the start side of the view.
android:layout_marginEndAdd extra space on the end side of the view.
android:layout_marginHorizontalAdd extra space on the left and right sides of this view.
android:layout_marginVerticalAdd extra space on the top and bottom sides of this view.

Example

Time for some examples with the emulator output,
Let’s say, you have the following code for TextView, without margin,

Here’s the output,

Android Without Margin

Let’s now work with the following code for TextView with margins.

We are adding the following to our code: android:layout_margin=”100dp”,

Here’s the output,

Android Margin Output

Let’s move further and now add right margin. On adding, it will give an extra space on the right side of the view. We are adding, android:layout_marginRight=”100dp” and difference is easily visible below,

Here’s the output, with extra space on the right, since we added right margin,

Android Right Margin Output

Let’s move further and now add left margin. On adding, it will give an extra space on the left side of the view. We are adding, android:layout_marginLeft=”100dp” and difference is easily visible below,

Here’s the output, with an extra space on the left, since we added left margin,

Android Left Margin Output

Let’s move further and now add top margin. On adding, it will give an extra space on the top side of the view. We are adding, android:layout_marginTop=”100dp” and difference is easily visible below,

Here’s the output, with extra space on the top, since we added top margin,

Android Top Margin Output

In this lesson, we learned about Margins in Android Layout. In the next lesson, we will learn how to work with Padding in Android.

Android Layouts
Padding in Android Layout
Studyopedia Editorial Staff
Studyopedia Editorial Staff
[email protected]

We work to create free tutorials for all.

No Comments

Post A Comment