[android开发]android_社交软件3_登录

这个界面涉及到LinearLayout、TableLayout和RelativeLayout等等。话不多说，先把截图弄出来先。
1.界面预览图(这个是模拟器上面的预览图)：
2.运行结果截图(这个是模拟器运行时的截图)：
大家肯定发现了，预览图和实际运行的结果是有很大差别的。 3.大纲视图(Eclipse下截的图，这个直白行了)：
4.XML代码(各个布局的说明已经很清楚了)：

1. <?xml version="1.0" encoding="utf-8"?>
2. <!-- 插入整个布局的背景图片 -->
3. <LinearLayout
4.         xmlns:android="http://schemas.android.com/apk/res/android"
5.     android:orientation="vertical"  
6.     android:background="@drawable/back"  
7.     android:layout_width="fill_parent"
8.     android:layout_height="fill_parent">
9.     <!-- QQ登录界面最上面的图片 -->
10.            <ImageView
11.             android:id="@+id/image"
12.             android:src="@drawable/qq"
13.             android:layout_width="fill_parent"
14.             android:layout_height="wrap_content"
15.             />  
16.     <!-- 水平布局，包括QQ头像和输入信息的账号和密码 -->
17.     <LinearLayout
18.             android:orientation="horizontal"
19.             android:layout_width="fill_parent"
20.             android:layout_height="wrap_content">   
21.             <!-- QQ头像，插入图片，重心垂直居中,四周扩充3个像素 -->         
22.             <ImageView
23.                     android:id="@+id/head"
24.                     android:src="@drawable/head"
25.                     android:layout_width="wrap_content"
26.                     android:layout_height="wrap_content"
27.                     android:padding="3dip"
28.                     android:layout_gravity="center_vertical"
29.             />
30.             <!-- 表格布局，包括账号和密码 -->
31.             <TableLayout
32.                     android:id="@+id/loginInfo"
33.                     android:layout_width="wrap_content"
34.                     android:layout_height="wrap_content"
35.                     android:stretchColumns="1">
36.                     <!-- 表格的第一行，账号文本和输入框，黑色粗体字，重心靠右，四周扩充5个像素 -->
37.                     <TableRow>
38.                             <!-- "账号"文本 -->
39.                             <TextView
40.                                     android:text="账号:"                                    
41.                                     android:textStyle="bold"
42.                                     android:textColor="#000000"
43.                                     android:gravity="right"   
44.                                     android:padding="5dip"                                          
45.                             />                              
46.                             <!-- "账号"输入框，文本超出TextView的宽度的情况下，出现横拉条   -->
47.                             <EditText
48.                                     android:id="@+id/username"
49.                                     android:scrollHorizontally="true"                                    
50.                             />
51.                     </TableRow>
52.                     <!-- 表格的第二行，密码和密码输入框，黑色粗体字，重心靠右，扩充5个像素 -->
53.                     <TableRow>
54.                             <!-- "密码"文本 -->
55.                             <TextView
56.                                     android:text="密码:"                                    
57.                                     android:textStyle="bold"
58.                                     android:textColor="#000000"
59.                                     android:gravity="right"   
60.                                     android:padding="5dip"                                 
61.                             />
62.                             <!-- "密码"输入框；文本超出TextView的宽度的情况下，出现横拉条  -->
63.                             <EditText
64.                                     android:id="@+id/username"
65.                                     android:password="true"
66.                                     android:scrollHorizontally="true"  
67.                             />
68.                     </TableRow>
69.             </TableLayout>            
70.     </LinearLayout>
71.     <!-- 相对布局，"记住密码"按钮和"自动登录"按钮 -->
72.     <RelativeLayout
73.             android:id="@+id/loginSet"   
74.             android:layout_height="wrap_content"
75.             android:layout_width="fill_parent">
76.             <!-- "记住密码"多选框，黑体字，左缩进5个像素，选中状态 -->
77.         <CheckBox                 
78.                 android:id="@+id/rememberPassword"
79.                 android:layout_width="wrap_content"
80.                 android:layout_height="wrap_content"
81.                 android:text="记住密码"
82.                 android:textColor="#000000"
83.                 android:checked="true"
84.                 android:layout_marginLeft="5dip"
85.                 />
86.         <!-- "自动登录"多选框，黑体字，右缩进5个像素，与"记住密码"按钮的顶部和右边对齐 -->
87.         <CheckBox
88.                 android:id="@+id/autoLogin"
89.                 android:layout_width="wrap_content"
90.                 android:text="自动登录"
91.                 android:textColor="#000000"
92.                 android:layout_height="wrap_content"
93.                 android:layout_marginRight="5dip"
94.                 android:layout_alignParentTop="true"
95.                 android:layout_alignParentRight="true"/>            
96.     </RelativeLayout>
97.     <!-- "登录"按钮，重心垂直居中，距顶部和底部3个像素，左右扩充80个像素 -->
98.     <Button
99.             android:id="@+id/login_bt"
100.             android:text="登  录 "
101.             android:paddingTop="3dip"
102.             android:paddingBottom="3dip"
103.             android:paddingLeft="80dip"
104.             android:paddingRight="80dip"            
105.             android:layout_width="wrap_content"   
106.             android:layout_height="wrap_content"            
107.             android:layout_gravity="center_horizontal"
108.             />           
109.     <!-- 绝对布局，"隐身登录"按钮和"开机振动"按钮以下部分，距顶部3个像素 -->        
110.     <RelativeLayout
111.             android:id="@+id/loginSet"   
112.             android:layout_width="fill_parent"
113.             android:layout_marginTop="3dip"
114.             android:layout_height="fill_parent">
115.             <!-- "隐身登录"按钮，左缩进5个像素，黑字体，选中状态 -->
116.         <CheckBox                 
117.                 android:id="@+id/hidingLogin"
118.                 android:layout_width="wrap_content"
119.                 android:layout_height="wrap_content"
120.                 android:layout_marginLeft="5dip"
121.                 android:text="隐身登录"
122.                 android:textColor="#000000"
123.                 android:checked="true"
124.                 />
125.         <!-- "开机振动"按钮，右缩进5个像素，黑字体，选中状态 ，与"隐身登录"按钮的顶部和右边对齐-->
126.         <CheckBox
127.                 android:id="@+id/startVibrate"
128.                 android:layout_width="wrap_content"
129.                 android:text="开机振动"
130.                 android:layout_marginRight="5dip"
131.                 android:textColor="#000000"
132.                 android:layout_height="wrap_content"
133.                 android:layout_alignParentTop="true"
134.                 android:layout_alignParentRight="true"/>   
135.         <!-- "接收群消息"按钮，左缩进5个像素，黑字体，选中状态 ，在"隐身登录"按钮的下面-->
136.         <CheckBox
137.                 android:id="@+id/receiveGroupMessage"
138.                 android:layout_width="wrap_content"
139.                 android:text="接收群消息"
140.                 android:layout_marginLeft="5dip"
141.                 android:textColor="#000000"
142.                 android:layout_height="wrap_content"
143.                 android:layout_below="@id/hidingLogin"
144.                 android:checked="true"/>
145.         <!-- "静音登录"按钮，右缩进5个像素，黑体字，选中状态，在"开机振动"按钮的下面，靠右 -->
146.         <CheckBox
147.                 android:id="@+id/silenceLogin"
148.                 android:textColor="#000000"
149.                 android:layout_width="wrap_content"
150.                 android:text="静音登录"
151.                 android:layout_marginRight="5dip"
152.                 android:layout_height="wrap_content"
153.                 android:layout_below="@+id/startVibrate"
154.                 android:layout_alignParentRight="true"
155.                 android:checked="true"/>
156.         <!-- "菜单"按钮，距离底部2个像素，上下扩充3个像素，左右扩充20个像素，与"接收群消息"按钮左对齐，底部对齐 -->
157.         <Button
158.                 android:id="@+id/menu"
159.                 android:layout_width="wrap_content"
160.                 android:layout_height="wrap_content"
161.                 android:text="菜  单"
162.                 android:paddingTop="3dip"
163.                     android:paddingBottom="3dip"
164.                     android:paddingLeft="10dip"
165.                     android:paddingRight="10dip"  
166.                     android:layout_marginBottom="2dip"
167.                 android:layout_alignParentBottom="true"
168.                 android:layout_alignLeft="@+id/receiveGroupMessage"/>
169.     </RelativeLayout>           
170. </LinearLayout>

摘自http://www.eoeandroid.com/thread-103147-1-1.html