Android how to draw a border to a LinearLayout
Master System Design with Codemia
Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.
Introduction
The normal way to draw a border around a LinearLayout in Android is not to subclass the layout and paint manually. In most cases, you attach a shape drawable as the background and define the stroke there.
That approach is simple, reusable, and keeps the visual styling in resources instead of Java or Kotlin code. It is also the easiest way to combine border color, width, fill, and corner radius in one place.
Use a Shape Drawable as the Background
Create a drawable resource such as res/drawable/bordered_box.xml:
Then apply it to the LinearLayout:
This is the standard solution because it is declarative and easy to tweak later.
Why Background Drawables Are Better Than Manual Drawing
Beginners sometimes try to:
- add extra nested views just to fake a border
- override drawing methods for a simple rectangle
- use margins as if they were borders
Those approaches usually add complexity without any real benefit. A shape drawable is made for exactly this kind of job.
It also keeps the border reusable. The same @drawable/bordered_box can be applied to multiple layouts or even other view types.
Customize the Border
The drawable can control more than just the line:
- '
strokedefines width and color' - '
soliddefines the fill color' - '
cornersrounds the edges' - '
paddinggives content breathing room inside the border'
If you want only a transparent interior with a border:
If you want a thinner stroke:
This flexibility is why shape drawables are the usual answer for bordered containers in Android layouts.
State-Based Borders
If the border should change when pressed, selected, or focused, use a selector that points to different drawables. For example, a pressed border and a normal border can be switched automatically based on view state.
That is much cleaner than changing colors by hand in click listeners when the requirement is purely visual.
Material Components Note
If your screen uses Material components heavily, a MaterialCardView may be an even better fit than a raw LinearLayout, because it already supports stroke color and stroke width in a higher-level component.
But if the requirement is specifically "add a border to this LinearLayout," the shape drawable background remains the standard direct answer.
Keep Border and Content Spacing Separate
Another practical detail is to avoid confusing the drawable's internal padding with the view's external layout_margin. Padding controls the spacing inside the bordered box, while margin controls the spacing around it. Using both intentionally makes the final result look much cleaner.
Common Pitfalls
- Using margins to simulate a border. Margins create outside spacing, not a visible outline.
- Forgetting a
solidcolor or transparent fill and then being surprised by the default background behavior. - Hard-coding pixel widths instead of using
dp. - Creating extra nested layouts just to fake a border effect.
- Manually drawing borders in code when a simple XML drawable would be easier to maintain.
Summary
- The usual way to add a border to a
LinearLayoutis a shape drawable background with astroke. - Put the styling in
res/drawableand reference it from the layout XML. - Use
dpfor stroke width and radius so the result scales correctly across devices. - Add selectors if the border should change by state.
- Consider
MaterialCardViewif the UI already follows Material patterns and needs richer card-like styling.

