android - Android：Facebookのようなログイン画面の開発

Question

Facebookログイン（App iPhone / Android）アプリFacebookスクリーンショットのようなAndroidアプリで画面を開発しようとしています

電子メールとパスワードの2つの編集テキストの間にこの区切り線を引くにはどうすればよいですか？

ありがとう！！

Answer 1

このような効果を得るには、独自の9パッチを描画可能にする必要があります。私はすでに私のアプリでそのようなことをしましたこれを見てください

プレスされていないレイアウトトップドローアブル

レイアウトトップドローアブルプレス

押されていない下のドローアブルのレイアウト

レイアウト下部ドローアブルプレス

残っているのは、上部の編集テキスト用と下部の編集テキスト用の2つのセレクターを作成し、それらを編集テキストのバックラウンドとして設定することだけです。

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

ビュー間に線を引く場合は、これが役立ちます

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

カスタムEditTextをお探しの場合は、こことここにあるこれらのリンクが役立つ場合があります。