安卓布局
- 布局的种类
- 相对布局
- 常用属性
- 测试以上属性
- 简易登录界面1
- 安卓基础控件
- padding和margin
- 设置按钮颜色变化
- 实现
- 线性布局
- 特殊属性
- 简易登录界面1
布局的种类
六大布局:线性布局LinearLayout,相对布局RelativeLayout,表格布局TableLayout,层布局FrameLayout,绝对布局AbsoluteLayout,网格布局GridLayout。
相对布局
常用属性
1、相对于父控件,例如:android:layout_alignParentTop=“true”
android:layout_alignParentTop 控件的顶部与父控件的顶部对齐;
android:layout_alignParentBottom 控件的底部与父控件的底部对齐;
android:layout_alignParentLeft 控件的左部与父控件的左部对齐;
android:layout_alignParentRight 控件的右部与父控件的右部对齐;
2、相对给定Id控件,例如:android:layout_above=“@id/**”
android:layout_above 控件的底部置于给定ID的控件之上;
android:layout_below 控件的底部置于给定ID的控件之下;
android:layout_toLeftOf 控件的右边缘与给定ID的控件左边缘对齐;
android:layout_toRightOf 控件的左边缘与给定ID的控件右边缘对齐;
android:layout_alignBaseline 控件的baseline与给定ID的baseline对齐;
android:layout_alignTop 控件的顶部边缘与给定ID的顶部边缘对齐;
android:layout_alignBottom 控件的底部边缘与给定ID的底部边缘对齐;
android:layout_alignLeft 控件的左边缘与给定ID的左边缘对齐;
android:layout_alignRight 控件的右边缘与给定ID的右边缘对齐;
3、居中,例如:android:layout_centerInParent=“true”
android:layout_centerHorizontal 水平居中;
android:layout_centerVertical 垂直居中;
android:layout_centerInParent 父控件的中央;
测试以上属性
android:layout_width=“wrap_content”
android:layout_height=“wrap_content” // 设置元素固定大小
android:background="@drawable/xf1" // 设置图片
<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"
tools:context=".MainActivity" >
<RelativeLayout
android:id="@+id/xf1"
android:layout_centerVertical="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/xf1" >
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_centerVertical="true"
android:layout_height="wrap_content"
android:background="@drawable/xf2"
android:layout_toRightOf="@id/xf1"
></RelativeLayout>
</RelativeLayout>
简易登录界面1
安卓基础控件
Button,TextView,EditText,ImageView
padding和margin
margin 指的是当前控件和父控件的边距。与其他控件相比 如按键,文本一般用margin
padding 指的是当前控件的内边距,即控件中内容距离控件的边缘的距离。与自己比 图片一般用padding
设置按钮颜色变化
btn_normal.xml
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!-- 圆角的半径 -->
<corners android:radius="10dp"/>
<!-- 填充颜色 -->
<solid android:color="#00ffff"/>
</shape>
btn_pressed.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 圆角的半径 -->
<corners android:radius="10dp"/>
<!-- 填充颜色 -->
<solid android:color="#0662f5"/>
</shape>
btn_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 正常状态 -->
<item android:drawable="@drawable/btn_normal" android:state_pressed="false"/>
<!-- 按下状态 -->
<item android:drawable="@drawable/btn_pressed" android:state_pressed="true"/>
</selector>
实现
<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/beijing"
tools:context=".MainActivity" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#00ffff"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="智能家居"
android:textSize="20dp"
android:paddingTop="5dp"
android:paddingLeft="10dp"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="35dp"
android:text="注册"
android:textSize="15dp"
android:layout_marginTop="3dp"
android:id="@+id/zc"
android:layout_alignParentRight="true"
android:background="@drawable/btn_selector2"
android:layout_marginRight="20dp"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="35dp"
android:text="查询信息"
android:textSize="15dp"
android:layout_marginTop="3dp"
android:layout_marginRight="20dp"
android:layout_toLeftOf="@id/zc"
android:background="@drawable/btn_selector2"
/>
</RelativeLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="@drawable/pic_rf"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="@drawable/card"
android:paddingLeft="100dp"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="@drawable/btn_selector"
android:text="登录"
android:layout_marginBottom="50dp"
/>
</RelativeLayout>
线性布局
特殊属性
1 android:orientation
该属性用于定义该LinearLayout内的各种控件的排列对齐方式。
有”vertical”和”horizontal”两种值,分别表示垂直对齐和水平对齐。
2 android:gravity
控件中的内容的对齐方式
3 Weight(权重)
等比例划分区域 最简单的用法:分谁 谁为0,要分的按比例划分
4 divider分割线
android:divider 设置分割的图片
android:showDividers 设置分割线所在位置可选值:none middle begining end
简易登录界面1
<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/beijing"
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" >
<LinearLayout
android:id="@+id/linearLayout1"
android:layout_width="300dp"
android:layout_height="100dp"
android:layout_centerInParent="true"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="100dp"
android:layout_weight="1"
android:divider="@drawable/zhixian"
android:orientation="vertical"
android:showDividers="middle|end" >
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:text="账号" />
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:text="密码" />
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:text="ID号" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="100dp"
android:layout_weight="6"
android:orientation="vertical" >
<EditText
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<EditText
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<EditText
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
</LinearLayout>
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/linearLayout1"
android:layout_centerHorizontal="true"
android:layout_marginTop="23dp"
android:background="@drawable/btn_selector"
android:text="确定" />
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="@+id/button1"
android:layout_alignBottom="@+id/button1"
android:layout_alignRight="@+id/linearLayout1"
android:background="@drawable/btn_selector"
android:text="帮助" />
</RelativeLayout>