Text Field Material Design | CodersArts

Text field material design basically help us to design attractive Ui for login and register page we are able to add validation also there.

In input text material design Implementation first we need to add dependency for material design

In App-> Gradle Script -> Build.gradle

implementation 'com.google.android.material:material:1.0.0'

<com.google.android.material.textfield.TextInputLayout
  android:layout_marginRight="15dp"
  android:layout_marginLeft="15dp"
  android:layout_marginTop="50dp"
  android:hint="Username"
 
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dene">
  <com.google.android.material.textfield.TextInputEditText
  android:id="@+id/user"
 
  android:inputType="text"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"/>
 

style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dene">

Outline box is above the box that is know as outline box

style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox">

When we filling the text inside field that is knows as text field like in above text is inside the field inside the text field

Diff b/w FilledBox and Outline text box

<?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout 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:orientation="vertical"
  tools:context=".RegisterActivity">
  <com.google.android.material.textfield.TextInputLayout
  android:layout_marginRight="15dp"
  android:layout_marginLeft="15dp"
  android:layout_marginTop="50dp"
  android:hint="Username"
 
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
  <com.google.android.material.textfield.TextInputEditText
  android:id="@+id/user"
  android:inputType="text"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"/>
  </com.google.android.material.textfield.TextInputLayout>
  <com.google.android.material.textfield.TextInputLayout
  android:layout_marginLeft="15dp"
  android:layout_marginRight="15dp"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
  android:layout_marginTop="140dp"
  android:hint="Full Name">
  <com.google.android.material.textfield.TextInputEditText
  android:id="@+id/name"
  android:inputType="text"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"/>
 
  </com.google.android.material.textfield.TextInputLayout>
  <com.google.android.material.textfield.TextInputLayout
  android:layout_marginLeft="15dp"
  android:layout_marginRight="15dp"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
  android:layout_marginTop="220dp"
  android:hint="Email">
  <com.google.android.material.textfield.TextInputEditText
  android:id="@+id/email"
  android:inputType="textEmailAddress"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"/>
 
  </com.google.android.material.textfield.TextInputLayout>
  <com.google.android.material.textfield.TextInputLayout
  android:layout_marginLeft="15dp"
  android:layout_marginRight="15dp"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
  android:layout_marginTop="300dp"
  android:hint="Password">
  <com.google.android.material.textfield.TextInputEditText
  android:id="@+id/pass"
  android:inputType="textPassword"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"/>
 
  </com.google.android.material.textfield.TextInputLayout>
  <Button
  android:layout_marginRight="15dp"
  android:layout_marginLeft="15dp"
  android:id="@+id/register"
  android:layout_marginTop="400dp"
  android:hint="Go"
  android:background="#fffff0"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"/>
 
  </RelativeLayout>

Hire an android developer to get quick help for all your android app development needs. with the hands-on android assignment help and android project help by Codersarts android expert. You can contact the android programming help expert any time; we will help you overcome all the issues and find the right solution.

Please send your requirement files at contact@codersarts.com. and you'll get instant reply as soon as requirement receives