Great idea. Let's start with one of the simplest Android apps: a button that changes the text on the screen. This will introduce you to the basic building blocks of Android development.
MainActivity.kt (Kotlin)
package com.example.myfirstapp
import android.os.Bundle
import android.widget.Button
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 textView = findViewById<TextView>(R.id.textView)
val button = findViewById<Button>(R.id.button)
button.setOnClickListener {
textView.text = "Hello, Kotlin!"
}
}
}
activity_main.xml (The Screen Layout)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Welcome!"
android:textSize="24sp"/>
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Click Me"/>
</LinearLayout>
Now let's explain every part
1. package
package com.example.myfirstapp
This tells Android which project this file belongs to.
Think of it like your home address.
2. import
import android.widget.Button
import android.widget.TextView
Imports bring ready-made Android classes into your code.
-
Button→ creates a button. -
TextView→ displays text. -
AppCompatActivity→ the base screen of your app.
3. Class
class MainActivity : AppCompatActivity()
Every Android screen is called an Activity.
This line creates your app's first screen.
4. onCreate()
override fun onCreate(savedInstanceState: Bundle?)
This function runs when the screen opens.
Imagine opening YouTube. Everything you see is created here.
5. super.onCreate()
super.onCreate(savedInstanceState)
This tells Android to do its normal setup before your own code runs.
6. setContentView
setContentView(R.layout.activity_main)
This loads the XML layout.
Without this line, your app would show a blank screen.
7. findViewById
val textView = findViewById<TextView>(R.id.textView)
This connects your Kotlin code to the TextView in the XML layout.
R.id.textView refers to:
android:id="@+id/textView"
8. val
val button = ...
val means a variable whose reference won't be reassigned.
Example:
val age = 25
age always refers to that value unless you create a new variable.
9. Button Click
button.setOnClickListener {
This means:
"When the button is clicked, run the code inside these braces."
10. Change Text
textView.text = "Hello, Kotlin!"
This changes the text shown on the screen.
Initially:
Welcome!
After clicking:
Hello, Kotlin!
Understanding the XML
LinearLayout
<LinearLayout>
A layout is a container that holds other UI elements.
LinearLayout arranges them in a line.
orientation="vertical"
android:orientation="vertical"
This stacks items from top to bottom.
Like this:
Welcome!
Click Me
If it were "horizontal":
Welcome! Click Me
TextView
<TextView
Displays text on the screen.
Button
<Button
Creates a button that users can tap.
android:id
android:id="@+id/button"
This gives the button a unique name so your Kotlin code can find it.
android:text
android:text="Click Me"
This is the label shown on the button.
layout_width
android:layout_width="wrap_content"
wrap_content means the view is only as wide as it needs to be.
Other common value:
match_parent
which makes it fill the available width.
What happens when you run this app?
- The app starts.
-
onCreate()runs. -
activity_main.xmlis displayed. - You see:
- Welcome!
-
Click Me button
- You tap the button.
- The text changes to: Hello, Kotlin!
Key things to learn from this example
- Activity → A screen in your app.
- XML → Describes what the screen looks like.
- Kotlin → Controls how the app behaves.
- Button → Receives user input.
- TextView → Displays text.
- ID → Connects XML elements to Kotlin code.
- Click Listener → Runs code when a button is tapped.
This small app demonstrates the core pattern you'll use in almost every Android app: define the interface in XML, then write Kotlin code to respond to user actions.
Top comments (0)