android界面布局
（一）LinearLayout界面编排模式
他的格式是按照线性顺序，由上往下或右左往右，逐一排列界面组件。
layout_width:中的“match_parent”表示要填满他所在的外框，而“wrap_content”表示它的大小只要满足内部所包含的界面组件即可。
android:orientation:“horizontal”表示排列方式为水平，而“vertical”表示排列方式为垂直
LinearLayout标签可以想象成一个外框，我们可以在其里面加入另外一个LinearLayout标签
我们将之前的婚姻建议程序改良一下，换成以下格式
第一层布局还是LinearLayout垂直布局，里面嵌套了一个LinearLayout水平布局，在该布局中包括性别TextView，和Spinner性别选择下拉框
再在第一层上嵌套一个LinearLayout水平布局，在该布局中包含年龄TextView和输入年龄框EditText
最后在第一层的布局上加入Button确定按钮和建议TextView
界面布局：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="@android:dimen/app_icon_size"
tools:context=".MainActivity"> <LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"> <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/sex"
android:textSize="25sp" />
<Spinner
android:id="@+id/spnSex"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:entries="@array/sex_list"
android:spinnerMode="dialog"
android:prompt="@string/spn_sex_list_prompt" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"> <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/age"
android:textSize="25sp" />
<EditText
android:id="@+id/edtAge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="number"
android:hint="@string/edt_age_hint" />
</LinearLayout>
<Button
android:id="@+id/btnOk"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="@string/btn_ok"
android:textSize="25sp" />
<TextView
android:id="@+id/txtR"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25sp" /> </LinearLayout>
页面截图：
（二）TableLayout界面布局
顾名思义，tabel就是按照表格的形式来进行排列，也就是由上往下一行接着一行，而且每一个字段都上下对齐
每一行用标签用TableRow标签包裹起来，如果想让一个TableRow中的足见按照比例使用整个Table的宽度，可以借助android:layout_weight属性
例如：
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_margin="10dp"
tools:context=".MainActivity">
<TableRow>
<TextView
android:text="姓名："
android:layout_weight="1"/>
<TextView android:text="性别："
android:layout_weight="1"/>
<TextView android:text="生日："
android:layout_weight="1"/>
</TableRow>
<TableRow>
<EditText android:text="输入姓名"
android:layout_weight="1"/>
<EditText android:text="输入性别"
android:layout_weight="1"/>
<EditText android:text="输入生日"
android:layout_weight="1"/>
</TableRow>
<Button android:text="确定"/>
</TableLayout>
程序截屏：
TableRow中的组件和上一个组件对齐，无法错开，就会形成如下图：
那么我们想要错开可以使用，在TableLayout标签中再增加一个TableLayout标签，这样就可以让不同行的字段错开
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_margin="10dp"
tools:context=".MainActivity">
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TableRow>
<TextView
android:text="姓名："
android:layout_weight="1"/>
<TextView android:text="性别："
android:layout_weight="1"/>
<TextView android:text="生日："
android:layout_weight="1"/>
</TableRow>
<TableRow>
<EditText android:text="输入姓名"
android:layout_weight="1"/>
<EditText android:text="输入性别"
android:layout_weight="1"/>
<EditText android:text="输入生日"
android:layout_weight="1"/>
</TableRow>
</TableLayout>
<TableRow>
<TextView android:text="电话：" />
<TextView android:text="地址：" />
</TableRow>
<TableRow>
<EditText android:text="请输入电话："/>
<EditText android:text="请输入地址"/>
</TableRow>
<Button android:text="确定"/>
</TableLayout>
应用截图：
（三）RelativeLayout界面编排
先做个小案例试试手：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
tools:context=".MainActivity"> <TextView
android:id="@+id/txt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="txt1" />
<TextView
android:id="@+id/txt2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="txt2"
android:layout_toRightOf="@+id/txt1" />
<EditText
android:id="@+id/edt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="edt1"
android:layout_below="@+id/txt1" />
<EditText
android:id="@+id/edt2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="edt2"
android:layout_toRightOf="@+id/edt1" />
<Button
android:id="@+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="btn1"
android:layout_below="@+id/edt1" />
</RelativeLayout>
程序截图：
可以看到两个EditText出现一高一低，没有对齐。因此我们需要给edt2加上：android:layout_alighTop="@+id/edt1"
我们重新对其编排一下
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools" android:layout_height="match_parent"
android:layout_width="400dp"
android:layout_gravity="center_horizontal"
tools:context=".MainActivity"> <TextView
android:id="@+id/txt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="txt1" />
<TextView
android:id="@+id/txt2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="txt2"
android:layout_above="@+id/edt2"
android:layout_alignLeft="@+id/edt2" />
<EditText
android:id="@+id/edt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="edt1"
android:layout_below="@+id/txt1" />
<EditText
android:id="@+id/edt2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="edt2"
android:layout_toRightOf="@+id/edt1"
android:layout_alignTop="@+id/edt1" />
<Button
android:id="@+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="btn1"
android:layout_below="@+id/edt1" />
</RelativeLayout>
猜拳游戏：
界面布局文件：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_height="match_parent"
android:layout_width="400dp"
android:layout_gravity="center_horizontal"
tools:context=".MainActivity"> <TextView
android:id="@+id/txtTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/prompt_title"
android:textColor="#FF00FF"
android:textSize="40sp"
android:textStyle="bold"
android:layout_centerHorizontal="true"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp"/>
<TextView
android:id="@+id/txtCom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/prompt_com_play"
android:layout_below="@+id/txtTitle"
android:layout_alignLeft="@+id/txtTitle"
android:textSize="20sp"
android:layout_marginBottom="20dp"
android:layout_alignStart="@+id/txtTitle" />
<TextView
android:id="@+id/txtMyPlay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/prompt_my_play"
android:layout_below="@id/txtTitle"
android:layout_alignRight="@id/txtTitle"
android:textSize="20sp"
android:layout_marginBottom="20dp"
android:layout_alignEnd="@id/txtTitle" />
<Button
android:id="@+id/btnScissors"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/play_scissors"
android:layout_below="@+id/txtMyPlay"
android:layout_alignLeft="@+id/txtMyPlay"
android:textSize="20sp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:layout_alignStart="@+id/txtMyPlay" />
<TextView
android:id="@+id/txtComPlay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/btnScissors"
android:layout_alignLeft="@+id/txtCom"
android:textSize="30sp"
android:textColor="#FF00FF"
android:layout_alignStart="@+id/txtCom" />
<Button
android:id="@+id/btnStone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/play_stone"
android:layout_below="@id/btnScissors"
android:layout_alignLeft="@id/btnScissors"
android:textSize="20sp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:layout_alignStart="@id/btnScissors" />
<Button
android:id="@+id/btnPaper"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/play_paper"
android:layout_below="@id/btnStone"
android:layout_alignLeft="@id/btnStone"
android:textSize="20sp"
android:paddingLeft="25dp"
android:paddingRight="25dp"
android:layout_alignStart="@id/btnStone" />
<TextView
android:id="@+id/txtResult"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/result"
android:layout_below="@id/btnPaper"
android:layout_alignLeft="@id/txtCom"
android:textSize="20sp"
android:textColor="#0000FF"
android:layout_marginTop="20dp"
android:layout_alignStart="@id/txtCom" /> </RelativeLayout>
字符串资源文件：
<resources>
<string name="app_name">RelativeLayout</string>
<string name="prompt_com_play">电脑出拳：</string>
<string name="prompt_my_play">玩家出拳：</string>
<string name="play_scissors">剪刀</string>
<string name="play_stone">石头</string>
<string name="play_paper">布</string>
<string name="player_win">恭喜，你赢了</string>
<string name="player_lose">很可惜，你输了</string>
<string name="player_draw">双方平手！</string>
<string name="prompt_title">和电脑猜拳</string>
<string name="result">判断输赢：</string>
</resources>
程序文件：
package com.example.relativelayout; import androidx.appcompat.app.AppCompatActivity; import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView; import org.w3c.dom.Text; public class MainActivity extends AppCompatActivity {
private TextView mTxtComPlay,mTxtResult;
private Button mBtnScissors,mBtnStone,mBtnPaper;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mTxtComPlay=(TextView)findViewById(R.id.txtComPlay);
mTxtResult=(TextView)findViewById(R.id.txtResult);
mBtnScissors=(Button)findViewById(R.id.btnScissors);
mBtnPaper=(Button)findViewById(R.id.btnPaper);
mBtnStone=(Button)findViewById(R.id.btnStone); mBtnScissors.setOnClickListener(btnScissorsOnClick);
mBtnStone.setOnClickListener(btnStoneOnClick);
mBtnPaper.setOnClickListener(btnPaperOnClick);
} private Button.OnClickListener btnScissorsOnClick=new Button.OnClickListener(){
@Override
public void onClick(View v) {
int iComPlay=(int)(Math.random()*3+1);
//1.剪刀，2.石头，3.布
if(iComPlay==1)
{
mTxtComPlay.setText(R.string.play_scissors);
mTxtResult.setText(getString(R.string.result)+getString(R.string.player_draw));
}
else if(iComPlay==2)
{
mTxtComPlay.setText(R.string.play_stone);
mTxtResult.setText(getString(R.string.result)+getString(R.string.player_lose));
}
else
{
mTxtComPlay.setText(R.string.play_paper);
mTxtResult.setText(getString(R.string.result)+getString(R.string.player_win));
}
}
};
private Button.OnClickListener btnStoneOnClick=new Button.OnClickListener(){
@Override
public void onClick(View v) {
int iComPlay=(int)(Math.random()*3+1);
//1.剪刀，2.石头，3.布
if(iComPlay==1)
{
mTxtComPlay.setText(R.string.play_scissors);
mTxtResult.setText(getString(R.string.result)+getString(R.string.player_win));
}
else if(iComPlay==2)
{
mTxtComPlay.setText(R.string.play_stone);
mTxtResult.setText(getString(R.string.result)+getString(R.string.player_draw));
}
else
{
mTxtComPlay.setText(R.string.play_paper);
mTxtResult.setText(getString(R.string.result)+getString(R.string.player_lose));
}
}
};
private Button.OnClickListener btnPaperOnClick=new Button.OnClickListener(){
@Override
public void onClick(View v) {
int iComPlay=(int)(Math.random()*3+1);
//1.剪刀，2.石头，3.布
if(iComPlay==1)
{
mTxtComPlay.setText(R.string.play_scissors);
mTxtResult.setText(getString(R.string.result)+getString(R.string.player_lose));
}
else if(iComPlay==2)
{
mTxtComPlay.setText(R.string.play_stone);
mTxtResult.setText(getString(R.string.result)+getString(R.string.player_win));
}
else
{
mTxtComPlay.setText(R.string.play_paper);
mTxtResult.setText(getString(R.string.result)+getString(R.string.player_draw));
}
}
};
}
程序截图：
android界面布局的更多相关文章
- Android界面布局基本知识简述
Android手机操作系统在模拟器中进行相关的编写,可以帮助我们实现各种功能需求.尤其是在界面的操作方面显得更为突出.在这里我们就可以对Android界面布局的相关操作来对这方面的知识进行一个深入的了 ...
- iOS中xib与storyboard原理，与Android界面布局的异同
用文本标记语言来进行布局,用的最多的应该是HTML语言.HTML能够理解为有一组特殊标记的XML语言. 一.iOS中xib与storyboard显示原理 在iOS中基本的布置界面的方式有3种:代码.x ...
- Android界面布局学习总结
参考文章: http://blog.csdn.net/shakespeare001/article/details/7843460 http://www.cnblogs.com/w-y-f/p/412 ...
- 初识android界面布局
1.活动 活动是android开发中最基本的概念,也是最容易吸引用户的地方,是一种可以包含用户界面的组件. Activity类中定义了7个回调方法,覆盖了活动生命周期的每一个环节.具体如下: (1)o ...
- 解决Android界面布局添加EditText组件后界面无法预览
错误报告: Exception raised during rendering: java.lang.System.arraycopy([CI[CII)V Exception details are ...
- Android界面布局基本属性
在 android 中我们常用的布局方式有这么几种:1.LinearLayout ( 线性布局 ) :(里面只可以有一个控件,并且不能设计这个控件的位置,控件会放到左上角) ...
- 【android学习3】解决Android界面布局添加EditView之后无法预览问题
在设计登陆界面时,拖入一个EditView之后发现界面无法预览 问题分析: 进入xml源文件里发现一个警告,提示添加inputType或者hint元素,添加后界面仍然无法预览... 仔细查看了当前使用 ...
- android 界面布局 很好的一篇总结[转]
1.LinearLayout ( 线性布局 ) :(里面只可以有一个控件,并且不能设计这个控件的位置,控件会放到左上角) 线性布局分为水平线性和垂直线性二者的属性分别为:android:orienta ...
- android 界面布局
一.LinearLayout LinearLayout 又称作线性布局,是一种非常常用的布局,它所包含的控件在线性方向上依次排列. android:orientation="horizont ...
随机推荐
- mysql数据库函数之left()、right()、substring()、substring_index()
在实际的项目开发中有时会有对数据库某字段截取部分的需求,这种场景有时直接通过数据库操作来实现比通过代码实现要更方便快捷些,mysql有很多字符串函数可以用来处理这些需求,如Mysql字符串截取总结:l ...
- 前后端分离构架 与 json ajax简介
前后端分离 传统开发方式 曾几何时,JSP和Servlet为Java带来了无限风光,一时间大红大紫,但随着互联网的不断发展,这样的开发方式逐渐显露其弊端,在移动互联网炙手可热的今天,应用程序对于后台服 ...
- Ninject 2.x细说---2.绑定和作用域
Ninject 2.x细说---2.绑定和作用域 转载weixin_33725272 最后发布于2011-11-06 00:03:00 阅读数 9 收藏 Ninject中提供多种接口和实现类的绑 ...
- Nginx中常见问题与错误处理
1.400 bad request错误的原因和解决办法 配置nginx.conf相关设置如下. client_header_buffer_size 16k;large_client_header_bu ...
- Docker 进入正在运行的容器的4种方式
在使用Docker创建了容器之后,如何进入该容器呢? 进入Docker容器比较常见的几种做法如下: 使用docker attach 使用SSH 使用nsenter 使用exec 一.使用docker ...
- Sliding Window POJ - 2823 单调队列模板题
Sliding Window POJ - 2823 单调队列模板题 题意 给出一个数列 并且给出一个数m 问每个连续的m中的最小\最大值是多少,并输出 思路 使用单调队列来写,拿最小值来举例 要求区间 ...
- js的一些基础
事件对象: 就是用来存储事件相关的信息 事件对象存储信息有: 事件的类别,如:click,keydown等等 点击事件的位置 点击的哪一个键 等等 用于阻止事件流,用于阻止浏览器默认动作(表单提交.a ...
- java.sql.SQLException: Field 'login_date' doesn't have a default value解决方法
在做web项目的insert插入操作的时候, 由于对于一个字段没有插入数据, xml文件写法如下: <insert id="savePremissUser" > ins ...
- java中一个类中的 this. 是什么作用
2)this代表的是本类的实例对象,不是什么调用本类的方法的对象.当你用new创建一个对象的时候,对象就已经在内存了.(具体的你的血jvm和反射).构造方法只是为了给对象里的属性赋值.在类里任何地方出 ...
- Redis如果内存满了怎么办？
Redis占用内存大小 我们知道Redis是基于内存的key-value数据库,因为系统的内存大小有限,所以我们在使用Redis的时候可以配置Redis能使用的最大的内存大小. 1.通过配置文件配置 ...