android - কনস্ট্রেন্টলআউটে উপাদানগুলি কীভাবে কেন্দ্র করবেন




android-layout android-constraintlayout (4)

হালনাগাদ:

শৃঙ্খল

ইউজিনের উত্তরে বর্ণিত হিসাবে আপনি এখন packed মোডে chain বৈশিষ্ট্যটি ব্যবহার করতে পারেন।

নির্দেশিকা

আপনি 50% অবস্থানে একটি অনুভূমিক নির্দেশিকা ব্যবহার করতে পারেন এবং সম্পাদনা এবং বোতামের নীচে এবং শীর্ষ (8 ডিপি) সীমাবদ্ধতা যুক্ত করতে পারেন:

<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="match_parent"
    android:paddingLeft="16dp"
    android:paddingRight="16dp">

    <android.support.design.widget.TextInputLayout
        android:id="@+id/client_id_input_layout"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        app:layout_constraintBottom_toTopOf="@+id/guideline"
        android:layout_marginRight="8dp"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_marginLeft="8dp"
        app:layout_constraintLeft_toLeftOf="parent">

        <android.support.design.widget.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/login_client_id"
            android:inputType="textEmailAddress"/>

    </android.support.design.widget.TextInputLayout>

    <android.support.v7.widget.AppCompatButton
        android:id="@+id/authenticate"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="@string/login_auth"
        app:layout_constraintTop_toTopOf="@+id/guideline"
        android:layout_marginTop="8dp"
        android:layout_marginRight="8dp"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_marginLeft="8dp"
        app:layout_constraintLeft_toLeftOf="parent"/>

    <android.support.constraint.Guideline
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/guideline"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.5"/>

</android.support.constraint.ConstraintLayout>

আমি অ্যাপ্লিকেশন বিন্যাস তৈরি করতে আমার অ্যাপ্লিকেশনটিতে ConstraintLayout ব্যবহার করছি। আমি এমন একটি স্ক্রিন তৈরির চেষ্টা করছি যেখানে একটি সম্পাদনা পাঠ এবং Button মাঝখানে থাকতে হবে এবং Button কেবল 16dp এর মার্জিনটপ সহ এডিটেক্সটের নীচে থাকা উচিত।

এখানে আমার লেআউট এবং স্ক্রিনশটটি এখন কেমন দেখাচ্ছে।

activity_authenticate_content.xml

<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="match_parent"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    tools:context="com.icici.iciciappathon.login.AuthenticationActivity">

    <android.support.design.widget.TextInputLayout
        android:id="@+id/client_id_input_layout"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <android.support.design.widget.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/login_client_id"
            android:inputType="textEmailAddress" />

    </android.support.design.widget.TextInputLayout>

    <android.support.v7.widget.AppCompatButton
        android:id="@+id/authenticate"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/login_auth"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="@id/client_id_input_layout"
        app:layout_constraintRight_toRightOf="@id/client_id_input_layout"
        app:layout_constraintTop_toTopOf="@id/client_id_input_layout" />

</android.support.constraint.ConstraintLayout>


আপনি পর্দার আকারের শতাংশ হিসাবে একটি দৃশ্যকে কেন্দ্র করতে পারেন।

এই উদাহরণটি প্রস্থ এবং উচ্চতার 50% ব্যবহার করে:

<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">

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="#FF0000"
        android:orientation="vertical"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHeight_percent=".5"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintWidth_percent=".5"></LinearLayout>

</android.support.constraint.ConstraintLayout>

এটি কনস্ট্রেন্টলআউট সংস্করণ 1.1.3 ব্যবহার করে করা হয়েছিল। এটিকে গ্রেডের মধ্যে আপনার নির্ভরতাগুলিতে যুক্ত করতে ভুলবেন না এবং সেখানে যদি নতুন সংস্করণ বের হয় তবে সংস্করণটি বাড়িয়ে দিন:

dependencies {
...
    implementation 'com.android.support.constraint:constraint-layout:1.1.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:id="@+id/mparent"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <ImageButton
            android:id="@+id/btn_settings"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:srcCompat="@drawable/ic_home_black_24dp"
            app:layout_constraintCircle="@id/mparent"
            app:layout_constraintCircleRadius="0dp"
            />
    </android.support.constraint.ConstraintLayout>

অভিভাবকের কাছে সীমাবদ্ধতা বৃত্ত এবং শূন্য ব্যাসার্ধ সহ আপনি আপনার ভিউটিকে পিতামাতার কেন্দ্রবিন্দু করতে পারেন।


গাইডলাইন সহ সমাধানটি কেবলমাত্র একক লাইন সম্পাদনা পাঠের ক্ষেত্রে এই বিশেষ ক্ষেত্রে কাজ করে। এটি মাল্টলাইন সম্পাদনা পাঠ্য কাজের জন্য কাজ করতে আপনার "প্যাকড" চেইন ব্যবহার করা উচিত।

<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"
    android:paddingLeft="16dp"
    android:paddingRight="16dp">

    <android.support.design.widget.TextInputLayout
        android:id="@+id/client_id_input_layout"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toTopOf="@+id/authenticate"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_chainStyle="packed">

        <android.support.design.widget.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/login_client_id"
            android:inputType="textEmailAddress" />

    </android.support.design.widget.TextInputLayout>

    <android.support.v7.widget.AppCompatButton
        android:id="@+id/authenticate"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/login_auth"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="@id/client_id_input_layout"
        app:layout_constraintRight_toRightOf="@id/client_id_input_layout"
        app:layout_constraintTop_toBottomOf="@id/client_id_input_layout" />

</android.support.constraint.ConstraintLayout>

এটি কেমন দেখাচ্ছে তা এখানে:

আপনি নিম্নলিখিত পোস্টগুলিতে চেইন ব্যবহার সম্পর্কে আরও পড়তে পারেন:








android-constraintlayout