App登录界面----布局篇

       我自学了3个月的Android基础，居然一个App都做不出来。在我之前学的同时居然忘记了之前学的内容。所以我现在重新开始复习，这篇文章将是我复习的开始也是基础的稳固，同时也是将来记不得了可以自我回顾的笔记。首先是从App登录开始。

       首先第一是布局，登录界面布局那就要用到控件，登录界面所需控件如下：

1.姓名     输入框   密码 输入框：就要有Textview文本控件 X 2， Editview输入文本框控件 X 2

2.立即注册  忘记密码 登录 ：就要有Button控件 X 3

既然要布局就要有布局控件：可以用RelativeLayout相对布局，LinearLayout线性布局，TableLayout表格布局，FrameLayout帧布局，AbsoluteLayout绝对布局。我要选用就就是前两个布局：RelativeLayout相对布局或者LinearLayout线性布局。

这就是我最终预想所要达到的效果：

首先打开布局文件：展开app--->res--->layout--->activity_main.xml

切换到设计模式Design:

然后从调色板Palette就是控件库拖拽出所需控件:

2个Textview,2个Editview ,3个Button.一开始布局控件就是相对布局控件，RelativeLayout相对布局控件允许通过指定显示对象相对于父容器或其他兄弟控件的相对位置结合margin，padding来进行布局。

然后我们再切换回文本模式Text:

<TextView

android:text="TextView"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

/>这就组成了一个控件。

再来解释解释RelativeLayout相对布局控件是啥意思：

上图所表现的意思就是RelativeLayout相对布局控件的特点：TextView文本控件基于父容器（RelativeLayout相对布局控件）之下，再看图：

这是拖拽的文本控件

它会自动添加默认属性：android:text="文本控件"//这是文本属性可以输入文字

android:textSize="50dp"//这是文本大小属性是控制text属性的大小

android:layout_width="wrap_content"//这是宽，选择的自适应屏幕

android:layout_height="wrap_content"这是高。

android:layout_marginTop="253dp"//重点就在这里了：在RelativeLayout相对布局下拖出的控件会有这条属性，意思是TextView相距父容器253dp的距离

android:id="@+id/textView"

android:layout_alignParentTop="true"

android:layout_centerHorizontal="true"

好了我们继续：我写的这个布局呢？只用了两个EditView控件和三个Button控件。先说EditView控件。

拖拽出来改好了各种属性但是和我的不一样，哪里不一样？有边框，边框还是圆角。怎么弄的？这是改变了它的样式。首先目录找到drawable文件按下Alt+lns键，点击Drawable resource file

那就会弹出下面这个框框好创建资源文件，File name:这是资源文件的名字，Root element:这是需要创建什么类型的资源文件。

假如没有出现这个对话框而是另外的对话框就请更换模式

将Android 目录模式切换成Project目录模式

找到drawable文件重复上面操作就会出现

名字就自己取吧，类型选择shape文件

这就是我为EditView设置的资源文件，那么怎么加载它呢？

用背景background属性来加载：@drawable/border用@选择文件位置加载就成功了。

文本框就做好了。噢！！！等等还有个属性android:hint="登录"还没介绍，这是提示语：比如请输入用户名，请输入密码，这样的提示语，只起到提示作用。范例：android:hint="请输入用户名"

好吧依次类推，Button按钮也是这样。我们先来看忘记密码，立即注册两控件这两我没这样加载资源文件，我只用了3条属性，

android:background="@null"//这条意思是背景设置路径为空，作用是消除边框。

android:shadowColor="#338AFF"//改变按钮背景颜色，让它看起来和相对布局背景融为一体。

android:textColor="#0066CC"//改变文字颜色

怎么样是不是和QQ登录界面的差不多

那再来看立即登录按钮，这个按钮我用了三个资源文件，为了让按钮按下抬起有一个变色效果，能够反馈用户视觉：您已按下按钮。

首先看按下的资源文件：

这是按下的模样，radius是设置圆角，然后是按下后的颜色。

再来看抬起：

这是抬起时候的样子，圆角按下抬起都要设置一样，不然按下是一个样，抬起又是另一个样子，然后是抬起的颜色。

这是两个资源文件，如何让按钮呈现出按下抬起的不同效果呢？

就需要另一个资源文件来操控：selector资源文件

由他来控制这两个资源文件：

<item/>这是资源文件的标签，包括shape资源文件的：<corners/><solid/>都是标签

标签<item/>里面

android:drawable="@drawable/clickroundedcolor"//是加载按下资源文件，

android:state_pressed="true"//true就是对，就是一个判断作用，判断是否按下，按下就加载按下的资源文件

然后再一个子标签<item/>

<item android:drawable="@drawable/roundedcolor"/>也就是说当上面pressed不为true的时候执行下面这个标签加载抬起状态的效果。

这就做成了按下深蓝抬起浅蓝的颜色效果。那今天就到这里，复习到了什么Editview Button控件的使用然后在原来的基础上学到了EditView 和Button控件的UI设计一些细节效果。

还熟悉了Android studio。之前用Eclipse学习的Android,现在改用AS还特别不习惯，希望复习后我会熟练Android studio。恩，还有看到忘记密码，立即注册两个按钮是不是还会联想到还有两个布局。没错，忘记密码和立即注册这两个布局文件，就不用记录了，相信会了登录主界面布局，其他两个不在话下。