Layouts & Measurement Units - Liner layout, relative layout, frame layout, coordinate layout, [dip, dp, sip, sp] versus px in hindi

Android Layouts & Measurement Units

Android में Layouts का इस्तेमाल UI (User Interface) Design करने के लिए किया जाता है।

• Layouts का उपयोग करके हम Buttons, TextViews, Images, और अन्य UI Elements को सही तरीके से Arrange कर सकते हैं।
• Android हमें कई प्रकार के Layouts देता है, जिनका उपयोग हम अपनी App की जरूरत के अनुसार कर सकते हैं।

Layouts in Android

1. Linear Layout

Linear Layout में सभी Elements को एक Line में Arrange किया जाता है।

यह दो प्रकार का हो सकता है:

• Vertical (Top to Bottom)
• Horizontal (Left to Right)

Example: Vertical Linear Layout (XML code)

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button 1"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button 2"/>
</LinearLayout>

ऊपर दिए गए Code में दोनों Buttons एक के नीचे एक आएंगे।

Example: Horizontal Linear Layout (XML code)

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button 1"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button 2"/>
</LinearLayout>

ऊपर दिए गए Code में दोनों Buttons एक Row में आएंगे।

2. Relative Layout

Relative Layout में Views को एक-दूसरे के Relative (अनुसार) Set किया जाता है।

Example:

• किसी View को Parent के Top, Bottom, Left, Right से जोड़ सकते हैं।
• किसी View को दूसरे View के Above, Below, ToLeft, ToRight रख सकते हैं।

Example: Relative Layout (XML code)

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button 1"
        android:layout_centerHorizontal="true"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button 2"
        android:layout_below="@id/button1"
        android:layout_centerHorizontal="true"/>
</RelativeLayout>

Button 1 Center में होगा, और Button 2 उसके नीचे होगा।

3. Frame Layout

Frame Layout का उपयोग तब किया जाता है जब Views को एक-दूसरे के ऊपर Overlay (Stack) करना हो।

Example: Image के ऊपर TextView या Button रखना।

Example: Frame Layout (XML code)

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/background_image"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Overlay Text"
        android:layout_gravity="center"/>
</FrameLayout>

ImageView Background में होगा और TextView ऊपर Display होगा।

4. Coordinator Layout

Coordinator Layout एक Advanced Layout है, जो Scrolling Behaviors, Animations, और Material Design Components को Manage करने में मदद करता है।

इसका उपयोग Collapsing Toolbar, Floating Action Button (FAB), और Snackbar के साथ किया जाता है।

Example: Coordinator Layout (XML code)

<androidx.coordinatorlayout.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_add"
        app:layout_anchor="@id/recyclerView"
        app:layout_anchorGravity="bottom|end"/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>

यह Layout Floating Action Button (FAB) को Automatically Scroll Behavior देगा।

Measurement Units in Android

Android में UI Components की Size और Spacing को Define करने के लिए Multiple Units होते हैं।

Intents in Hindi

Development of Android Applications Notes in Hindi

Follow Us

   

• Introduction to Android in Hindi


• Dalvik Vartual Machine in Hindi


• Basic Building Blocks in Android in Hindi


• Fundamentals of android in Hindi


• apk file extension in Hindi


• UI components in Hindi


• Components for communication in Android in Hindi


• Android API Levels in Hindi


• Setting up development environment in Hindi


• Manifest.xml in Hindi


• Resources & R.java in Hindi