如何在android studio项目中使用材质设计

Question

我想在我的android项目中使用material design textfields。

问题

当我在我的TextInputLayout代码中使用TextInputEditText和xml时，我得到一个错误，即无法识别或找到这两个类。

我尝试导入设计支持库但是没有用。

题

如何在我的android项目中使用material design textfields？

我的目标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

您需要使用以下代码才能获得支持库：

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

如果您想使用Material Text Fields，您需要添加材料库

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

注意：您不应同时在应用中使用com.android.support和com.google.android.material依赖项。请阅读说明here

Answer 2

尝试在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>

请注意，您可以尝试不同的风格