Android studio 六大基本布局详解_AaVictory.的博客-程序员秘密_android studio 布局

技术标签: android  六大布局  

Android中常用的布局方式有以下几种:

  • 线性布局LinearLayout

  • 相对布局RelativeLayout

  • 表格布局TableLayout

  • 层布局FrameLayout

  • 绝对布局AbsoluteLayout

  • 网格布局GridLayout

用的相对较多的是线性布局和相对布局。接下来重点演示这两种布局
其中,表格布局是线性布局的子类。网格布局是android 4.0后新增的布局。

(一)线性布局LinearLayout

线性布局中最重要的属性:orientation
horizontal(水平布局)和vertical(垂直布局)两种方式

属性名

  • orientation 布局方式,有horizontal(水平布局)和vertical(垂直布局)两种方式

  • id 组件名称

  • layout_width 该组件的宽度

  • layout_height 该组件的高度

  • layout_weight 权重

  • layout_gravity 该组件(在父容器)中的对齐方式

  • gravity 该组件所含子组件在其内部的对齐方式

  • background 设置背景图片或填充颜色

效果图

在这里插入图片描述

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:background="@color/gray"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <LinearLayout
        android:layout_marginTop="20dp"
        android:layout_width="match_parent"
        android:orientation="horizontal"
        android:layout_height="wrap_content">
        <TextView
            android:text="权重1"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"/>
        <TextView
            android:text="权重2"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"/>
        <TextView
            android:text="权重3"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"/>
        <TextView
            android:text="权重4"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"/>
        <TextView
            android:text="权重5"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"/>
    </LinearLayout>

    <LinearLayout
        android:layout_marginTop="20dp"
        android:background="@color/teal_200"
        android:layout_width="match_parent"
        android:gravity="center"
        android:layout_height="wrap_content">
        <TextView
            android:text="第一个布局"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            />
    </LinearLayout>
    <LinearLayout
        android:background="@color/purple"
        android:layout_width="match_parent"
        android:gravity="center"
        android:layout_height="wrap_content">
        <TextView
            android:text="第二个布局"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            />
    </LinearLayout>
    <LinearLayout
        android:background="@color/teal"
        android:layout_width="match_parent"
        android:gravity="center"
        android:layout_height="wrap_content">
        <TextView
            android:text="第三个布局"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            />
    </LinearLayout>
</LinearLayout>

(二)相对布局RelativeLayout

属性:

  • android:layout_marginTop=“25dip” //顶部距离
  • android:gravity=“left” //空间布局位置
  • android:layout_marginLeft="15dip //距离左边距

相对于给定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的右边缘对齐;

相对于父组件

  • android:layout_alignParentTop 如果为true,将该控件的顶部与其父控件的顶部对齐;
  • android:layout_alignParentBottom 如果为true,将该控件的底部与其父控件的底部对齐;
  • android:layout_alignParentLeft 如果为true,将该控件的左部与其父控件的左部对齐;
  • android:layout_alignParentRight 如果为true,将该控件的右部与其父控件的右部对齐;

居中

  • android:layout_centerHorizontal 如果为true,将该控件的置于水平居中;
  • android:layout_centerVertical 如果为true,将该控件的置于垂直居中;
  • android:layout_centerInParent 如果为true,将该控件的置于父控件的中央;

指定移动像素

  • android:layout_marginTop 上偏移的值;
  • android:layout_marginBottom 下偏移的值;
  • android:layout_marginLeft   左偏移的值;
  • android:layout_marginRight   右偏移的值;

效果图

在这里插入图片描述

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:background="@color/gray"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:gravity="center"
        android:background="@color/teal"
        android:text="text1"
        android:layout_width="50dp"
        android:layout_height="50dp"
        />
    <TextView
        android:id="@+id/tv_two"
        android:layout_alignParentBottom="true"
        android:gravity="center"
        android:background="@color/teal"
        android:text="text2"
        android:layout_width="50dp"
        android:layout_height="50dp"
        />
    <TextView
        android:layout_alignParentRight="true"
        android:gravity="center"
        android:background="@color/teal"
        android:text="text3"
        android:layout_width="50dp"
        android:layout_height="50dp"
        />
    <TextView
        android:layout_centerInParent="true"
        android:gravity="center"
        android:background="@color/teal"
        android:text="text5"
        android:layout_width="50dp"
        android:layout_height="50dp"
        />
    <TextView
        android:layout_above="@+id/tv_two"
        android:layout_alignParentRight="true"
        android:gravity="center"
        android:background="@color/teal"
        android:text="text4"
        android:layout_width="50dp"
        android:layout_height="50dp"
        />
</RelativeLayout>

(三)表格布局TableLayout

属性

三个常用属性

  • android:collapseColumns:设置需要被隐藏的列的序号
  • android:shrinkColumns:设置允许被收缩的列的列序号
  • android:stretchColumns:设置运行被拉伸的列的列序号

(四)帧布局FrameLayout

FrameLayout(帧布局)可以说是六大布局中最为简单的一个布局,这个布局直接在屏幕上开辟出一块空白的区域,当我们往里面添加控件的时候,会默认把他们放到这块区域的左上角,而这种布局方式却没有任何的定位方式,所以它应用的场景并不多;帧布局的大小由控件中最大的子控件决定,如果控件的大小一样大的话,那么同一时刻就只能看到最上面的那个组件!后续添加的控件会覆盖前一个!虽然默认会将控件放置在左上角,但是我们也可以通过layout_gravity属性,指定到其他的位置!

效果图

在这里插入图片描述
xml布局:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:background="@color/gray"
    android:layout_height="match_parent">
    <TextView
        android:background="#000000"
        android:layout_width="fill_parent"
        android:layout_height="180dp"/>
    <TextView
        android:background="#ffff00"
        android:layout_width="fill_parent"
        android:layout_height="130dp"/>
    <TextView
        android:background="#ff00ff"
        android:layout_width="fill_parent"
        android:layout_height="100dp"/>
    <TextView
        android:background="#00ffff"
        android:layout_width="fill_parent"
        android:layout_height="50dp"/>
</FrameLayout>

(五)绝对布局AbsoluteLayout

属性:

  • 绝对布局又可以叫做坐标布局,可以直接指定子元素的绝对位置(xy)
  • 由于手机屏幕尺寸差别比较大使用绝对定位的适应性会比较差,在屏幕的适配上有缺陷

常用属性:

  • android:foreground:*设置改帧布局容器的前景图像
  • android:foregroundGravity:设置前景图像显示的位置
  • android:layout_x=”” 控制当前子类控件的x位置
  • android:layout_y=”” 控制当前子类控件的y位置

效果图
在这里插入图片描述

.xml布局

<?xml version="1.0" encoding="utf-8"?>
<AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="match_parent"
   android:background="@color/gray"
   android:layout_height="match_parent">
   <Button
       android:id="@+id/button"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_x="26dp"
       android:layout_y="124dp"
       android:text="Button" />
   <Button
       android:id="@+id/button2"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_x="66dp"
       android:layout_y="224dp"
       android:text="Button" />

   <Button
       android:id="@+id/button3"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_x="126dp"
       android:layout_y="323dp"
       android:text="Button" />
</AbsoluteLayout>

(六)网格布局GridLayout

和之前的TableLayout(表格布局) 有点类似,不过网格布局的好处是:

  • 可以自己设置布局中组件的排列方式
  • 可以自定义网格布局有多少行,多少列
  • 可以直接设置组件位于某行某列
  • 可以设置组件横跨几行或者几列

效果图

在这里插入图片描述

.xml布局:

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/GridLayout1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:columnCount="4"
    android:orientation="horizontal"
    android:rowCount="6" >
    <TextView
        android:layout_columnSpan="4"
        android:layout_gravity="fill"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="5dp"
        android:background="#15CBE3"
        android:text="0"
        android:textSize="50sp" />

    <Button
        android:layout_columnSpan="2"
        android:layout_gravity="fill"
        android:text="回退" />

    <Button
        android:layout_columnSpan="2"
        android:layout_gravity="fill"
        android:text="清空" />

    <Button android:text="1" />

    <Button android:text="2" />

    <Button android:text="3" />
    <Button android:text="+" />


    <Button android:text="4" />

    <Button android:text="5" />

    <Button android:text="6" />
    <Button android:text="-" />


    <Button android:text="7" />

    <Button android:text="8" />

    <Button android:text="9" />
    <Button android:text="*" />


    <Button android:text="0" />
    <Button android:text="." />

    <Button android:text="=" />
    <Button android:text="/" />
</GridLayout>

<GridLayout android:layout_width=“fill_parent”:网格布局宽度为填满屏幕

<GridLayout android:layout_height=“wrap_content”:网格布局高度为包裹内容

<GridLayout android:columnCount=“4”:网格布局设置 4 列

<GridLayout android:rowCount=“6”:网格布局设置 6 行

<GridLayout android:layout_columnSpan=“2”:清空和回退横跨两列

<GridLayout android:orientation=“horizontal”:网格布局设置为水平布局

以上是六大布局基本讲解

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/afufufufu/article/details/116530968

智能推荐

jQuery入门、选择器、事件、静态方法、动画_The..Fuir的博客-程序员秘密

目录第一章-jQuery基础知识1.jQuery入门1.1.jQuery介绍1.2.jQuery安装1.3.jQuery函数1.4.jQuery对象2.jQuery选择器3.jQuery事件3.1.事件的基本使用3.2.事件代理3.3.事件类型4.jQueryDOM操作5.jQuery静态方法5.1.数组及对象操作5.2.测试操作5.3.字符串操作6.jQuery动画第一章-jQuery基础知识第一天的授课重点在于梳理与对比..

java内存泄漏分析 详细分析,使用Memory Analyzer分析内存泄漏_Guohao Li的博客-程序员秘密

概述检测内存泄漏通常采用的方式是检查内存中某些对象的数量是否存在单调递增的现象。这可以通过“在线”实时监控分析的方式或者比较不同时段的内存快照来实现。然而实时监控的方案通常并不可行,尤其是在生产环境上,得考虑到因此导致的性能消耗;并且内存泄漏的产生通常也是非常偶然的,只有在某些特定条件下才会发生。这篇文章将介绍一些使用MAT发现内存泄漏的技巧。准备工作首先一定要有足够的数据,这里指的是heap d...

LTE下行传输机制——PHICH信道_lte phich占用reg个数计算_weixin_41967965的博客-程序员秘密

在阅读本文之前,建议先看下博文《LTE-TDD HARQ(1)-上行HARQ时序》,以便更好的理解本文内容。本文主要包括的内容有:(1)什么是PHICH信道,它的作用是什么(2)怎么来唯一的标识一个PHICH信道(3)PHICH信道对应的REG实际映射的内容是什么(4)PHICH信道的位置1.什么是PHICH信道PHICH信道即物理HARQ指示信道,英文全称是Physi...

iOS开发常用第三方类库_小宇丝的博客-程序员秘密

转:https://github.com/iOShuyang/Book-Recommend-GithubObjective-C Swift Objective-C 框架搭建 Swift 基础框架 Objective-C 网络请求 Swift 网络请求及数据解析 Objective-C 数据解析 Swift 扩展框...

快速傅里叶变换(FFT)的原理、实现及代码解析(附C#源码)_imaginecaosen的博客-程序员秘密

一、离散傅里叶变换回顾与FFT的引出对于长度为N点的数字信号序列 ,定义其离散傅里叶变换为: 我们知道,利用系数 的性质可以大大减少DFT的计算量,这种算法就是快速离散傅里叶变换FFT。需要说明的是,FFT不是一种新的变换,而是一种求DFT的快速计算机算法。对

人死后的真正秘密_自由程序员的博客-程序员秘密

人死后的真正秘密这个世界上存在着太多的假象,一不留神,我们就会落入一个精心构造的陷阱。   孟婆的传说就是一个陷阱。据说,阴间的鬼魂在投生之前都要在孟婆那里喝一碗汤,这碗汤能令他忘却前生,转世投胎。这个神话千百年来被无数人深信不疑,多少个在阳间饱受苦难的灵魂,毫不犹豫地将那碗汤一饮而尽,为的是迎来一个崭新的人生。可是谁又能知道,下一步迎接他们的却是一个惊天大阴谋呢?http://ike.1

随便推点

【git】在git远程仓库中创建一个新项目并把本地代码提交上去_长城Great的博客-程序员秘密

一、确保你有管理员权限。如果你还不是管理员,请让当前管理员编辑gitosis-admin项目下的gitosis.conf文件,在[group gitosis-admin]下的members行里添加你的名字。二、把gitosis-admin项目clone下来三、现在我们来添加一个新项目。为此我们要建立一个名为 mobile 的新段落,在其中罗列手机开发团队的开发者,以及他

程序员35岁以后干什么?_前端开发35岁以后干什么_测试萌萌的博客-程序员秘密

现在35岁以上的程序员出去找工作,几乎很难获得面试机会。即使你参加面试了,跟比你小十来岁的小年轻比较,可能hr也会选择更年轻的,因为在他们身上会有更高的性价比。

TSP_旅行商问题 _贪心算法_1753942680的博客-程序员秘密

TSP_旅行商问题 - 贪心算法问题描述:代码:1.

SpringBoot找不到类异常解决_soaf boot找不到自己写的类_vsalw的博客-程序员秘密

问题描述:项目是一个Maven+SpringBoot项目,在Eclipse中运行正常,没有问题,但是用IDEA编辑的时候根本启动不了,报错一大堆,比如找不到HttpServletRequest类,找不到Hibernate的类,和找不到Tomcat初始化类,等等奇葩问题。具体看下面截图:解决了很久没有找到原因,网上查了很多也没有真正解决问题。无意间看到一个博文,说了这个问题,瞬间

SlidingMenu-master中的example怎样导入eclipse运行_Qiqihar的博客-程序员秘密

转自:http://blog.csdn.net/tj_shenzhendaxue/article/details/8617329  相信能看这篇教程的码农门都已经知道了SlidingMenu能够实现的界面效果了,就是类似于人人网或者Facebook的那种双层滑动页面,网上也有很多这方面的呢例子,但是吗,没有一个能够完整地教会大家怎么将SlidingMenu-master中的example成

leetcode -easy- 1108. Defanging an IP Address【Python】_王后溪的博客-程序员秘密

问题:Given a valid (IPv4) IP address, return a defanged version of that IP address.A defanged IP address replaces every period “.” with “[.]”.我的思路是用split(".")分割str, 再用 + “[.]” 拼接:class Solution(objec...

推荐文章

热门文章

相关标签