android 练习之路 (二)
项目的github地址:https://github.com/Qunter/SearchAndCall
------------------------------------------------------------------------
今天课确实有点多了,今天就把登录页面做一下吧,反正button的样式定义好了,背景图片找到了之后做注册页面也很快,明天就把注册页面做完以及把对应功能实现
改还是在之前建的那个activity_login里改
最后实现的效果大致是这样
从按钮开始说吧,首先得有一个shape来定义,让他变成圆角按钮
shape_button.xml
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <solid android:color="#00ff00ff"/> <corners android:radius="8px"/> <stroke android:color="#ffffff" android:width="2px"/> </shape>
solid里的color其实啥颜色不重要,主要是前面的00,让它变成透明的
然后要实现波纹效果,于是就有了
ripple_button.xml
<?xml version="1.0" encoding="utf-8"?> <ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="#FF21272B"> <item> <shape android:shape="rectangle"> <solid android:color="#0099FF" /> <corners android:radius="10dp" /> </shape> </item> <item android:drawable="@drawable/shape_button" /> </ripple>
然后只需要在button里的background里引用这个ripple_button就行了
之后这些控件的那个白色的底色色块,我们用一个LinearLayout来实现,还是定义一个shape,不过这次不用做透明色
background_white.xml
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <solid android:color="#ffffff"/> <corners android:radius="8dp"/> </shape>
最后在activity_login里使用一下
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/background"> <ImageView android:layout_width="200dp" android:layout_height="wrap_content" android:src="@drawable/backgroundlogo" android:id="@+id/imageView" android:layout_marginTop="50dp" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" /> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="170dp" android:background="@drawable/background_white" android:orientation="vertical" android:layout_marginLeft="16dp" android:layout_marginRight="16dp"> <EditText android:id="@+id/login_username" android:layout_width="match_parent" android:layout_height="50dp" android:layout_marginTop="20dp" android:layout_marginLeft="16dp" android:layout_marginRight="16dp" android:singleLine="true" android:hint="帐号/手机号/邮箱" android:drawableRight="@drawable/id" android:drawablePadding="5dp"/> <EditText android:id="@+id/login_password" android:layout_width="match_parent" android:layout_height="50dp" android:layout_marginTop="20dp" android:layout_marginLeft="16dp" android:layout_marginRight="16dp" android:singleLine="true" android:drawableRight="@drawable/password" android:drawablePadding="5dp" android:inputType="textPassword" android:hint="登录密码"/> <Button android:layout_width="match_parent" android:layout_height="40dp" android:layout_marginTop="20dp" android:layout_marginLeft="16dp" android:layout_marginRight="16dp" android:background="@drawable/ripple_button" android:textColor="#ffffff" android:text="登录"/> <Button android:layout_width="match_parent" android:layout_height="40dp" android:layout_marginTop="20dp" android:layout_marginLeft="16dp" android:layout_marginRight="16dp" android:background="@drawable/ripple_button" android:textColor="#ffffff" android:text="注册"/> <Button android:layout_width="match_parent" android:layout_height="40dp" android:layout_marginTop="16dp" android:layout_marginLeft="16dp" android:layout_marginRight="16dp" android:layout_marginBottom="16dp" android:background="@null" android:textColor="#0099ff" android:text="忘记密码"/> </LinearLayout> </RelativeLayout>
大功告成了
话说今天感觉确实没做多少啊......但是上了大半天课,晚上还有事,也是很无奈