Android miniTwitter登录界面

导读:一个非常细致的登录界面解析,当我们看见一个界面的时候,大家就应该明白把他们都给分开,这样我们在写代码的时候就会非常的方便,也就是一个一个的来实现。

 

布局分析:分成三个部分,该Activity是一个无标题的,设置无标题需要在setContentView之前设置,否则会报错,

1 requestWindowFeature(Window.FEATURE_NO_TITLE);
2 setContentView(R.layout.login);
第一部分是一个带渐变色背景的LinearLayout布局,关于背景渐变色请参照 android小技巧:android 背景渐变色(shape,gradient)  ,
1 "1.0" encoding="UTF-8"?>
2 "http://schemas.android.com/apk/res/android">
3 "#55FFFFFF" />
4
6 "10dp" android:topRightRadius="10dp"
7 android:bottomRightRadius="10dp" android:bottomLeftRadius="10dp"/>
8
  solid表示填充色,这里填充的是淡蓝色。 corners是设置圆角。 dp (即dip,device independent pixels)设备独立像素:这个和设备硬件有关,一般我们为了支持WVGA、HVGA和QVGA ,不依赖像素。 在android上开发的程序将会在不同分辨率的手机上运行。为了让程序外观不至于相差太大,所以引入了dip的概念。比如定义一个矩形10 x 10dip. 在分辨率为160dpi 的屏上,比如G1,正好是10 x 10像素。 而在240 dpi 的屏,则是15 x 15 像素. 换算公式为 pixs = dips * (density/160). density 就是屏的分辨率 然后RelativeLayou的background引用此drawable,具体RelativeLayout设置如下
1
2 android:id="@+id/login_div"
3 android:layout_width="fill_parent"
4 android:layout_height="wrap_content"
5 android:padding="15dip"
6 android:layout_margin="15dip"
7 android:background="@drawable/background_login_div_bg"
8 >
9
padding 是指内边距(也就是指内容与边框的距离), layout_margin为外边距(它的上一层与边框的距离)。 接下来是区域2,为账号的文本和输入框,首先是账号的文本,代码如下:
1
2 android:id="@+id/login_user_input"
3 android:layout_width="wrap_content"
4 android:layout_height="wrap_content"
5 android:layout_alignParentTop="true"
6 android:layout_marginTop="5dp"
7 android:text="@string/login_label_username"
8 style="@style/normalText"/>
android:layout_alignParentTop 这里表示此TextView的位置处于顶部 android:layout_marginTop="5dp" 这里表示此TextView的边框与RelativeLayout的顶部边框距离有5dp 这里需要对这个TextView设置下字体颜色和字体大小,定义在res/style.xml里面  
1
定义账号的输入框,如下
1
2 android:id="@+id/username_edit"
3 android:layout_width="fill_parent"
4 android:layout_height="wrap_content"
5 android:hint="@string/login_username_hint"
6 android:layout_below="@id/login_user_input"
7 android:singleLine="true"
8 android:inputType="text"/>
android:hint 输入框里面的提示文字, android:layout_below这里是设置为在账号的文本框的下面, android:singleLine 为单行输入(即你输入回车的时候不会在换行了) android:inputType这里text表示 输入的类型为文本 区域3是密码文本和输入框,同区域2,代码如下:  
01
02 android:id="@+id/login_password_input"
03 android:layout_width="wrap_content"
04 android:layout_height="wrap_content"
05 android:layout_below="@id/username_edit"
06 android:layout_marginTop="3dp"
07 android:text="@string/login_label_password"
08 style="@style/normalText"/>
09
10 android:id="@+id/password_edit"
11 android:layout_width="fill_parent"
12 android:layout_height="wrap_content"
13 android:layout_below="@id/login_password_input"
14 android:password="true"
15 android:singleLine="true"
16 android:inputType="textPassword"
17 />
区域4,登录按钮
1
2 android:id="@+id/signin_button"
3 android:layout_width="wrap_content"
4 android:layout_height="wrap_content"
5 android:layout_below="@id/password_edit"
6 android:layout_alignRight="@id/password_edit"
7 android:text="@string/login_label_signin"
8 android:background="@drawable/blue_button"
9 />

你可能感兴趣的:(Android/AS/NDK)