Как использовать дизайн материалов в проекте android studio

Question

Я пытаюсь использовать текстовые поля дизайна материала в моем проекте Android.

Задача

когда я использую TextInputLayout и TextInputEditText в своем коде xml, я получаю сообщение об ошибке, что эти два класса не распознаны или не найдены.

Я пытался импортировать библиотеку поддержки дизайна, но это не сработало.

Вопрос

Как я могу использовать текстовые поля дизайна материала в моем проекте Android?

Версия My Target SDK - 28

Вот мой код 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:background="@android:color/background_light"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/pickImgBtn"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Pick Image"
        android:layout_marginRight="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="0dp"
        app:layout_constraintTop_toTopOf="parent"
        style="?android:attr/borderlessButtonStyle"
        android:onClick="pickImage" />

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/textfieldContainer"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toBottomOf="@id/pickImgBtn">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/toptextfield"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="add top text"
            android:padding="10dp"
            android:layout_margin="10dp" />

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/bottomtextfield"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="add top text"
            android:padding="10dp"
            android:layout_margin="10dp" />

    </com.google.android.material.textfield.TextInputLayout>

    <Button
        android:id="@+id/createMemeBtn"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Create Meme"
        android:layout_marginRight="10dp"
        android:layout_marginLeft="10dp"
        app:layout_constraintTop_toBottomOf="@id/textfieldContainer"
        style="?android:attr/borderlessButtonStyle" />

    <android.support.constraint.ConstraintLayout
        android:id="@+id/memeLayout"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="51dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintLeft_toRightOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toBottomOf="@id/createMemeBtn">

        <ImageView
            android:id="@+id/image"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@android:color/darker_gray"/>

        <TextView
            android:id="@+id/toptext"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Insert Top Text Here"
            android:layout_weight="0"
            android:textSize="25sp"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="10dp"
            android:layout_marginTop="10dp"
            android:gravity="center"
            android:textStyle="bold"
            android:textColor="#fff"
            app:layout_constraintTop_toTopOf="parent"/>

        <TextView
            android:id="@+id/bottomtext"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0"
            android:text="Insert Bottom Text Here"
            android:textSize="25sp"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="10dp"
            android:layout_marginBottom="10dp"
            android:gravity="center"
            android:textStyle="bold"
            android:textColor="#fff"
            app:layout_constraintBottom_toBottomOf="parent"/>

    </android.support.constraint.ConstraintLayout>

    <Button
        android:id="@+id/saveMemeBtn"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Save Image"
        android:layout_marginRight="10dp"
        android:layout_marginLeft="10dp"
        app:layout_constraintTop_toBottomOf="@id/memeLayout"
        style="?android:attr/borderlessButtonStyle" />

</android.support.constraint.ConstraintLayout>

Answer 1

попробуйте выполнить это в Gradle

implementation 'com.android.support:design:28.0.0-alpha3'

и это в вашем xml

 <android.support.design.widget.TextInputLayout
                style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColorHint="@color/light_white"
                app:boxStrokeColor="@color/light_white"
                app:boxStrokeWidth="1dp">

                <com.lynx.zaindelivery.views.ZainEditText
                    android:id="@+id/ActivityLoginMobileNumberOrEmailEditText"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"

                    android:hint="@string/mobile_number_or_email" />
            </android.support.design.widget.TextInputLayout>

обратите внимание, вы можете попробовать другой стиль

Answer 2

Вам необходимо использовать приведенный ниже код, который доступен для библиотеки поддержки:

<android.support.design.widget.TextInputLayout
         android:id="@+id/input_layout_email"
         android:layout_width="match_parent"
         android:layout_height="wrap_content">

    <EditText
        android:id="@+id/input_email"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/hint_email" />

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

Если вы хотите использовать Текстовые поля материала , вам нужно добавить Библиотеку материалов

implement com.google.android.material:material:1.0.0-beta01

Примечание : Вы не должны одновременно использовать зависимости com.android.support и com.google.android.material в своем приложении. Пожалуйста, прочитайте инструкции здесь