Android学习笔记 - 常用的布局

这篇具有很好参考价值的文章主要介绍了Android学习笔记 - 常用的布局。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

简介

Android中有六种的布局方式,分别是:LinearLayout(线性布局)、RelativeLayout(相对布局)、TableLayout(表格布局)、FrameLayout(帧布局)、AbsoluteLayout(绝对布局)、GridLayout(网格布局)。在开发中,我们用的最多的就是线性布局和相对布局。

LinearLayout(线性布局)

线性布局是我们在开发中用的最多的一种布局方式。我们在进行屏幕适配时用的比较多的就是LinearLayout的weight(权重属性)。

  1. 核心属性图

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档
  1. weight(权重)属性详解

  • 用法

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档

实现代码:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:tools="http://schemas.android.com/tools"    
    android:id="@+id/LinearLayout1"    
    android:layout_width="match_parent"    
    android:layout_height="match_parent"    
    android:orientation="horizontal">   
        
    <LinearLayout    
        android:layout_width="0dp"    
        android:layout_height="fill_parent"    
        android:background="#ADFF2F"     
        android:layout_weight="1"/>    
       
        
    <LinearLayout    
        android:layout_width="0dp"    
        android:layout_height="fill_parent"    
        android:background="#DA70D6"     
        android:layout_weight="2"/>    
        
</LinearLayout>  

用法归纳:

按比例划分水平方向,将涉及到的view的android:width的属性设置为0dp,然后设置android:weight属性设置比例即可。竖直方向需将android:height属性设置为0dp即可,然后设置android:weight即可。

Java代码中设置weight属性:

setLayoutParams(new LayoutParams(0, LayoutParams.WRAP_CONTENT, 1))

但是使用LinearLayout布局仍然存在一些问题。当界面比较复杂的时候,使用多层LinearLayout进行嵌套就会降低渲染速度,而且如果是listView或GridView上的item时,效率会更低。另外太多层的LinearLayout嵌套会占用更多的系统资源,还有可能引发stackoverflow,这个时候就需要RelativeLayout(相对布局)。

RelativeLayout(相对布局)

  1. 核心属性图

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档
  1. 父布局定位示意图

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档

父容器定位示意图

  1. 兄弟布局组件定位

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档

兄弟组件定位

关于兄弟组件定位最经典的例子就是"梅花布局"。

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档

梅花布局

实现代码:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:tools="http://schemas.android.com/tools"    
    android:id="@+id/RelativeLayout1"    
    android:layout_width="match_parent"    
    android:layout_height="match_parent" >    
    
    <!-- 这个是在容器中央的 -->    
        
    <ImageView    
        android:id="@+id/img1"     
        android:layout_width="80dp"    
        android:layout_height="80dp"    
        android:layout_centerInParent="true"    
        android:src="@drawable/pic1"/>    
        
    <!-- 在中间图片的左边 -->    
    <ImageView    
        android:id="@+id/img2"     
        android:layout_width="80dp"    
        android:layout_height="80dp"    
        android:layout_toLeftOf="@id/img1"    
        android:layout_centerVertical="true"    
        android:src="@drawable/pic2"/>    
        
    <!-- 在中间图片的右边 -->    
    <ImageView    
        android:id="@+id/img3"     
        android:layout_width="80dp"    
        android:layout_height="80dp"    
        android:layout_toRightOf="@id/img1"    
        android:layout_centerVertical="true"    
        android:src="@drawable/pic3"/>    
        
    <!-- 在中间图片的上面-->    
    <ImageView    
        android:id="@+id/img4"     
        android:layout_width="80dp"    
        android:layout_height="80dp"    
        android:layout_above="@id/img1"    
        android:layout_centerHorizontal="true"    
        android:src="@drawable/pic4"/>    
        
    <!-- 在中间图片的下面 -->    
    <ImageView    
        android:id="@+id/img5"     
        android:layout_width="80dp"    
        android:layout_height="80dp"    
        android:layout_below="@id/img1"    
        android:layout_centerHorizontal="true"    
        android:src="@drawable/pic5"/>    
    
</RelativeLayout>
  1. margin与padding的区别

margin代表的是偏移,比如marginleft="5dp"表示组件离容器左边缘偏移5dp;而padding代表的则是填充,比如TextView中的文字,将textView的paddingleft="5dp",则是在组件里的元素的左边填充5dp的空间。 margin针对的是容器中的组件,而padding针对的是组件中的元素。

比较实例代码如下:

<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: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" >    
    
    <Button    
        android:id="@+id/btn1"     
        android:layout_height="wrap_content"    
        android:layout_width="wrap_content"    
        android:text="Button"/>    
    <Button    
        android:paddingLeft="100dp"     
        android:layout_height="wrap_content"    
        android:layout_width="wrap_content"    
        android:text="Button"    
        android:layout_toRightOf="@id/btn1"/>    
        
    <Button    
        android:id="@+id/btn2"     
        android:layout_height="wrap_content"    
        android:layout_width="wrap_content"    
        android:text="Button"    
        android:layout_alignParentBottom="true"/>    
    <Button    
        android:layout_marginLeft="100dp"     
        android:layout_height="wrap_content"    
        android:layout_width="wrap_content"    
        android:text="Button"    
        android:layout_toRightOf="@id/btn2"     
        android:layout_alignParentBottom="true"/>    
        
</RelativeLayout> 

运行效果图:

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档

TableLayout(表格布局)

  1. 介绍

在HTML中,我们可以通过< table >< tr >< td >等属性就可以生成一个HTML的表格, 而Android中也允许我们使用表格的方式来排列组件,就是行与列的方式,就说我们这节的TableLayout! 但却不像我们后面会讲到的Android 4.0后引入的GridLayout(网格)布局一样,直接就可以设置多少行与多少列。

  1. 核心属性图

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档
  1. 如何确定行数和列数

  • 如果我们直接往TableLayout中添加组件的话,那么这个组件将占满一行!!!

  • 如果我们想一行上有多个组件的话,就要添加一个TableRow的容器,把组件都丢到里面!

  • tablerow中的组件个数就决定了该行有多少列,而列的宽度由该列中最宽的单元格决定

  • tablerow的layout_width属性,默认是fill_parent的,我们自己设置成其他的值也不会生效!!! 但是layout_height默认是wrapten——content的,我们却可以自己设置大小!

  • 整个表格布局的宽度取决于父容器的宽度(占满父容器本身)

  • 有多少行就要自己数啦,一个tablerow一行,一个单独的组件也一行!多少列则是看tableRow中 的组件个数,组件最多的就是TableLayout的列数

  1. 三个常用属性

  • 如果我们直接往TableLayout中添加组件的话,那么这个组件将占满一行!!!

  • 如果我们想一行上有多个组件的话,就要添加一个TableRow的容器,把组件都丢到里面!

  • tablerow中的组件个数就决定了该行有多少列,而列的宽度由该列中最宽的单元格决定

  • tablerow的layout_width属性,默认是fill_parent的,我们自己设置成其他的值也不会生效!!!

  • 但是layout_height默认是wrapten——content的,我们却可以自己设置大小!整个表格布局的宽度取决于父容器的宽度(占满父容器本身)

  • 有多少行就要自己数啦,一个tablerow一行,一个单独的组件也一行!多少列则是看tableRow中 的组件个数,组件最多的就是TableLayout的列数

  1. 三个常用的属性

  • android:collapseColumns:设置需要被隐藏的列的序号

  • android:shrinkColumns:设置允许被收缩的列的列序号

  • android:stretchColumns:设置运行被拉伸的列的列序号

以上三个属性的列号都是从0开始算的,比如collapseColumns = "1",对应的就是第2列。可以设置多个,使用","隔开,比如"0,2",如果是所有列都生效,则用"*"号即可。除了这三个常用属性,还有两个属性,分别就是跳格子以及合并单元格:

  • android:layout_column="2":表示的就是跳过第二个,直接显示到第三个格子处,从1开始算的

  • android:layout_span="4":表示合并4个单元格,也就说这个组件占4个单元格

属性使用实例:

①、collapseColumns(隐藏列)

在TableRow中定义5个按钮后,接着在最外层的TableLayout中添加以下属性: android:collapseColumns = "0,2"(隐藏第一与第三列)。

<TableLayout  
    android:id="@+id/TableLayout2"  
    android:layout_width="fill_parent"  
    android:layout_height="wrap_content"  
    android:collapseColumns="0,2" >  

    <TableRow>  

        <Button  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:text="one" />  

        <Button  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:text="two" />  

        <Button  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:text="three" />  

        <Button  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:text="four" />  

        <Button  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:text="five" />  
    </TableRow>  
</TableLayout>

效果图:

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档

②、stretchColumns(拉伸列)

在TableLayout中设置了四个按钮,接着在最外层的TableLayout中添加以下属性: android:stretchColumns = "1"(设置第二列为可拉伸列,让该列填满这一行所有的剩余空间)

<TableLayout    
    android:id="@+id/TableLayout2"    
    android:layout_width="fill_parent"    
    android:layout_height="wrap_content"    
    android:stretchColumns="1" >    
    
    <TableRow>    
    
        <Button    
            android:layout_width="wrap_content"    
            android:layout_height="wrap_content"    
            android:text="one" />    
    
        <Button    
            android:layout_width="wrap_content"    
            android:layout_height="wrap_content"    
            android:text="two" />    
    
        <Button    
            android:layout_width="wrap_content"    
            android:layout_height="wrap_content"    
            android:text="three" />    
    
        <Button    
            android:layout_width="wrap_content"    
            android:layout_height="wrap_content"    
            android:text="four" />                 
    </TableRow>    
</TableLayout>  

效果图:

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档

③、shrinkColumns(收缩列)

设置了5个按钮和一个文本框,在最外层的TableLayout中添加以下属性: android:shrinkColumns = "1"(设置第二个列为可收缩列)

<TableLayout  
    android:id="@+id/TableLayout2"  
    android:layout_width="fill_parent"  
    android:layout_height="wrap_content"  
    android:shrinkColumns="1" >  

    <TableRow>  

        <Button  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:text="one" />  

        <Button  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:text="two" />  

        <Button  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:text="three" />  

        <Button  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:text="four" />  

        <Button  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:text="five" />  

        <TextView  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:text="文本XX" />  
    </TableRow>  
</TableLayout>

效果图:

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档

FrameLayout(帧布局)

  1. 介绍

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

  1. 常用属性

  • android:foreground:*设置改帧布局容器的前景图像

  • android:foregroundGravity:设置前景图像显示的位置

前景图片:永远处于帧布局最上面,直接面对用户的图像,就是不会被覆盖的图片。

  1. 实例演示

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:tools="http://schemas.android.com/tools"    
    android:id="@+id/FrameLayout1"    
    android:layout_width="match_parent"    
    android:layout_height="match_parent"    
    tools:context=".MainActivity"     
    android:foreground="@drawable/logo"    
    android:foregroundGravity="right|bottom">    
    
    <TextView    
        android:layout_width="200dp"    
        android:layout_height="200dp"    
        android:background="#FF6143" />    
    <TextView    
        android:layout_width="150dp"    
        android:layout_height="150dp"    
        android:background="#7BFE00" />    
     <TextView    
        android:layout_width="100dp"    
        android:layout_height="100dp"    
        android:background="#FFFF00" />    
        
</FrameLayout>    

效果图

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档

GridLayout(网格布局)

  1. 核心属性图

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档
  1. 使用实例

效果图:

android布局方式有几种,Android学习笔记,学习,Powered by 金山文档

实现代码:

<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="#FFCCCC"
        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="+" />

    <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:layout_width="wrap_content"
        android:text="." />

    <Button android:text="0" />

    <Button android:text="=" />

</GridLayout> 

代码解析:只是"回退"与"清除"按钮横跨两列,而其他的都是直接添加的,默认每个组件都是 占一行一列,另外还有一点要注意的: 我们通过:android:layout_rowSpan与android:layout_columnSpan设置了组件横跨 多行或者多列的话,如果你要让组件填满横越过的行或列的话,需要添加下面这个属性: android:layout_gravity = "fill"

  1. 归纳

  1. 先定义组件的对其方式 android:orientation 水平或者竖直,设置多少行与多少列

  1. 设置组件所在的行或者列,记得是从0开始算的,不设置默认每个组件占一行一列

  1. 设置组件横跨几行或者几列;设置完毕后,需要在设置一个填充:android:layout_gravity = "fill"。

AbsoluteLayout(绝对布局)

  1. 介绍

AbsoluteLayout是直接通过X,Y坐标来 控制组件在Activity中的位置的!另外这个但单位是dp!

  1. 核心属性

①控制大小: android:layout_width:组件宽度

android:layout_height:组件高度

②控制位置: android:layout_x:设置组件的X坐标

android:layout_y:设置组件的Y坐标文章来源地址https://www.toymoban.com/news/detail-760975.html

到了这里,关于Android学习笔记 - 常用的布局的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 常用的几种布局方式---Flex 布局(垂直居中展示)

    怎样让一个元素在垂直或者水平方向居中显示,可以使用css解决,但是会出现不同浏览器的兼容性问题,而flex布局解决了一个父容器和多个子元素的布局问题,从而灵活布局。 代码展示 在父标签加入display:flex后 垂直布局变成水平布局,如下图所示 在父标签中修改 后又变成

    2024年01月19日
    浏览(50)
  • Android常用布局之FrameLayout(帧布局)

    FrameLayout(帧布局)可以说是六大布局中最为简单的一个布局,这个布局直接在屏幕上开辟出一块空白的区域,当我们往里面添加控件的时候,会默认把他们放到这块区域的 左上角, 而这种布局方式却没有任何的定位方式,所以它应用的场景并不多;帧布局的大小由控件中最大的子控件

    2023年04月10日
    浏览(87)
  • Android常用布局之TableLayout(表格布局)

    TableLayout(即表格布局) 当TableLayout下面写控件、则控件占据一行的大小。(自适应一行,不留空白) 但是, 想要多个组件占据一行 ,则配合 TableRow 实现 TableLayout 继承 自LinearLayout, 因此它 完全支持 LinearLayout所支持的属性,此外,它还有其他的常用属性。 属性名称 功能描述 an

    2023年04月09日
    浏览(36)
  • Golang并发控制方式有几种?

    Go语言中的goroutine是一种轻量级的线程,其优点在于占用资源少、切换成本低,能够高效地实现并发操作。但如何对这些并发的goroutine进行控制呢? 一提到并发控制,大家最先想到到的是锁。Go中同样提供了锁的相关机制,包括互斥锁 sync.Mutex 和读写锁 sync.RWMutex ;除此之外

    2024年02月19日
    浏览(36)
  • 删除压缩包密码的方式有几种?

    压缩包文件,设置密码很简单,但是删除压缩包密码,大家可能知道的方法不太清楚,今天总结压缩包删除压缩密码的方法给大家: 方法一: 最简单、最直接的方法就是,输入压缩包密码,将压缩包文件解压出来,然后再将文件进行压缩,并且压缩文件的时候不再设置密码

    2024年02月16日
    浏览(44)
  • Android的 AlertDialog自定义布局与常用布局用法(弹窗)

    1.直接上效果图,看看是不是你们想要的效果图 2.主活动MainActivity2的代码如下

    2024年02月12日
    浏览(37)
  • SpringBoot中有几种定义Bean的方式?

    注意:@ControllerAdvice相当于对于Controller的切面,可以绑定PropertyEditor。 (类似于AOP,但是底层不是AOP实现。) 注意:@Configuration 主要标识一个Bean是一个配置Bean,利用这个Bean可以对Spring进行配置,比如扫描路径、定义其他的Bean。 这是我们其他所有方法的底层实现。 MyApplic

    2024年02月02日
    浏览(37)
  • 网络安全攻击方式有几种?常见类型介绍!

    渗透测试是为了证明网络防御按照预期计划正常运行而提供的一种机制。作为网络安全防范的一种新技术,渗透测试对于网络安全组织具有实际应用价值,那么你知道渗透测试的攻击方法有哪些吗?以下为大家详细介绍一下,希望对你们有所帮助。 目前国内外使用比较普遍的

    2024年02月11日
    浏览(39)
  • 【面试题】如何实现数组去重的?有几种方式?

     前端面试题库 ( 面试必备)              推荐:★★★★★ 地址:前端面试题库 【国庆头像】- 国庆爱国 程序员头像!总有一款适合你! 通过两层循环对数组元素进行逐一比较,然后通过splice方法来删除重复的元素。此 方法对NaN是无法进行去重的 ,因为进行比较时

    2024年02月10日
    浏览(39)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包