Android Academy · Lesson

Layouts & Views

Design UIs with XML layouts. Use ConstraintLayout, LinearLayout, and common views like TextView, Button, ImageView, and EditText.

Lesson 3 of 711 steps

Layouts & Views is a free Android Academy lesson on CoddyKit. This is lesson 3 of 7. Any 3 lessons of this learning path are free to read in full — after that, CoddyKit PRO unlocks every lesson, plus hands-on practice with a built-in code editor and a 24/7 AI tutor. It is part of the Android Academy learning path, and your progress syncs across the web and the CoddyKit app. The Android Academy course includes 7 lessons in total.

Building UIs with XML

Android UIs are defined in XML layout files stored in res/layout/. The layout describes the structure and appearance of your screen — which views are shown and where.

Your Kotlin code then inflates this layout and interacts with the views at runtime.

Common View Types

The most frequently used View widgets:

TextView — displays text
EditText — text input field
Button — clickable button
ImageView — displays an image
CheckBox — toggle on/off
Switch — on/off toggle (Material)

ConstraintLayout

ConstraintLayout is the recommended layout for most screens. It lets you position views relative to each other or the parent using constraints — like connecting anchor points.

Flat hierarchy — no nested layouts needed
Flexible — handles any screen size
Used by default in new Android Studio projects

ConstraintLayout XML

A TextView centered on screen in ConstraintLayout:

<!-- res/layout/activity_main.xml -->
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/tvTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello Android!"
        android:textSize="24sp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

LinearLayout

LinearLayout arranges views in a single row or column:

android:orientation="vertical" — stack views top to bottom
android:orientation="horizontal" — arrange side by side
android:layout_weight — distribute remaining space proportionally

Simple and predictable, but avoid deep nesting.

Key Layout Attributes

Every View has these essential attributes:

layout_width / layout_height: match_parent, wrap_content, or a fixed dp value
id: used to reference the view in Kotlin
margin: space outside the view
padding: space inside the view

Use dp for sizes (density-independent pixels) and sp for text sizes.

ScrollView

When content is taller than the screen, wrap it in a ScrollView:

Can contain only one direct child (usually a LinearLayout)
Vertical scrolling by default
Use HorizontalScrollView for horizontal scrolling

For long dynamic lists, use RecyclerView instead — it's more efficient.

Finding Views in Code

Two ways to access views in your Kotlin code:

findViewById(R.id.tvTitle) — classic way, returns the view by ID
ViewBinding — modern approach: generates a binding class from the XML, giving type-safe access to all views

ViewBinding is strongly preferred — you'll learn it in the next lesson.

Using findViewById

Access and modify views from onCreate:

import android.os.Bundle
import android.widget.TextView
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val tvTitle = findViewById<TextView>(R.id.tvTitle)
        tvTitle.text = "Welcome!"
        tvTitle.textSize = 20f
    }
}

Quick Check

Which unit should you use for text size in Android layouts?

Answer it in the interactive lesson

Recap: Layouts & Views

You can now design Android screens:

UIs are defined in XML layout files in res/layout/
Common views: TextView, EditText, Button, ImageView
ConstraintLayout — flexible, flat, recommended
LinearLayout — simple row/column arrangement
Use dp for sizes, sp for text
Access views in Kotlin with findViewById

Next: make your UI interactive by handling user input.

Free to start

Learn Kotlin with an AI tutor — free

Write and run real code in your browser, get instant help from a 24/7 AI tutor, and pick up where you left off on the web or in the app.

Courses: 36
Lessons: 152

Start learning free View the full course

Frequently Asked Questions

Is the “Layouts & Views” lesson free?

Yes — any 3 lessons of the Android Academy learning path, including “Layouts & Views”, are free to read in full here on the web. After that, CoddyKit PRO unlocks every lesson, plus interactive practice with a built-in code editor and a 24/7 AI tutor. The Android Academy course includes 7 lessons in total.

What will I learn in “Layouts & Views”?

Design UIs with XML layouts. Use ConstraintLayout, LinearLayout, and common views like TextView, Button, ImageView, and EditText. You practise Android Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.

Do I need any experience to start Android Academy?

No prior experience is required. Android Academy on CoddyKit is structured for beginners through advanced learners, so you can start here or from the beginning and move at your own pace. This is lesson 3 of 7.

How long does the “Layouts & Views” lesson take?

Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.

Can I write and run code in this Android Academy lesson?

Yes. Every Android Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.

All lessons in this course

← Back to Android Academy