Walker登录界面的实现分析

来源：互联网发布：php 开源多用户商城编辑：程序博客网时间：2024/05/22 20:48

一、界面效果图：

二、登录界面的布局分析

1、login.xml

Step1：首先建立drawable文件夹，创建logintopbg_roundcorner.xml

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" >    <solid android:color="#55FFFFFF"/>    <corners android:radius="10dp"/></shape>

Step2：创建btu_select.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android" >    <!--     按钮点击和不点击的效果    属性：    android：state_pressed:    false:未按下    true:按下     -->     <item android:drawable="@drawable/btu_shape" android:state_pressed="false"/>     <item android:drawable="@drawable/btu_shape_after" android:state_pressed="true"/></selector>

其中btu_shape.xml文件和btn_shape_after.xml

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" >    <solid        android:color="#FF72CAE1"/>    <corners         android:radius="10dp"/></shape>

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" >    <!-- solid:填充色 corners：边角的弧度 -->    <solid         android:color="#87cefa"/>    <corners        android:radius="10dp"/></shape>

Step3:定义login.xml文件，布局如下

2、activity_login.xml文件

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="@drawable/loginbg"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"    tools:context=".MainActivity" >    <include         android:id="@+id/include1"        layout="@layout/login_top"/>    <TextView        android:id="@+id/tvForgetPass"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignRight="@+id/include1"        android:layout_below="@+id/include1"        android:layout_marginRight="16dp"        android:layout_marginTop="23dp"        android:text="@string/tvforgetpass"         android:textAppearance="?android:attr/textAppearanceMedium"/>    <ImageView         android:id="@+id/imageView1"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentBottom="true"        android:layout_alignRight="@+id/include1"        android:layout_marginBottom="20dp"/></RelativeLayout>

0 0