Android：开发像Facebook这样的登录屏幕

Question

我试图在我的Android应用程序上开发一个屏幕，如facebook登录（App iPhone / Android） App Facebook截图

如何在这两个edittexts之间绘制这个分隔线：电子邮件和密码？

谢谢！！

Answer 1

为了达到这样的效果，你只需制作自己的9-patch drawable。 我已经做alreaady这样的事情在我的应用中看到这

布局顶部可绘制未压缩

布局顶部可拉伸按下

布局底部可绘制未压缩

布局底部可拉动按下

剩下的唯一事情是为顶部编辑文本构建两个选择器，为底部edittext构建另一个选择器，并将它们设置为edittext的backround：

selector_top_editText.xml：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/layout_top_pressed" android:state_pressed="true"/>
    <item android:drawable="@drawable/layout_top_normal"/>

</selector>

selector_bottom_editText.xml：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/layout_bottom_pressed" android:state_pressed="true"/>
    <item android:drawable="@drawable/layout_bottom_normal"/>

</selector>

对于您的登录页面，您可以使用此布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >


        <EditText
            android:id="@+id/editText1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:ems="10"
            android:inputType="textPersonName"
            android:background="@drawable/layout_top_selector" />

        <EditText
            android:id="@+id/editText2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:ems="10"
            android:inputType="textPassword" 
            android:background="@drawable/layout_bottom_selector"
            android:layout_below="@id/editText1"/>

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="46dp"
            android:text="Login" />

</RelativeLayout>

检查这个，如果你发现问题，请联系我

干杯

Answer 2

如果您想在Views之间画一条线，这将有所帮助

<View
         android:layout_width="fill_parent"
         android:layout_height="2dip"
         android:background="#FF909090" />

如果您正在寻找有定制的EditText，这些链接在这里和这里可以帮助你。