新浪微博Android客户端学习记录三：完成登录界面和授权界面

本讲完成的效果为：

登录界面的布局代码(login.xml)为：

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/main_bg" android:orientation="vertical" > <Button android:id="@+id/btn_add_accountn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="right" android:layout_marginRight="10dip" android:layout_marginTop="10dip" android:background="@drawable/add_account_d" /> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:background="@drawable/head_bg" android:gravity="center" android:layout_marginTop="20dip" android:orientation="vertical" > <ImageView android:id="@+id/imge_user_head" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/user_head" /> </LinearLayout> <Spinner android:id="@+id/spn_user_list" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/account_selete_bg" android:layout_gravity="center" android:layout_marginTop="10dip" /> <Button android:id="@+id/btn_login" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_marginTop="10dip" android:background="@drawable/login_d" android:text="@string/login" android:textColor="@color/white" android:textSize="20dip" /> </LinearLayout>

授权界面的布局(auth.xml)代码

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

授权界面中的子界面(authorize_dialog.xml)文件

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:padding="15dip" > <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/info" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="5dip" android:text="@string/authTip" android:textColor="@color/black" android:textSize="18dip" /> </LinearLayout> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="5dip" android:layout_marginRight="5dip" android:layout_marginTop="10dip" android:text="@string/authTipMsg" android:textSize="15dip" /> <RelativeLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:gravity="center" android:layout_alignParentBottom="true" > <Button android:id="@+id/btn_auth_begin" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_marginTop="10dip" android:background="@drawable/auth_begin_d" android:textColor="@color/white" android:textSize="20dip" /> </RelativeLayout> </LinearLayout>

然后再增加一个Activity（AuthActivity）就可以实现一个漂亮的界面啦

package haiyang.project.iweibo.ui; import haiyang.project.iweibo.R; import android.app.Activity; import android.app.Dialog; import android.os.Bundle; import android.view.View; public class AuthActivity extends Activity{ private Dialog dialog; @Override protected void onCreate(Bundle savedInstanceState) { // TODO Auto-generated method stub super.onCreate(savedInstanceState); this.setContentView(R.layout.auth); View digView=View.inflate(this, R.layout.authorize_dialog, null); dialog=new Dialog(this, R.style.auth_dialog); dialog.setContentView(digView); dialog.show(); } }

在实际的按钮点击过程中，点击和松开后应该为两种不同的状态，这样子点击时才有点击感，具体的实现为在res下新建drawable的文件夹，增加一个布局(login.xml)文件

<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_focused="true" android:state_enabled="true" android:state_pressed="false" android:drawable="@drawable/btn_bg_n" /> <item android:state_enabled="true" android:state_pressed="true" android:drawable="@drawable/btn_bg_p" /> <item android:state_enabled="true" android:state_checked="true" android:drawable="@drawable/btn_bg_p" /> <item android:drawable="@drawable/btn_bg_n" /> </selector>

这个文件可以实现点击和松开某个按钮时分别为不同的图像，涉及到类似功能实现的操作都是用这种方法，此讲中用到三处（一个登录按钮、一个下拉框、一个开始按钮），由于类似，此文不一一列出。

再就是让授权界面的提示文字友好的显示(authorize_dialog_style)：

<?xml version="1.0" encoding="utf-8"?> <resources> <style name="auth_dialog" parent="@android:style/Theme.Dialog"> <item name="android:windowFrame">@null</item> <!-- Dialog的windowFrame框为无 --> <item name="android:windowIsFloating">true</item> <!-- 是否浮现在activity之上 --> <item name="android:windowIsTranslucent">false</item> <!-- 是否半透明 --> <item name="android:windowNoTitle">true</item> <item name="android:windowBackground">@drawable/dialog_bg</item> <item name="android:backgroundDimEnabled">false</item> </style> </resources>

总结一下，本讲学习到得新内容为：实现点击按钮（或下拉框）等操作时两种不同状态的不同效果，以及使界面更友好。