Android
LinearLayout
UI Design
Border
XML

How to draw border on just one side of a linear layout?

Master System Design with Codemia

Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.

Introduction

Adding a border to only one side of a LinearLayout is a little tricky because a simple shape drawable stroke applies to all four sides. To get only one edge, you usually need either a separate thin view or a layered drawable that simulates a single border.

The easiest solution: add a 1dp child view

For many layouts, the simplest and most maintainable approach is to add a thin View that acts as the border.

xml
1<LinearLayout
2    xmlns:android="http://schemas.android.com/apk/res/android"
3    android:layout_width="match_parent"
4    android:layout_height="wrap_content"
5    android:orientation="vertical">
6
7    <TextView
8        android:layout_width="match_parent"
9        android:layout_height="wrap_content"
10        android:padding="16dp"
11        android:text="Content" />
12
13    <View
14        android:layout_width="match_parent"
15        android:layout_height="1dp"
16        android:background="@android:color/darker_gray" />
17</LinearLayout>

This creates a bottom border. For a top border, move the View to the top. For a left or right border, switch to a horizontal layout or wrap the content in another container.

It is explicit, easy to style, and avoids drawable tricks.

Using a layer-list background

If you want the border as part of the background, use a layer-list with one full background layer and one inset layer that leaves a strip visible on one side.

res/drawable/bottom_border.xml:

xml
1<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
2    <item>
3        <shape android:shape="rectangle">
4            <solid android:color="#DDDDDD" />
5        </shape>
6    </item>
7
8    <item android:bottom="1dp">
9        <shape android:shape="rectangle">
10            <solid android:color="#FFFFFF" />
11        </shape>
12    </item>
13</layer-list>

Apply it as the background:

xml
1<LinearLayout
2    android:layout_width="match_parent"
3    android:layout_height="wrap_content"
4    android:background="@drawable/bottom_border"
5    android:orientation="vertical" />

The first layer is the border color. The second layer covers almost all of it except the bottom strip, which remains visible as the border.

When a custom drawable makes sense

If the border needs to be dynamic, such as changing thickness or side at runtime, create a shape programmatically.

kotlin
1val drawable = GradientDrawable().apply {
2    shape = GradientDrawable.RECTANGLE
3    setColor(Color.WHITE)
4    setStroke(0, Color.TRANSPARENT)
5}
6
7linearLayout.background = drawable

For a truly single-side runtime border, it is often still easier to add a dedicated View rather than fight the limitations of stroke drawing.

Why stroke alone does not solve it

This does not produce a one-sided border:

xml
1<shape xmlns:android="http://schemas.android.com/apk/res/android">
2    <stroke
3        android:width="1dp"
4        android:color="#999999" />
5</shape>

It draws all edges. That is why many examples online are misleading when they imply that stroke plus padding creates a genuine one-side border. What they are often doing is covering part of the shape or using nested backgrounds.

Choosing between the two approaches

Use a thin child View when the layout is simple and you want the most readable solution. Use a layer-list when the border should behave as part of the background and you want to avoid extra layout nodes.

In most UI codebases, the extra View is completely acceptable and often easier for the next developer to understand.

Common Pitfalls

  • Using a shape stroke and expecting it to affect only one side.
  • Creating overly complex nested layouts just to simulate a 1dp line.
  • Forgetting that a bottom border implemented as a child View takes up layout space.
  • Mixing border color and background color incorrectly in a layer-list, making the line invisible.
  • Overengineering the solution when a simple divider View would be clearer.

Summary

  • A plain stroke on a drawable draws all four sides.
  • The simplest one-side border is often a thin View placed on the desired edge.
  • A layer-list can simulate a single border when you want it embedded in the background.
  • For dynamic cases, programmatic drawables are possible, but still not always the clearest choice.
  • Prefer the simplest solution that makes the one-sided border obvious in the layout.

Course illustration
Course illustration

All Rights Reserved.