理解布局对于良好的Android程序设计来说很重要。在这个教程中,你将学习到所有关于线性布局的东西,它在屏幕上垂直地或水平地组织用户界面控件或者小工具。使用得当,线性布局可以作为基本的布局,基于这个布局来可以设计出许多有趣的Android程序用户界面。

什么是线性布局

线性布局是最简单,Android开发者使用得最多的布局类型之一,开发者用它来组织你们的用户界面上的控件。线性布局的作用就像它的名字一样:它将控件组织在一个垂直或水平的形式。当布局方向设置为垂直时,它里面的所有子控件被组织在同一列中;当布局方向设置为水平时,所有子控件被组织在一行中。

线性布局可以在XML布局资源文件中定义,也可以用Java代码在程序中动态的定义。

下图展示了一个包含7个TextView控件的线性布局。这个线性布局方向被设置为垂直,导致每个TextView控件被显示在一列当中。每一个TextView控件的文本属性都是一个颜色值,背景色就是这个颜色;通过将控件的layout_width属性设置为fill_parent,每个控件都拉伸到屏幕宽度。

用XML布局资源定义线性布局

设计程序用户界面最方便和可维护的方法是创建XML布局资源。这个方法极大地简化了UI设计过程,它将很多静态创建和用户界面控件的布局以及控件属性的定义移到了XML中,而不是写代码。

XML布局资源必须被存储在项目目录的/res/layout下。让我们看看前一节介绍的彩虹线性布局。这个屏幕基本上就是一个设置为铺满整个屏幕的垂直线性布局,这通过设置它的layout_width和layout_height属性为fill_parent来实现。适当地将其命名为/res/layout/rainbow.xml,XML定义如下:

android:layout_width="fill_parent"android:layout_height="fill_parent"

android:orientation="vertical">

android:layout_height="wrap_content"android:background="#f00"

android:layout_width="fill_parent"android:layout_weight=".14"

android:gravity="center"android:textColor="#000">

android:layout_height="wrap_content"android:layout_width="fill_parent"

android:layout_weight=".15"android:background="#ffa500"

android:gravity="center"android:textColor="#000">

android:layout_height="wrap_content"android:layout_width="fill_parent"

android:layout_weight=".14"android:background="#ffff00"

android:gravity="center"android:textColor="#000">

android:layout_height="wrap_content"android:layout_width="fill_parent"

android:layout_weight=".15"android:background="#0f0"android:gravity="center"

android:textColor="#000">

android:layout_height="wrap_content"android:layout_width="fill_parent"

android:layout_weight=".14"android:background="#00f"android:gravity="center"

android:textColor="#fff">

android:layout_height="wrap_content"android:layout_width="fill_parent"

android:layout_weight=".14"android:background="#4b0082"

android:gravity="center"android:textColor="#fff">

android:layout_height="wrap_content"android:layout_width="fill_parent"

android:layout_weight=".14"android:background="#ee82ee"

android:gravity="center"android:textColor="#000">

可能你会注意到这个线性布局的每一个子控件都有很多有趣的属性,包括一个叫做layout_weight的属性。一会我们会讲到更多关于它的内容。

下面两张图片展示了这个布局在设备的竖屏和横屏模式下的样子:

回忆一下,在Activity中,只需要一行有onCreate()方法的代码来在屏幕上加载和显示一个布局资源。如果这个布局资源被存储在/res/layout/rainbow.xml文件中,这行代码应该是:

setContentView(R.layout.rainbow);

用程序动态定义线性布局

你也可以通过程序来创建和配置线性布局。这通过LinearLayout(android.widget.LinearLayout)类来实现。你能在LinearLayout.LayoutParams类中找到子级细节。同样地,典型的布局参数(android.view.ViewGroup.LayoutParams),如layout_height和layout_width, 以及边距参数(ViewGroup.MarginLayoutParams)也能用在LinearLayout对象上。

使用以前介绍过的setContentView()方法代替直接加载布局资源,你需要用Java创建屏幕内容,然后向setContentView()方法提供一个父级布局对象,这个对象包括了所有要作为它的子视图展示的控件内容。在这种情况下,你的父级布局对象是线性布局。

例如,下面的代码示例了如何用程序在Activity中实例化一个线性布局并在它的onCreate()方法中将三个TextView对象放入其中:

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

// setContentView(R.layout.rainbow);

TextViewtv1=newTextView(this);

tv1.setText("FIRST");

tv1.setTextSize(100);

tv1.setGravity(Gravity.CENTER);

TextViewtv2=newTextView(this);

tv2.setTextSize(100);

tv2.setGravity(Gravity.CENTER);

tv2.setText("MIDDLE");

TextViewtv3=newTextView(this);

tv3.setTextSize(100);

tv3.setGravity(Gravity.CENTER);

tv3.setText("LAST");

LinearLayoutll=newLinearLayout(this);

ll.setOrientation(LinearLayout.VERTICAL);

ll.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));

ll.setGravity(Gravity.CENTER);

ll.addView(tv1);

ll.addView(tv2);

ll.addView(tv3);

setContentView(ll);

}

下面两张图片展示了这个布局在设备竖屏和横屏下的样子:

让我们更近一步地研究一下上面的Java代码。首先,创建并配置三个TextView控件。每个控件都有文本大小(字体大小),文本对齐,以及文本值本身。然后,创建一个垂直方向的线性布局。它的布局参数允许它填充整个父级对象(在这里就是整个屏幕),并且它的对齐导致所有子控件都排列在屏幕中间,而不是从左上角开始。每个TextView控件通过addView方法作为子控件添加到线性布局中。最后,当父级控件要在屏幕上显示时,线性布局被传到setContentView()方法中。

如你所见,当越来越多的控件要添加到屏幕时,代码量会很快地增长。为了易组织和可维护性,用程序定义并使用布局最好是用在特殊情况而不是一般情况。

探讨线性布局的重要特性和属性

现在让我们来看看有助于配置线性布局和它的子控件的一些重要属性。

一些特别的属性应用到线性布局。你会使用到线性布局最重要的属性包括:

◆方向属性(必须),取值可以是vertical或horizontal(类:LinearLayout)

◆对齐属性(可选),控制子控件在线性布局中如何排列和显示(类:LinearLayout)

◆layout_weight属性(可选,应用到每个子控件)指定每个子控件在父级线性布局中的相对重要性(类:LinearLayout.LayoutParams)

此外,通用的ViewGroup-style属性也应用到线性布局。这些属性包括:

◆通用布局参数如layout_height (必须)和layout_width (必须) (类:ViewGroup.LayoutParams)

◆边距布局参数如margin_top,margin_left,margin_right和margin_bottom (类:ViewGroup. MarginLayoutParams)

◆布局参数如layout_height和layout_width (类:ViewGroup.LayoutParams)

给子控件赋权

绝大部分线性布局的属性都是自明性的。然而layout_weight属性需要一些额外的讨论。与其它线性布局属性不同,其它属性应用在线性布局视图本身,而这个属性是应用在它的子控件上的。权值本身应该是一个数字(比如0.5,0.25,0.10,0.10,0.05),如果你把所有子控件的权值加起来等于1(100%)。

子控件的权值控件它在父线性布局中有多“重要”或者留给其多少“空间”。这一点最好通过例子来说明。让我们回到我们前面用的彩虹线性布局。为了允许所有子控件相同地“拉伸”填充线性布局,不管屏幕的大小,我们使用layout_weight来对每个TextView赋予相对权值。因为有7种我们想赋相同权值的颜色,我们将1除以7大约得到0.143.然而,既然我们想要权值之和最后为1,因此5个控件权值设为0.14,另外两个为0.15——一个微小的区别使得总和刚刚好为1,但是这对于第一个和最后一个控件来说还是很明显的。

当屏幕上有足够空间来正确的展示所有控件的时候,这个权值技巧很有效。那就是说,当空间很紧的时候,权值属性可能会被其它因素覆盖,比如视图裁剪或者在TextView下试图不环绕文本。当我们改变rainbow.xml布局文件以包含相似水平布局(layout_height 还是设置为 fill_parent)的时候,这变得很明显。

下面的两张图片展示这个相同的布局(只是改变到水平方向)在设备竖屏和横屏模式下可能的样子:

我们期望的是红色和紫色区域(权值0.15)比其它颜色(权值为0.14)会略大一些,但是显示出来却不是这样。如果你仔细看红色TextView,它应该比它边上橙色的TextView占用更多空间。然而,因为“Red”是一个短单词,而“Orange”不是,因此系统自动的作了一些冲撞调整,为了使得每个单词不会折行。这样的结果更令人高兴,但是这可能会有一些烦恼,如果这不是想要的效果的话。

总结

Android程序用户界面使用布局来定义,而线性布局是最基本的布局类型之一。线性布局允许子控件被组织在一行或一行(水平)或一列(竖直)上。子控件的位置可以使用对齐和权值属性进一步设置。

【编辑推荐】

【责任编辑:立方 TEL:(010)68476606】

点赞 0

java 界面线性布局_Android用户界面设计:线性布局相关推荐

  1. html中的布局方式,网页设计的布局方式有哪几种

    网页可以说是网站构成的基本元素.当我们轻点鼠标,在网海中遨游,一副副精彩的网页会呈现在我们面前,那么,网页的精彩与否的因素是什么呢?色彩的搭配.文字的变化.图片的处理等,这些当然是不可忽略的因素,除了 ...

  2. java界面 ppt_Java GUI图形用户界面 课件.ppt

    Java GUI图形用户界面 课件 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * ...

  3. Java面向对象实验 8 ——图形用户界面设计

    目录 1.算数运算 2.算术测试 3.选课信息 4.计算随机而变 5*.菜单文本 1.算数运算 编写一个应用程序,设计一个窗体,其中有一个JCombox组件(+.-.*./),以及2个文本框和一个富文 ...

  4. kotlin xml布局_Android工具栏教程– XML布局和Kotlin

    kotlin xml布局 Android Toolbar widget is used to create menus in the apps. We will learn how to create ...

  5. 用户与计算机的交互界面是什么,一文解读:什么是用户界面设计?

    原标题:一文解读:什么是用户界面设计? 1.先来说说 什么是用户界面 用户界面(User Interface),简称UI,是人与电子计算机系统进行交互和消息交换的媒介,是用户使用电子计算机的综合环境. ...

  6. java毕业设计——基于java+Java awt+swing的愤怒的小鸟游戏设计与实现(毕业论文+程序源码)——愤怒的小鸟游戏

    基于java+Java awt+swing的愤怒的小鸟游戏设计与实现(毕业论文+程序源码) 大家好,今天给大家介绍基于java+Java awt+swing的愤怒的小鸟游戏设计与实现,文章末尾附有本毕 ...

  7. 【java毕业设计】基于java+swing+GUI的连连看游戏设计与实现(毕业论文+程序源码)——连连看游戏

    基于java+swing+GUI的连连看游戏设计与实现(毕业论文+程序源码) 大家好,今天给大家介绍基于java+swing+GUI的连连看游戏设计与实现,文章末尾附有本毕业设计的论文和源码下载地址哦 ...

  8. MATLAB图形用户界面设计

    一.基本概念 图形用户界面(Graphical user interfaces,GUI)是由窗口.光标.按键.菜单.文字说明等组件构成的一种人与计算机通信的界面显示格式.在该系统中,允许用户使用鼠标等 ...

  9. 计算机用户界面设计方法,一文解读:什么是用户界面设计?

    1.先来说说 什么是用户界面 用户界面(User Interface),简称UI,是人与电子计算机系统进行交互和消息交换的媒介,是用户使用电子计算机的综合环境.目前对于用户界面定义比较广泛,不仅仅包含 ...

最新文章

  1. maven打jar包,导入本地jar
  2. Qt 学习之路 2(79):QML 组件
  3. 【深度学习】搞懂 Vision Transformer 原理和代码,看这篇技术综述就够了
  4. 会话(session)
  5. 前端学习(3232):高阶函数函数柯里化
  6. docker删除所有镜像_Docker 常用命令
  7. 超级简单的jQuery纯手写五星评分效果
  8. [python] 将一个序列的排序方式扩展到其他序列
  9. WORD里的背景水印为什么怎么也删除不了呢?
  10. qt bianyishiliechengxu cube
  11. 在KubeSphere中部署微服务(阡陌)+ DevOps
  12. V831——车牌识别
  13. censo7安装mysql_centos7 安装MySQL
  14. 【NeurIPS100】谷歌、Facebook、斯坦福等十篇机器学习最新论文解读
  15. 阿里巴巴高级技术专家 至简 聊工程师思维(配音版)
  16. 微型计算机主要技术指标是啥,微型计算机的主要技术指标
  17. 深入SpringBoot核心注解原理
  18. 找出N个元素的数组中最大的K个数
  19. SiamFC:Fully-Convolutional Siamese Networks for Object Tracking
  20. VMware下载及安装(附带下载地址)

热门文章

  1. 网格交易法交易规则详解 稳定盈利的科学本质
  2. MediaCodec_Analyze-2-config
  3. EYOU 文章列表如何调用自定义字段
  4. git拉取后,代码被覆盖怎么办?
  5. Zookeeper 图形化的客户端工具(ZooInspector)| 图形化的监控工具(taoKeeper)的下载和使用 | 后端开发工具Curator的高级应用
  6. 为什么我们需要虚数单位i?如何通俗理解欧拉公式?
  7. 硬盘格式化恢复软件哪个好
  8. Mycat分库分表分片方式
  9. GeoServer搭建私有地图服务,Cesium引擎加载。
  10. java的三层架构是什么_java中的三层架构