之前以及實現了QQV.0.8.4115的登陸界面，現在來總結一下，并且回顧一下用到過的東西。

先上圖：

【原圖】

QQLogin_0.jpg

【圖一】

QQLogin_1.PNG

【圖二】

QQLogin_2.PNG

現在開始敲

一、首先設計QQ登陸界面的布局：

1、我們采用RelativeLayout相對布局進行整體布局的規劃

2、然后是QQ圖標：

android:id="@+id/head"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:gravity="center"

android:layout_marginTop="130dp">

android:layout_width="57dp"

android:layout_height="81dp"

android:src="@drawable/qq" />

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textSize="50sp"

android:textStyle="bold"

android:text="QQ"/>

id的設置，方便代碼中的引用，也方便其他控件的定位

其他都根據自己的喜歡慢慢調

3、QQ圖標的下面是賬號欄：

android:id="@+id/body"

android:layout_width="320dp"

android:layout_height="wrap_content"

android:orientation="horizontal"

android:layout_centerHorizontal="true"

android:background="@drawable/editview"

android:layout_below="@+id/head">

android:id="@+id/image"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_toLeftOf="@+id/number"

android:layout_marginRight="27dp"

android:background="@drawable/touxiang"

android:layout_centerVertical="true" />

android:id="@+id/number"

android:layout_width="150dp"

android:layout_height="60dp"

android:layout_centerHorizontal="true"

android:background="@null"

android:inputType="number" />

android:id="@+id/spinner"

android:layout_width="40dp"

android:layout_height="60dp"

android:layout_marginLeft="20dp"

android:layout_centerVertical="true"

android:layout_toRightOf="@+id/number" />

ImageView是用來顯示QQ頭像

EditText文本框用顯示QQ帳號的

Spinner(下拉列表)是存放的QQ帳號的，便于QQ賬號的替換

【注】以上控件的信息，目前是用的數組實現，打算之后用鏈表敲一下

android:background="@drawable/editview"這個是我寫的橢圓邊框+灰色背景，代碼如下：

android:shape="rectangle">

android:width="130dp"/>

android:width="1dp"/>

【注】代碼中的android:color="@color/colorGray"是在value下colors的代碼中改變的，貼一下代碼：

#008577

#00574B

#D81B60

#FC6F6E6E

#FBFCFB

#010E01

#72C7CAC7

#F21F62F0

#BDBBBB

4、接下來是密碼框

android:id="@+id/body2"

android:layout_width="320dp"

android:layout_height="60dp"

android:layout_below="@+id/body"

android:layout_centerHorizontal="true"

android:layout_marginTop="16dp"

android:background="@drawable/editview">

android:id="@+id/visible"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_toLeftOf="@+id/password"

android:layout_marginRight="27dp"

android:background="@drawable/touxiang"

android:layout_centerVertical="true"/>

android:id="@+id/password"

android:layout_width="150dp"

android:layout_height="60dp"

android:background="@null"

android:layout_centerHorizontal="true"

android:layout_centerVertical="true"

android:layout_marginTop="14dp"

android:inputType="textPassword" />

ImageButton用來改變密碼的狀態(顯示密文/隱藏密文)，也用了一個邊框android:background="@drawable/touxiang"(但作用不明顯)

EditText用于用戶輸入密碼，也同樣是用的上面的橢圓邊框

5、這個版本的QQ登陸按鈕比較特別，一個圓形的按鈕，之前試過寫圓形框來實現，后來發現巨丑，無賴之下只有扣圖了

android:id="@+id/load"

android:layout_width="70dp"

android:layout_height="63dp"

android:layout_below="@+id/body2"

android:layout_centerHorizontal="true"

android:layout_marginTop="113dp"

android:background="@drawable/button"

android:src="@drawable/circle2" />

1、android:background="@drawable/button"是我寫的圓形邊框,以下是代碼

android:shape="rectangle">

android:width="10dp"/>

android:width="0dp"/>

6、最后是忘記密碼和用戶注冊欄：

android:id="@+id/text_top"

android:layout_width="match_parent"

android:layout_height="wrap_content">

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textStyle="bold"

android:autoLink="web"

android:textColor="#090000"

android:layout_marginLeft="100dp"

android:text="忘記密碼"/>

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textStyle="bold"

android:autoLink="web"

android:textColor="#090000"

android:layout_marginLeft="240dp"

android:text="用戶注冊"/>

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_below="@+id/text_top"

android:orientation="horizontal">

android:id="@+id/agree"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginLeft="100dp"

android:text="登陸后代表閱讀并同意"/>

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textStyle="bold"

android:autoLink="web"

android:textColor="#090000"

android:layout_toRightOf="@+id/agree"

android:text="服務條款"/>

里面的加粗文字，本來是用超鏈接實現，之前試過，沒成功，所以目前的還沒學會

好，這就是QQ登陸界面的簡單實現！！！

貼一下全部代碼：

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="#FCFCFC"

tools:context=".MainActivity">

android:id="@+id/head"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:gravity="center"

android:layout_marginTop="130dp">

android:layout_width="57dp"

android:layout_height="81dp"

android:src="@drawable/qq" />

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textSize="50sp"

android:textStyle="bold"

android:text="QQ"/>

android:id="@+id/body"

android:layout_width="320dp"

android:layout_height="wrap_content"

android:orientation="horizontal"

android:layout_centerHorizontal="true"

android:background="@drawable/editview"

android:layout_below="@+id/head">

android:id="@+id/image"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_toLeftOf="@+id/number"

android:layout_marginRight="27dp"

android:background="@drawable/touxiang"

android:layout_centerVertical="true" />

android:id="@+id/number"

android:layout_width="150dp"

android:layout_height="60dp"

android:layout_centerHorizontal="true"

android:background="@null"

android:inputType="number" />

android:id="@+id/spinner"

android:layout_width="40dp"

android:layout_height="60dp"

android:layout_marginLeft="20dp"

android:layout_centerVertical="true"

android:layout_toRightOf="@+id/number" />

android:id="@+id/body2"

android:layout_width="320dp"

android:layout_height="60dp"

android:layout_below="@+id/body"

android:layout_centerHorizontal="true"

android:layout_marginTop="16dp"

android:background="@drawable/editview">

android:id="@+id/visible"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_toLeftOf="@+id/password"

android:layout_marginRight="27dp"

android:background="@drawable/touxiang"

android:layout_centerVertical="true"/>

android:id="@+id/password"

android:layout_width="150dp"

android:layout_height="60dp"

android:background="@null"

android:layout_centerHorizontal="true"

android:layout_centerVertical="true"

android:layout_marginTop="14dp"

android:inputType="textPassword" />

android:id="@+id/load"

android:layout_width="70dp"

android:layout_height="63dp"

android:layout_below="@+id/body2"

android:layout_centerHorizontal="true"

android:layout_marginTop="113dp"

android:background="@drawable/button"

android:src="@drawable/circle2" />

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_centerHorizontal="true"

android:layout_alignParentBottom="true"

android:layout_marginBottom="40dp">

android:id="@+id/text_top"

android:layout_width="match_parent"

android:layout_height="wrap_content">

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textStyle="bold"

android:autoLink="web"

android:textColor="#090000"

android:layout_marginLeft="100dp"

android:text="忘記密碼"/>

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textStyle="bold"

android:autoLink="web"

android:textColor="#090000"

android:layout_marginLeft="240dp"

android:text="用戶注冊"/>

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_below="@+id/text_top"

android:orientation="horizontal">

android:id="@+id/agree"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginLeft="100dp"

android:text="登陸后代表閱讀并同意"/>

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textStyle="bold"

android:autoLink="web"

android:textColor="#090000"

android:layout_toRightOf="@+id/agree"

android:text="服務條款"/>

總結

以上是生活随笔為你收集整理的android qq登陆界面代码下载,【Android Demo】QQ登陆界面（一）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。