使用多行TextInputEditText时,如何让TextInputLayout的startIcon固定在左上角
如何让TextInputLayout的startIcon固定在顶部?
我使用了如下布局代码:
<com.google.android.material.textfield.TextInputLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="@string/vehicle_type" android:layout_marginTop="@dimen/layout_margin_default" app:startIconDrawable="@drawable/baseline_notes_24"> <com.google.android.material.textfield.TextInputEditText android:layout_width="match_parent" android:layout_height="wrap_content" android:inputType="textMultiLine"/> </com.google.android.material.textfield.TextInputLayout>
当前显示效果:
我的需求是让startIcon始终保持在顶部位置:
我查阅了TextInputLayout的可用属性,但似乎没有针对startIcon的gravity设置选项,请问这是否可以实现?
解决方案
可以实现,推荐两种实用方式:
方法1:自定义TextInputLayout调整图标位置
继承TextInputLayout并重写onLayout方法,强制把startIcon固定在顶部区域:
class TopAlignedTextInputLayout @JvmOverloads constructor( context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = com.google.android.material.R.attr.textInputLayoutStyle ) : TextInputLayout(context, attrs, defStyleAttr) { override fun onLayout(changed: Boolean, left: Int, top: Int, right: Int, bottom: Int) { super.onLayout(changed, left, top, right, bottom) val startIconView = this.startIconView ?: return // 让图标和hint文本顶部对齐,固定在布局上方 val hintTop = this.hintTextView?.top ?: startIconView.top startIconView.layout( startIconView.left, hintTop, startIconView.right, hintTop + startIconView.height ) } }
之后在布局文件里替换原有的TextInputLayout为自定义的TopAlignedTextInputLayout即可。
方法2:调整布局结构,单独放置图标
放弃使用TextInputLayout自带的startIcon,用外层布局将图标与输入框并列,手动控制图标位置:
<LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:gravity="top" android:layout_marginTop="@dimen/layout_margin_default"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/baseline_notes_24" android:layout_marginEnd="16dp" android:layout_gravity="top"/> <com.google.android.material.textfield.TextInputLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:hint="@string/vehicle_type"> <com.google.android.material.textfield.TextInputEditText android:layout_width="match_parent" android:layout_height="wrap_content" android:inputType="textMultiLine"/> </com.google.android.material.textfield.TextInputLayout> </LinearLayout>
这种方式无需自定义View,实现简单直接,也能完美达到图标固定在顶部的效果。
内容的提问来源于stack exchange,提问作者Nummer Eins
相关产品推荐
相关产品推荐

