基本登录页面的实现

来源:互联网 发布:电脑超音速录软件 编辑:程序博客网 时间:2024/06/05 10:12

                                    基本登录页面的实现

1.简单的自我介绍

   我是一名计算机系的大二学生,这个学期刚刚接触Adriod,我们的老师希望我们用写博客的方式记录下自己的学习过程及成果,我也觉得这是个很好的方式让我们理解的更加深入。在这里,我将按照我自己的理解将老师所教的编程知识记录下来。如有学术不精的地方,敬请指教。

2.Andriod基本登录页面的介绍

            大家看上面这张图片,登录页面基本由两部分组成,一部分为有点发白的登录框,一部分淡蓝色的背景。这其实是一个布局包裹一个布局所呈现出来的效果。即一个activity_login.xml文件包裹一个login_top.xml文件所呈现出来的(使用<include/>标签)。

3.login_top.xml文件




          

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"     android:background="@drawable/logintopbg_roundcorner"    >    <EditText        android:id="@+id/etName"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_alignParentLeft="true"        android:layout_alignParentTop="true"        android:background="@android:drawable/edit_text"        android:drawableLeft="@drawable/etname"        android:drawablePadding="10dp"        android:ems="10"        android:hint="@string/etName" >    </EditText>    <EditText        android:id="@+id/etPassword"        android:layout_width="match_parent"        android:layout_height="wrap_content"         android:layout_alignLeft="@+id/etName"        android:layout_below="@+id/etName"        android:background="@android:drawable/edit_text"        android:drawableLeft="@drawable/etpassword"        android:drawablePadding="10dp"        android:layout_marginTop="20dp"        android:ems="10"        android:hint="@string/etPassword"        android:inputType="textPassword"        />    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_alignLeft="@+id/etPassword"        android:layout_below="@+id/etPassword"        android:layout_marginTop="5dp"        >        <Button            android:id="@+id/btnLogin"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="@string/btnLogin"            android:background="@drawable/btn_select"            android:layout_weight="1" />        <Button            android:id="@+id/btnRegist"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="@string/btnRegist2"             android:background="@drawable/btn_select"            android:layout_weight="1"            android:layout_marginLeft="5dp"            />            </LinearLayout><p style="font-size: 18px;"></RelativeLayout></p>

(1)基本是一些易懂的代码,其中

android:background="@android:drawable/edit_text"

用的是系统定义好的背景。

(2)两个Button按钮使用的是线性布局。

4.activity_login.xml文件(呈现出来则为第一张图片) 

<span style="font-size:24px;"><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="@color/lightblue"    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=".LoginActivity" >    <include android:id="@+id/ic1"        layout="@layout/login_top1"/>       <TextView        android:id="@+id/tvForgetPass"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignRight="@id/ic1"        android:layout_below="@+id/ic1"        android:layout_marginTop="32dp"        android:layout_marginRight="16dp"        android:text="@string/tvForgetPass"         android:textAppearance="?android:attr/textAppearanceButton"        /></span><span style="font-size:18px;">    </span><span style="font-size: 18px;"><ImageView        android:id="@+id/iv"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentBottom="true"        android:layout_below="@+id/tvForgetPass"        android:layout_alignRight="@+id/ic1"        android:layout_marginBottom="20dp"        android:src="@drawable/monkey" /></RelativeLayout></span>

5.Ending Talk

       谢谢阅读,请多多指教。



         
      


0 0