🟢 शुरुआत · Lesson 03
पहली Android App (Hello World)
Step 1: New project
- 1File → New → New Project…
- 2Phone and Tablet → Empty Views Activity → Next
- 3Name: HelloApp · Package: com.example.helloapp
- 4Language: Kotlin · Minimum SDK: API 26 · Build configuration language: Kotlin DSL
- 5Finish करके "Gradle sync finished" का इंतज़ार करें
Step 2: दो ज़रूरी files
MainActivity.kt (logic)
- app/src/main/java/…/MainActivity.kt
- Kotlin code
- Click पर क्या हो, data load
activity_main.xml (design)
- app/src/main/res/layout/activity_main.xml
- XML tags = views
- Screen कैसी दिखे
Kotlin – MainActivity.kt (generated)
package com.example.helloapp
import android.os.Bundle
import androidx.activity.enableEdgeToEdge
import androidx.appcompat.app.AppCompatActivity
import androidx.core.view.ViewCompat
import androidx.core.view.WindowInsetsCompat
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
enableEdgeToEdge()
setContentView(R.layout.activity_main) // show res/layout/activity_main.xml
ViewCompat.setOnApplyWindowInsetsListener(findViewById(R.id.main)) { v, insets ->
val systemBars = insets.getInsets(WindowInsetsCompat.Type.systemBars())
v.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom)
insets
}
}
}Step 3: App run करें
Toolbar में emulator या phone चुनें और हरा ▶ Run button (Shift+F10) दबाएँ। पहला build एक मिनट लेता है; बाद के runs जल्दी होते हैं।
Step 4: Screen design करें
activity_main.xml खोलें, Code view (ऊपर दाएँ) पर जाएँ और इसे बदलें:
XML – res/layout/activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:padding="24dp">
<TextView
android:id="@+id/tvMessage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
android:textSize="28sp"
android:textStyle="bold" />
<Button
android:id="@+id/btnHello"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
android:text="Say Namaste" />
</LinearLayout>Step 5: Button चलाइए
Kotlin – MainActivity.kt
import android.widget.Button
import android.widget.TextView
class MainActivity : AppCompatActivity() {
private var count = 0
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
enableEdgeToEdge()
setContentView(R.layout.activity_main)
// ... insets listener from the template ...
val tvMessage = findViewById<TextView>(R.id.tvMessage)
val btnHello = findViewById<Button>(R.id.btnHello)
btnHello.setOnClickListener {
count++
tvMessage.text = "Namaste! 🙏 You clicked $count times"
}
}
}findViewById view को उसकी android:id से ढूँढता है। View Binding lesson में इसे ज़्यादा safe और छोटे तरीके से बदलेंगे।
App शुरू होने पर क्या होता है
आम गलतियाँ
- "Empty Activity" चुनना → बिना XML layout वाला Compose code मिलता है।
setContentViewसे पहलेfindViewById→ null मिलता है और app crash।- id में typo (
R.id.btnhello) → "Unresolved reference" error। - "Hello World!" जैसा hard-coded text → practice के लिए ठीक; असली apps
@string/use करती हैं (अगले lessons)।
सारांश
- New Project → Empty Views Activity → Kotlin।
- XML layout = design, Activity = logic;
setContentViewसे जुड़ते हैं। setOnClickListener { }tap पर code चलाता है।
✅ Practice
दूसरा "Reset" button जोड़िए जो count को 0 कर दे, और android:textColor="#16A34A" से text का colour green कीजिए।
अक्सर पूछे जाने वाले प्रश्न (FAQ)
कौन सा template चुनें: Empty Activity या Empty Views Activity?
इस course के लिए Empty Views Activity चुनें — यह XML layouts use करता है। "Empty Activity" Jetpack Compose project बनाता है।
R.layout.activity_main क्या है?
R एक class है जिसे Android आपके res folder से बनाता है। R.layout.activity_main, res/layout/activity_main.xml की ID है, ताकि setContentView जाने कौन सी screen दिखानी है।
enableEdgeToEdge() क्या करता है?
यह app को status और navigation bars के पीछे तक draw करने देता है। Template का insets listener padding जोड़ता है ताकि content उनके नीचे न छिपे।
