Free tutorials & notes in Hindi & English · Clean code examples 🧰 मुफ़्त PDF और फ़ोटो टूल्स →
🎨 UI – Views और Layouts  ·  Lesson 11

TextView, EditText और Button

TextView

TextView text दिखाता है। ज़रूरी attributes:

XML
<TextView
    android:id="@+id/tvWelcome"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/welcome"
    android:textSize="20sp"
    android:textStyle="bold"
    android:textColor="@color/brand"
    android:gravity="center"
    android:maxLines="2"
    android:ellipsize="end"
    android:drawablePadding="8dp"
    android:drawableStart="@drawable/ic_star" />
Attributeअसर
textSize / textStyle / textColorsp में size, bold/italic, colour
maxLines + ellipsize="end"लंबा text … से काटें
gravityView के अंदर text align
drawableStart + drawablePaddingText के बगल में icon

strings.xml use करें

सारा text res/values/strings.xml में रखें। इससे Hindi translation (values-hi/strings.xml file) और reuse आसान होता है।

XML + Kotlin
<!-- res/values/strings.xml -->
<resources>
    <string name="app_name">BMI Calculator</string>
    <string name="welcome">Welcome to BMI Calculator</string>
    <string name="your_bmi">Your BMI is %1$.1f (%2$s)</string>
</resources>

// Kotlin
tvResult.text = getString(R.string.your_bmi, 22.7, "Normal")   // "Your BMI is 22.7 (Normal)"

EditText और inputType

XML
<EditText
    android:id="@+id/etWeight"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="Weight in kg"
    android:inputType="numberDecimal"
    android:maxLength="5"
    android:imeOptions="actionNext" />
inputTypeKeyboard
text / textCapWordsNormal / पहले letters capital
number / numberDecimalDigits / dot वाले digits
phonePhone dial pad
textEmailAddress@ वाला keyboard
textPasswordछिपे characters
textMultiLineEnter से नई line

Material TextInputLayout

XML
<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/tilHeight"
    style="@style/Widget.Material3.TextInputLayout.OutlinedBox"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="Height in cm"
    app:helperText="Example: 165"
    app:suffixText="cm">

    <com.google.android.material.textfield.TextInputEditText
        android:id="@+id/etHeight"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="number"
        android:imeOptions="actionDone" />
</com.google.android.material.textfield.TextInputLayout>

<!-- password with eye icon -->
<com.google.android.material.textfield.TextInputLayout
    style="@style/Widget.Material3.TextInputLayout.OutlinedBox"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="Password"
    app:endIconMode="password_toggle">

    <com.google.android.material.textfield.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textPassword" />
</com.google.android.material.textfield.TextInputLayout>
9:41▮▮ 85%Sign up⋮Height in cmExample: 165Password 👁9:41▮▮ 85%Sign up⋮Height in cm⚠ Enter height in cmPassword 👁
Helper text, फिर til.error = "…" से error

Button और click listeners

Kotlin
// 1) lambda (most common)
btnCalculate.setOnClickListener { calculate() }

// 2) long press
btnCalculate.setOnLongClickListener {
    Toast.makeText(this, "Tap to calculate", Toast.LENGTH_SHORT).show()
    true                                  // true = event handled
}

// 3) enable / disable
btnCalculate.isEnabled = false

Mini project: BMI calculator

XML – res/layout/activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="24dp">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/welcome"
        android:textSize="22sp"
        android:textStyle="bold" />

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/tilWeight"
        style="@style/Widget.Material3.TextInputLayout.OutlinedBox"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:hint="Weight"
        app:suffixText="kg">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/etWeight"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="numberDecimal" />
    </com.google.android.material.textfield.TextInputLayout>

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/tilHeight"
        style="@style/Widget.Material3.TextInputLayout.OutlinedBox"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="12dp"
        android:hint="Height"
        app:suffixText="cm">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/etHeight"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:imeOptions="actionDone"
            android:inputType="number" />
    </com.google.android.material.textfield.TextInputLayout>

    <Button
        android:id="@+id/btnCalculate"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:text="Calculate BMI" />

    <TextView
        android:id="@+id/tvResult"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="24dp"
        android:gravity="center"
        android:textSize="20sp" />
</LinearLayout>
Kotlin – MainActivity.kt
package com.example.bmi

import android.os.Bundle
import android.widget.Button
import android.widget.TextView
import androidx.appcompat.app.AppCompatActivity
import com.google.android.material.textfield.TextInputEditText
import com.google.android.material.textfield.TextInputLayout

class MainActivity : AppCompatActivity() {

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

        val tilWeight = findViewById<TextInputLayout>(R.id.tilWeight)
        val tilHeight = findViewById<TextInputLayout>(R.id.tilHeight)
        val etWeight = findViewById<TextInputEditText>(R.id.etWeight)
        val etHeight = findViewById<TextInputEditText>(R.id.etHeight)
        val tvResult = findViewById<TextView>(R.id.tvResult)

        findViewById<Button>(R.id.btnCalculate).setOnClickListener {
            val weight = etWeight.text?.toString()?.toDoubleOrNull()
            val heightCm = etHeight.text?.toString()?.toDoubleOrNull()

            tilWeight.error = if (weight == null || weight <= 0) "Enter weight" else null
            tilHeight.error = if (heightCm == null || heightCm < 50) "Enter height in cm" else null
            if (tilWeight.error != null || tilHeight.error != null) return@setOnClickListener

            val h = heightCm!! / 100
            val bmi = weight!! / (h * h)
            val category = when {
                bmi < 18.5 -> "Underweight"
                bmi < 25 -> "Normal"
                bmi < 30 -> "Overweight"
                else -> "Obese"
            }
            tvResult.text = getString(R.string.your_bmi, bmi, category)
        }
    }
}
9:41▮▮ 85%BMI Calculator⋮Welcome to BMI CalculatorWeight 62 kgHeight 165 cmCALCULATE BMIYour BMI is 22.8 (Normal)
Validation + calculation + formatted result
Text पढ़ोtoDoubleOrNull()Validatetil.errorCalculatew / h²दिखाओgetString(…)
हर form का pattern

Keyboard tips

  • android:imeOptions="actionNext" अगले field पर ले जाता है; actionDone keyboard बंद करता है।
  • Manifest में activity पर android:windowSoftInputMode="adjustResize" लगाएँ ताकि keyboard form को न ढके।

आम गलतियाँ

  • खाली box पर etWeight.text.toString().toDouble() → NumberFormatException। toDoubleOrNull() use करें।
  • textView.text = 5 → type error; 5.toString() use करें। setText(5) crash करता है (string resource 5 ढूँढता है)।
  • Error TextInputLayout की जगह EditText पर set करना → til.error use करें।

सारांश

  • Text के लिए TextView, input के लिए (TextInputLayout के अंदर) EditText, actions के लिए Button।
  • inputType keyboard control करता है; strings.xml में text।
  • पढ़ो → validate (til.error) → काम करो; numbers toDoubleOrNull() से।
✅ Practice

"Percentage calculator" बनाइए: obtained और total marks के inputs, एक button, और "85.0% – Distinction" जैसा result। खाली fields और obtained > total पर errors दिखाइए।

अक्सर पूछे जाने वाले प्रश्न (FAQ)

EditText से number safely कैसे पढ़ें?
editText.text.toString().toDoubleOrNull() use करें। Box खाली हो या text हो तो crash की जगह null देता है, जिससे आप error दिखा सकते हैं।
hint और text में क्या फ़र्क है?
hint grey placeholder text है जो type करते ही गायब हो जाता है। text box के अंदर की असली value है।
Plain EditText की जगह TextInputLayout क्यों?
इससे floating label, field के नीचे error messages, character counter, password toggle और icons मिलते हैं — Material Design look जो users expect करते हैं।
← Android Tutorial (Kotlin)
🔗

Share this topic with a friend

यह topic किसी दोस्त को भेजें

Found it useful? Send it to a classmate learning the same thing.

अच्छा लगा? जो दोस्त यही सीख रहा है, उसे भेज दीजिए।

अगला topicView Binding आपकी प्रगति: 11 / 43 (26%) · Lesson 12 / 43 आगे बढ़ें →

यह lesson कैसा लगा?

आपकी राय से हम content और बेहतर बनाते हैं।

अपना review और सुझाव लिखें (वैकल्पिक)

Review approve होने के बाद आपका नाम और शहर इसके साथ public दिख सकते हैं। Email या phone न लिखें।

▶ CodingEasily on YouTube

Video से सीखें – आसान Hindi में

चुनी हुई video: RDBMS भाग 3 – Class XI Commerce IT

▶ Channel subscribe करें