बाधा लेआउट कार्यक्षेत्र संरेखित केंद्र

Question

बाधा लेआउट में लंबवत संरेखित और केंद्र ऑब्जेक्ट कैसे करें? यह लंबवत या क्षैतिज रूप से संरेखित करना संभव है, लेकिन मुझे दो ग्रिडलाइन्स के बीच विचारों को विवश करने के साथ-साथ एक ही समय में केंद्र के लिए एक रास्ता नहीं मिला है।

कार्यक्षेत्र संरेखित केंद्र:

ऐसा लगता है कि केंद्रित बाधा के साथ एक बहुत बड़ी समस्या है, जो मुझे "सेंटरइंटरपेंट", "सेंटरवेरिटिकल" और "सेंटरहॉर हॉरिज़ॉन्टल" के लिए रिश्तेदार लेआउट पर वापस जाने के लिए मजबूर करती है।

मैं बाधा रहित लेआउट का उपयोग करते हुए लाल रंग में बॉक्सिंग लेआउट बनाना चाहता हूं:

दुर्भाग्य से, दो ग्रिडलाइनों का उपयोग किए बिना मुझे एकमात्र रास्ता नेस्टेड रिलेटिव और लिनियरलैयूट्स के साथ मिला है (जो कि इस सटीक परिदृश्य को हल करने के लिए बाधा लेआउट था!)।

सापेक्ष और रैखिक लेआउट का उपयोग कर लेआउट:

<RelativeLayout
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="12dp"
    app:layout_constraintTop_toBottomOf="@id/user_points"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent">

    <LinearLayout
        android:id="@+id/stat_1_layout"
        android:layout_width="60dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="12dp"
        android:layout_marginRight="12dp"
        android:layout_centerVertical="true"
        android:layout_toLeftOf="@+id/divider_1"
        android:orientation="vertical">

        <TextView
            android:id="@+id/stat_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:gravity="center_horizontal"
            android:text="10"
            android:textSize="16dp"
            android:textColor="@color/textSecondaryDark"
            android:maxLines="1"/>

        <TextView
            android:id="@+id/stat_detail_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:gravity="center"
            android:text="Streak"
            android:textSize="8sp"
            android:textColor="@color/textSecondary"
            android:maxLines="1"/>
    </LinearLayout>

    <View
        android:id="@+id/divider_1"
        android:layout_width="1dp"
        android:layout_height="38dp"
        android:layout_toLeftOf="@+id/stat_2_layout"
        android:background="@drawable/linedivider"/>

    <LinearLayout
        android:id="@+id/stat_2_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="18dp"
        android:layout_marginRight="18dp"
        android:layout_centerInParent="true"
        android:orientation="vertical">

        <TextView
            android:id="@+id/stat_2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:gravity="center_horizontal"
            android:text="243"
            android:textSize="16dp"
            android:textColor="@color/textSecondaryDark"
            android:maxLines="1"/>

        <TextView
            android:id="@+id/stat_detail_2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:gravity="center"
            android:text="Calories Burned"
            android:textSize="8sp"
            android:textColor="@color/textSecondary"
            android:maxLines="1"/>
    </LinearLayout>

    <View
        android:id="@+id/divider_2"
        android:layout_width="1dp"
        android:layout_height="38dp"
        android:layout_toRightOf="@+id/stat_2_layout"
        android:background="@drawable/linedivider"/>

    <LinearLayout
        android:id="@+id/stat_3_layout"
        android:layout_width="60dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="12dp"
        android:layout_marginRight="12dp"
        android:layout_toRightOf="@+id/divider_2"
        android:layout_centerVertical="true"
        android:orientation="vertical">

        <TextView
            android:id="@+id/stat_3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:gravity="center_horizontal"
            android:text="3200"
            android:textSize="16dp"
            android:textColor="@color/textSecondaryDark"
            android:maxLines="1"/>

        <TextView
            android:id="@+id/stat_detail_3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:gravity="center"
            android:text="Steps"
            android:textSize="8sp"
            android:textColor="@color/textSecondary"
            android:maxLines="1"/>
    </LinearLayout>
</RelativeLayout>

Comments

वास्तविक समस्या क्षैतिज और लंबवत रूप से एक दृश्य को केंद्रित करती हुई प्रतीत होती है और फिर उस केन्द्रित दृश्य के सापेक्ष दृश्य प्रस्तुत करती है। बाधा लेआउट आपको दृश्य संरेखित करने की अनुमति देता है लेकिन केंद्र संरेखित दृश्य को अन्य दृश्यों के लिए लंगर के रूप में सेट नहीं करता है।

— रे ली

नीचे दिए गए उत्तर को देखें, केंद्र संरेखित दृश्य को अन्य दृश्यों के लिए एक एंकर के रूप में सेट करना संभव है।

— यूजीन ब्रूसोव

Android Studio में पूर्वावलोकन विंडो (पाठ दृश्य के लिए, डिज़ाइन नहीं) गतिशील रूप से एक xml लेआउट (स्थैतिक डेटा के लिए) में किए गए परिवर्तनों को दिखाती है। यह प्रयोग के साथ बहुत मदद करता है।

— samis

Answer 1

अन्य दृश्यों के लिए लंगर के रूप में केंद्र संरेखित दृश्य सेट करना संभव है। नीचे दिए गए उदाहरण में "@ + id / stat_2" क्षैतिज रूप से माता-पिता में केंद्रित है और यह इस लेआउट में अन्य विचारों के लिए एक लंगर के रूप में कार्य करता है।

<android.support.constraint.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/stat_1"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:gravity="center"
        android:maxLines="1"
        android:text="10"
        android:textColor="#777"
        android:textSize="22sp"
        app:layout_constraintTop_toTopOf="@+id/stat_2"
        app:layout_constraintEnd_toStartOf="@+id/divider_1" />

    <TextView
        android:id="@+id/stat_detail_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Streak"
        android:textColor="#777"
        android:textSize="12sp"
        app:layout_constraintTop_toBottomOf="@+id/stat_1"
        app:layout_constraintStart_toStartOf="@+id/stat_1"
        app:layout_constraintEnd_toEndOf="@+id/stat_1" />

    <View
        android:id="@+id/divider_1"
        android:layout_width="1dp"
        android:layout_height="0dp"
        android:layout_marginEnd="16dp"
        android:background="#ccc"
        app:layout_constraintTop_toTopOf="@+id/stat_2"
        app:layout_constraintEnd_toStartOf="@+id/stat_2"
        app:layout_constraintBottom_toBottomOf="@+id/stat_detail_2" />

    <TextView
        android:id="@+id/stat_2"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:maxLines="1"
        android:text="243"
        android:textColor="#777"
        android:textSize="22sp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBottom_toBottomOf="parent" />

    <TextView
        android:id="@+id/stat_detail_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:maxLines="1"
        android:text="Calories Burned"
        android:textColor="#777"
        android:textSize="12sp"
        app:layout_constraintTop_toBottomOf="@+id/stat_2"
        app:layout_constraintStart_toStartOf="@+id/stat_2"
        app:layout_constraintEnd_toEndOf="@+id/stat_2" />

    <View
        android:id="@+id/divider_2"
        android:layout_width="1dp"
        android:layout_height="0dp"
        android:layout_marginStart="16dp"
        android:background="#ccc"
        app:layout_constraintBottom_toBottomOf="@+id/stat_detail_2"
        app:layout_constraintStart_toEndOf="@+id/stat_2"
        app:layout_constraintTop_toTopOf="@+id/stat_2" />

    <TextView
        android:id="@+id/stat_3"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:gravity="center"
        android:maxLines="1"
        android:text="3200"
        android:textColor="#777"
        android:textSize="22sp"
        app:layout_constraintTop_toTopOf="@+id/stat_2"
        app:layout_constraintStart_toEndOf="@+id/divider_2" />

    <TextView
        android:id="@+id/stat_detail_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:maxLines="1"
        android:text="Steps"
        android:textColor="#777"
        android:textSize="12sp"
        app:layout_constraintTop_toBottomOf="@+id/stat_3"
        app:layout_constraintStart_toStartOf="@+id/stat_3"
        app:layout_constraintEnd_toEndOf="@+id/stat_3" />

</android.support.constraint.ConstraintLayout>

यहां बताया गया है कि यह सबसे छोटे स्मार्टफोन (3.7 480x800 Nexus One) बनाम सबसे बड़े स्मार्टफोन (5.5 1440x2560 पिक्सेल XL) पर कैसे काम करता है

Comments

गजब का! इस प्रश्न का उत्तर देने के लिए समय निकालने के लिए धन्यवाद। इन जवाबों ने मुझे वास्तव में कांस्ट्रेक्ट लेआउट को बेहतर तरीके से समझने में मदद की है। जिस कारण से मैं इस उत्तर को सही बनाम बेन पी। के उत्तर के रूप में चिह्नित कर रहा हूं, क्योंकि यह उत्तर केंद्र वस्तु के लिए लंगर देता है। इस समाधान के साथ, मैं अब केंद्र ऑब्जेक्ट को किसी अन्य स्थान पर संरेखित कर सकता हूं और अन्य ऑब्जेक्ट का पालन करेंगे।

— रे ली

आपके अनुभव यूजीन ब्रूसोव में बाधा लेआउट के साथ कैसे काम कर रहा है? मुझे लगता है कि केंद्र और वितरण विधियों की कमी के कारण सापेक्ष लेआउट / रैखिक लेआउट का उपयोग करने की तुलना में बाधा लेआउट एक बहुत अधिक मैनुअल कॉन्फ़िगरेशन है। विश गूगल एक ऐसे लेआउट के साथ आया है जो एक्सकोड / वेब बिल्डर स्टाइल WYSIWYG के बजाय वास्तव में रिलेटिव लेआउट और रैखिक लेआउट को एक साथ मिला देता है।

— रे ली

@RayLi खैर, मैं वास्तव में कॉन्स्ट्रेन्डलैट का आनंद लेता हूं, मेरी पसंदीदा विशेषताओं में लेआउट को समतल करने और पहलू अनुपात के साथ विचारों को आकार देने की संभावना है। आप ConstraintLayout stackoverflow.com/users/7158449/eugene-brusov से संबंधित विभिन्न प्रश्नों के मेरे उत्तर भी पा सकते हैं । सवाल पोस्ट करते रहें :-)

— यूजीन ब्रूसोव

और उन्हें जवाब देना जारी रखें श्री कांस्टेंट लेआउट विशेषज्ञ;)

— रे ली

हाय @RayLi मैंने उपरोक्त कोड की कोशिश की। लेकिन सभी सामग्री शीर्ष बाईं ओर जाती है। किसी भी विचार कैसे श्री यूजीन Brusov टेम्पलेट की तरह है?

— HiDayurie डेव

Answer 2

यदि आपके पास ConstraintLayoutकुछ आकार है, और Viewकुछ छोटे आकार वाला बच्चा है , तो आप माता-पिता के समान दो किनारों पर बच्चे के दो किनारों को विवश करके केंद्र को प्राप्त कर सकते हैं। यानी आप लिख सकते हैं:

app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"

या

app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"

क्योंकि दृश्य छोटा है, ये अड़चनें असंभव हैं। लेकिन ConstraintLayoutयह सबसे अच्छा कर सकता है, और प्रत्येक बाधा बच्चे को समान रूप से देखता है, जिससे वह केंद्रित होता है।

यह अवधारणा केवल माता-पिता की नहीं, बल्कि किसी भी लक्ष्य की दृष्टि से काम करती है।

अपडेट करें

नीचे एक्सएमएल है जो आपके वांछित यूआई को बिना किसी नेस्टिंग के प्राप्त करता है और कोई Guidelineएस (हालांकि दिशानिर्देश स्वाभाविक रूप से बुराई नहीं हैं)।

<android.support.constraint.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="wrap_content"
    android:background="#eee">

    <TextView
        android:id="@+id/title1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="12dp"
        android:gravity="center"
        android:textColor="#777"
        android:textSize="22sp"
        android:text="10"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/divider1"
        app:layout_constraintBottom_toBottomOf="parent"/>

    <TextView
        android:id="@+id/label1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textColor="#777"
        android:textSize="12sp"
        android:text="Streak"
        app:layout_constraintTop_toBottomOf="@+id/title1"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/divider1"/>

    <View
        android:id="@+id/divider1"
        android:layout_width="1dp"
        android:layout_height="55dp"
        android:layout_marginTop="12dp"
        android:layout_marginBottom="12dp"
        android:background="#ccc"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/title1"
        app:layout_constraintRight_toLeftOf="@+id/title2"
        app:layout_constraintBottom_toBottomOf="parent"/>

    <TextView
        android:id="@+id/title2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="12dp"
        android:gravity="center"
        android:textColor="#777"
        android:textSize="22sp"
        android:text="243"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/divider1"
        app:layout_constraintRight_toLeftOf="@+id/divider2"
        app:layout_constraintBottom_toBottomOf="parent"/>

    <TextView
        android:id="@+id/label2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textColor="#777"
        android:textSize="12sp"
        android:text="Calories Burned"
        app:layout_constraintTop_toBottomOf="@+id/title2"
        app:layout_constraintLeft_toRightOf="@+id/divider1"
        app:layout_constraintRight_toLeftOf="@+id/divider2"/>

    <View
        android:id="@+id/divider2"
        android:layout_width="1dp"
        android:layout_height="55dp"
        android:layout_marginTop="12dp"
        android:layout_marginBottom="12dp"
        android:background="#ccc"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/title2"
        app:layout_constraintRight_toLeftOf="@+id/title3"
        app:layout_constraintBottom_toBottomOf="parent"/>

    <TextView
        android:id="@+id/title3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="12dp"
        android:gravity="center"
        android:textColor="#777"
        android:textSize="22sp"
        android:text="3200"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/divider2"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"/>

    <TextView
        android:id="@+id/label3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textColor="#777"
        android:textSize="12sp"
        android:text="Steps"
        app:layout_constraintTop_toBottomOf="@+id/title3"
        app:layout_constraintLeft_toRightOf="@+id/divider2"
        app:layout_constraintRight_toRightOf="parent"/>

</android.support.constraint.ConstraintLayout>

Comments

दोह, इसका मतलब है कि सभी को केंद्र में लंबवत संरेखित करने की आवश्यकता है, एक निश्चित ऊंचाई के साथ एक दृश्य आइटम बनाएं और इसके अंदर बच्चे की वस्तुओं को विवश करें! लेकिन इस पद्धति का उपयोग करते हुए, मैं क्षैतिज रूप से मध्य बॉक्स को केंद्र में नहीं रखूंगा और केंद्र बॉक्स के सापेक्ष बाएं और दाएं बक्से की स्थिति निर्धारित करूंगा। यदि केवल बाधा लेआउट में एक "केंद्र" फ़ंक्शन था!

— रे ली

आप उपरोक्त पद्धति का उपयोग करके मध्य बॉक्स को क्षैतिज रूप से केंद्र में रख सकते हैं और फिर माता-पिता और मध्य बॉक्स के किनारे से मिलान करने के लिए अन्य दो बक्से सेट कर सकते हैं।

— बेन पी।

@RayLi मैंने अपने उत्तर को एक लेआउट के साथ अपडेट किया है जो मुझे विश्वास है कि आप जो चाहते हैं वह पूरा करता है।

— बेन पी।

+1, यह सरल और प्रभावी था। यह एक छोटा सा हैकरी लगता है, कांस्ट्रेन्थलाईट का एक 'सेंटर' फंक्शन था।

— अश्विन जी

Answer 3

हो सकता है कि मैं इस समस्या को पूरी तरह से समझ नहीं पाया, लेकिन, एक कॉन्स्ट्रेनल लयआउट के अंदर सभी दृश्य को केंद्रित करना बहुत सरल लगता है। यह वही है जो मैंने इस्तेमाल किया:

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center">

अंतिम दो पंक्तियों ने किया छल!

Comments

और अब अगर हम कुछ अन्य विचार रखना चाहते हैं जो स्क्रीन के केंद्र में नहीं हैं, तो यह कैसे करें?

— के प्रदीप कुमार रेड्डी

Answer 4

 <TextView
        android:id="@+id/tvName"
        style="@style/textViewBoldLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:text="Welcome"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"/>

Answer 5

चेन बनाकर आप आसानी से कई चीजों को सेंटर कर सकते हैं। यह दोनों लंबवत और क्षैतिज रूप से काम करता है

जंजीरों के बारे में आधिकारिक प्रलेखन से लिंक करें

टिप्पणी का जवाब देने के लिए संपादित करें :

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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/first_score"
        android:layout_width="60dp"
        android:layout_height="wrap_content"
        android:text="10"
        app:layout_constraintEnd_toStartOf="@+id/second_score"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/second_score"
        app:layout_constraintBottom_toTopOf="@+id/subtitle"
        app:layout_constraintHorizontal_chainStyle="spread"
        app:layout_constraintVertical_chainStyle="packed"
        android:gravity="center"
        />
    <TextView
        android:id="@+id/subtitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Subtitle"
        app:layout_constraintTop_toBottomOf="@+id/first_score"
        app:layout_constraintBottom_toBottomOf="@+id/second_score"
        app:layout_constraintStart_toStartOf="@id/first_score"
        app:layout_constraintEnd_toEndOf="@id/first_score"
        />
    <TextView
        android:id="@+id/second_score"
        android:layout_width="60dp"
        android:layout_height="120sp"
        android:text="243"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/thrid_score"
        app:layout_constraintStart_toEndOf="@id/first_score"
        app:layout_constraintTop_toTopOf="parent"
        android:gravity="center"
        />
    <TextView
        android:id="@+id/thrid_score"
        android:layout_width="60dp"
        android:layout_height="wrap_content"
        android:text="3200"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@id/second_score"
        app:layout_constraintTop_toTopOf="@id/second_score"
        app:layout_constraintBottom_toBottomOf="@id/second_score"
        android:gravity="center"
        />
</android.support.constraint.ConstraintLayout>

आपके पास क्षैतिज श्रृंखला है first_score <=> second_score <=> third_score:। second_scoreलंबवत केंद्रित है। अन्य अंक इसके अनुसार लंबवत केंद्रित हैं।

आप निश्चित रूप से एक वर्टिकल चेन बना सकते हैं first_score <=> subtitleऔर उसके अनुसार केंद्र बना सकते हैंsecond_score

Comments

मैंने श्रृंखला विधि की कोशिश की और यह काम नहीं करता है। श्रृंखला "श्रृंखला के पहले तत्व (श्रृंखला का" सिर ") पर सेट विशेषताओं द्वारा नियंत्रित की जाती है। श्रृंखला सिर को केवल "क्षैतिज श्रृंखलाओं के लिए सबसे बाएं विजेट, और ऊर्ध्वाधर श्रृंखलाओं के लिए शीर्ष-सबसे विजेट" के रूप में सेट किया जा सकता है। आप केंद्र आइटम को चेन हेड के रूप में सेट नहीं कर सकते हैं जो एक ही समय में लंबवत और क्षैतिज रूप से केंद्र को रोकता है।

— रे ली

@RayLi मैंने अपना जवाब आपको यह दिखाने के लिए संपादित किया कि मेरे मन में क्या है

— केलियन

आपके उत्तर को अपडेट करने और आपके मन में जो कुछ भी था उसे दिखाने के लिए धन्यवाद। यह तकनीक बहुत उपयोगी होगी!

— रे ली

Answer 6

इसे रेखांकन से दिखाना।

माता-पिता पर केन्द्रित करना माता-पिता दोनों को विवश करके किया जाता है। आप केंद्रित ऑब्जेक्ट से अतिरिक्त वस्तुओं को रोक सकते हैं।

ध्यान दें। प्रत्येक तीर एक "ऐप: लेआउट_कॉन्स्ट्रेंटएक्सएक्सएक्सएक्स_ओटीवाईवाई =" विशेषता का प्रतिनिधित्व करता है। (तस्वीर में 6)

Answer 7

मुझे भी कुछ इसी तरह की आवश्यकता थी। मैं स्क्रीन के केंद्र में एक कंटेनर रखना चाहता था और कंटेनर के अंदर कई दृश्य हैं। निम्नलिखित xml लेआउट कोड है। यहाँ मैं स्क्रीन के बीच में कंटेनर बनाने के लिए नेस्टेड कंट्रास्ट लेआउट का उपयोग कर रहा हूँ।

    <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/gradient_background"
tools:context=".activities.AppInfoActivity">

<ImageView
    android:id="@+id/ivClose"
    android:layout_width="30dp"
    android:layout_height="30dp"
    android:layout_marginStart="20dp"
    android:layout_marginTop="20dp"
    android:src="@drawable/ic_round_close_24"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="300dp"
    android:layout_height="300dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.5">

    <ImageView
        android:id="@+id/ivAppIcon"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/dead" />

    <TextView
        android:id="@+id/tvAppName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Birds Shooter Plane"
        android:textAlignment="center"
        android:textSize="30sp"
        android:textStyle="bold"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/ivAppIcon" />

    <TextView
        android:id="@+id/tvAppVersion"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Version : 1.0"
        android:textAlignment="center"
        android:textSize="12sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/tvAppName" />

    <TextView
        android:id="@+id/tvDevelopedBy"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="25dp"
        android:text="Developed by"
        android:textAlignment="center"
        android:textSize="12sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/tvAppVersion" />

    <TextView
        android:id="@+id/tvDevelopedName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:text="K Pradeep Kumar Reddy"
        android:textAlignment="center"
        android:textSize="14sp"
        android:textStyle="bold"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/tvDevelopedBy" />

    <TextView
        android:id="@+id/tvContact"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:text="Contact : [e-mail]"
        android:textAlignment="center"
        android:textSize="12sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/tvDevelopedName" />

    <TextView
        android:id="@+id/tvCheckForUpdate"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="25dp"
        android:text="@string/check_for_update"
        android:textAlignment="center"
        android:textSize="14sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/tvContact" />
</androidx.constraintlayout.widget.ConstraintLayout>

</Androidx.constraintlayout.widget.ConstraintLayout>

यहाँ लेआउट का स्क्रीनशॉट है

अन्य समाधान नेस्टेड बाधा लेआउट को हटाने और लेआउट के केंद्र में शीर्ष तत्व के लिए constraint_vertical_bias = 0.5 विशेषता जोड़ना है। मुझे लगता है कि इसे विचारों की श्रृंखला कहा जाता है।

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/gradient_background"
tools:context=".activities.AppInfoActivity">

<ImageView
android:id="@+id/ivClose"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginStart="20dp"
android:layout_marginTop="20dp"
android:src="@drawable/ic_round_close_24"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<ImageView
android:id="@+id/ivAppIcon"
android:layout_width="100dp"
android:layout_height="100dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.5"
app:srcCompat="@drawable/dead" />

<TextView
android:id="@+id/tvAppName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/app_display_name"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/ivAppIcon" />

<TextView
android:id="@+id/tvAppVersion"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/version"
android:textAlignment="center"
android:textSize="12sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvAppName" />

<TextView
android:id="@+id/tvDevelopedBy"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="25dp"
android:text="@string/developed_by"
android:textAlignment="center"
android:textSize="12sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvAppVersion" />

<TextView
android:id="@+id/tvDevelopedName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="@string/developer_name"
android:textAlignment="center"
android:textSize="14sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvDevelopedBy" />

<TextView
android:id="@+id/tvContact"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="@string/developer_email"
android:textAlignment="center"
android:textSize="12sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvDevelopedName" />
<TextView
android:id="@+id/tvCheckForUpdate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="25dp"
android:text="@string/check_for_update"
android:textAlignment="center"
android:textSize="14sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvContact" />
</androidx.constraintlayout.widget.ConstraintLayout>

यहाँ लेआउट का स्क्रीनशॉट है