1

In my application I want use TextInputLayout and I want set border for this view.
Such as this image : Image

I write below codes : 

<com.google.android.material.textfield.TextInputLayout android:id="@+id/loginFrag_phoneInputLayout" style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginStart="@dimen/_15mdp" android:layout_marginLeft="@dimen/_15mdp" android:layout_marginTop="@dimen/_15mdp" android:layout_marginEnd="@dimen/_15mdp" android:layout_marginRight="@dimen/_15mdp" android:hint="@string/insertYourPhoneNumber" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/loginFrag_title"> <com.google.android.material.textfield.TextInputEditText android:id="@+id/signInFrag_phoneEdt" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/transparent" android:gravity="right|center_vertical" android:inputType="phone" android:maxLength="11" android:maxLines="1" android:paddingLeft="@dimen/_10mdp" android:paddingRight="@dimen/_10mdp" android:singleLine="true" android:textColorHint="@color/colorLightGray" android:textSize="@dimen/_10mdp" app:drawableRightCompat="@drawable/ic_phone" /> </com.google.android.material.textfield.TextInputLayout>

I added this line :

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

But when update material design library to v1.3 not show me any border!

'com.google.android.material:material:1.3.0'

But in v1.2 or v1.1 show me border and not any problem!

Why not show border in v1.3 ?
How can I fix it?

Improve this question
5
  • How about wrapping it inside a view with background and giving it some margin? For example, <FrameLayout background=#000000 > <YOURVIEW margin=1dp background=#FFFFFF/> </FrameLayout> Commented Apr 6, 2021 at 5:19
  • Basically you want a phone icon should be displayed in edit box, that's why you are using app:drawableRightCompat="@drawable/ic_phone" along with transparent background to make icon visible, am I correct ? Commented Apr 6, 2021 at 5:40
  • @NRUSINGHAMOHARANA , yes but how can i fix it? Commented Apr 6, 2021 at 5:46
  • use app:startIconDrawable="@drawable/ic_action_phone" in TextInputLayout and remove both android:background="@android:color/transparent" and app:drawableRightCompat="@drawable/ic_phone" from TextInputEditText. I updated my answer. Commented Apr 6, 2021 at 5:48
  • in theme.xml you have to also set the material theme prntscr.com/115fzwe Commented Apr 6, 2021 at 6:09

2 Answers 2

Reset to default
2

You have to remove the background android:background="@android:color/transparent" in the TextInputEditText.

Also don't use app:drawableRightCompat="@drawable/...." in the TextInputEditText but use:

 <com.google.android.material.textfield.TextInputLayout style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox" app:endIconDrawable="@drawable/..." app:endIconMode="custom"

enter image description here

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Thank my friend, I fix my problem. but my language is RTL when click on EditText show hint on the line!! please see this image : i.ibb.co/XxDqNz4/39.png how can i fix it? thanks
@Miss.Ellen It happens because you're setting the edit text android:gravity to right it's getting inverted since it's in RTL, so you don't need to specify any gravity.
yeeeeees. thanks my friend for your helps. it's ok
2

I am also using v 1.3.0 and getting correct border using below code:

 <com.google.android.material.textfield.TextInputLayout android:id="@+id/loginFrag_phoneInputLayout" style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginStart="10dp" android:layout_marginLeft="10dp" android:layout_marginTop="10dp" android:layout_marginEnd="10dp" android:layout_marginRight="10dp" android:hint="Phone Number" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:startIconDrawable="@drawable/ic_action_phone" > <com.google.android.material.textfield.TextInputEditText android:id="@+id/signInFrag_phoneEdt" android:layout_width="match_parent" android:layout_height="wrap_content" android:inputType="phone" android:maxLength="11" android:maxLines="1" android:paddingLeft="10dp" android:paddingRight="10dp" android:singleLine="true"/> </com.google.android.material.textfield.TextInputLayout>
Improve this answer

6 Comments

Thanks my friend, but again not show any border
Can you check my answer now. I am using v 1.3.0 and getting correct border.
Yes my friend, in your code show border. but not show border in my codes? my codes and your codes are not any different ! why ?
Could you try with your code by removing app:boxStrokeColor="@color/teal_200" ? I hope this line makes different.
Please see my post, I updated my codes with you codes. please see above post. thanks
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.