Android EditText视图在Material Design中浮动提示

问题描述 投票:91回答:9

API 21是否提供了使用以下功能的方法:

http://www.google.com/design/spec/components/text-fields.html#text-fields-floating-labels

我正在尝试浮动EditText提示。

谢谢!

android text edit hint
9个回答
98
投票

浮动提示EditText:

在gradle中添加以下依赖项:

compile 'com.android.support:design:22.2.0'

在布局中:

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

        <EditText
            android:id="@+id/editText"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="UserName"/>
    </android.support.design.widget.TextInputLayout>

60
投票

是的,截至2015年5月29日,此功能现在在Android Design Support Library中提供

该库包括对该库的支持

  • 浮动标签
  • 浮动动作按钮
  • 小吃吧
  • 导航抽屉
  • 和更多

18
投票

Android支持库可以在依赖项中的gradle中导入:

    compile 'com.android.support:design:22.2.0'

它应该包含在GradlePlease中!并以此为例使用它:

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

    <AutoCompleteTextView
        android:id="@+id/autoCompleteTextViewTo"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="To"
        android:layout_marginTop="45dp"
        />
</android.support.design.widget.TextInputLayout>

顺便说一下,编辑可能不明白TextInputLayout中允许使用AutoCompleteTextView。


11
投票

Android尚未提供本机方法。也不是AppCompat。

试试这个图书馆:https://github.com/rengwuxian/MaterialEditText

这可能就是你想要的。


9
投票

导入支持库,在项目的build.gradle文件中,在项目的依赖项中添加以下行:

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])

    compile 'com.android.support:design:22.2.0'
    compile 'com.android.support:appcompat-v7:22.2.0'
}

在UI布局中使用以下TextInputLayout:

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

    <EditText
        android:id="@+id/username"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textEmailAddress"
        android:hint="Username"/>

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

然后,在setContentView调用之后调用setInputLayout上的setHint,因为要为浮动标签设置动画,只需使用setHint方法设置提示。

final TextInputLayout usernameWrapper = (TextInputLayout) findViewById(R.id.usernameWrapper);
usernameWrapper.setHint("Username");

3
投票

@ andruboy对https://gist.github.com/chrisbanes/11247418的建议可能是你最好的选择。

https://github.com/thebnich/FloatingHintEditText与appcompat-v7 v21.0.0一起使用,但由于v21.0.0不支持带有EditText子类的强调色,因此FloatingHintEditText的下划线将是默认的纯黑色或白色。此外,填充没有针对材质样式EditText进行优化,因此您可能需要对其进行调整。


0
投票

不,不。我希望在未来的api版本中,但是现在我们仍然坚持使用EditText。另一种选择是这个库: https://github.com/marvinlabs/android-floatinglabel-widgets


0
投票

试试这种方式

enter image description here

  dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
compile 'com.android.support:appcompat-v7:23.0.1'
compile 'com.android.support:design:23.0.1'

}

有关更多参考,请单击here


0
投票

为了更简单地使用InputTextLayout,我创建了这个库,将您的XML代码减少到不到一半,并且还为您提供了设置错误消息以及提示消息的简单方法。验证。 https://github.com/TeleClinic/SmartEditText

只需添加

compile 'com.github.TeleClinic:SmartEditText:0.1.0'

然后你可以做这样的事情:

<com.teleclinic.kabdo.smartmaterialedittext.CustomViews.SmartEditText
    android:id="@+id/emailSmartEditText"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:setLabel="Email"
    app:setMandatoryErrorMsg="Mandatory field"
    app:setRegexErrorMsg="Wrong email format"
    app:setRegexType="EMAIL_VALIDATION" />

<com.teleclinic.kabdo.smartmaterialedittext.CustomViews.SmartEditText
    android:id="@+id/passwordSmartEditText"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:setLabel="Password"
    app:setMandatoryErrorMsg="Mandatory field"
    app:setPasswordField="true"
    app:setRegexErrorMsg="Weak password"
    app:setRegexType="MEDIUM_PASSWORD_VALIDATION" />

<com.teleclinic.kabdo.smartmaterialedittext.CustomViews.SmartEditText
    android:id="@+id/ageSmartEditText"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:setLabel="Age"
    app:setMandatory="false"
    app:setRegexErrorMsg="Is that really your age :D?"
    app:setRegexString=".*\\d.*" />
© www.soinside.com 2019 - 2024. All rights reserved.