Android布局管理器介绍-低调大师

Android布局管理器介绍

2017-10-16 468

前言

一个人至少要拥有一个梦想，有一个理由坚强。心若没有栖息的地方，到哪里都是流浪。

线性布局

线性布局由LinearLayout类来代表，它会将容器里的组件一个挨着一个地排列起来。

代码示例1

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="top|center_horizontal" >

    <Button
        android:id="@+id/bn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="bn1"
                />
     <Button
        android:id="@+id/bn2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="bn2"
                />
      <Button
        android:id="@+id/bn3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="bn3"
                />
</LinearLayout>

效果1

Screenshot_20171017-140522.png

代码示例2

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="left|center_vertical" >

    <Button
        android:id="@+id/bn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="bn1"
                />
     <Button
        android:id="@+id/bn2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="bn2"
                />
      <Button
        android:id="@+id/bn3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="bn3"
                />
</LinearLayout>

效果2

Screenshot_20171017-141513.png

提示

android:orientation属性,控制各组件横向排列和竖向排列。

android:gravity属性,控制它所包含的子元素的对齐方式。

android:layout_gravity属性,设置该子元素在父容器中的对齐方式。

表格布局

表格布局由TableLayout所代表，TableLayout继承了LinearLayout，因此它的本质依然是线性布局管理器。除此之外，表格布局是通过添加TableRow、其他组件来控制表格的行数和列数。

代码示例

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

    <!-- 定义第一个表格布局，指定第二列允许收缩，第三列允许拉伸 -->
    <TableLayout android:id="@+id/tablelayout01"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:shrinkColumns="1"
        android:stretchColumns="2">

    <!-- 直接添加按钮，独自占一行 -->
    <Button
        android:id="@+id/bt1_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="独自占一行的按钮"
        />
    <TableRow>
       <Button
        android:id="@+id/bt1_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="普通按钮"
        />
        <Button
        android:id="@+id/bt1_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="收缩的按钮"
        />
         <Button
        android:id="@+id/bt1_4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="拉伸的按钮"
        />
    </TableRow>

    </TableLayout>

    <!-- 定义第二个表格布局，指定第二列隐藏 -->
    <TableLayout android:id="@+id/tablelayout02"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:collapseColumns="1">

    <!-- 直接添加按钮，独自占一行 -->
    <Button
        android:id="@+id/bt2_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="独自占一行的按钮"
        />

     <TableRow>
       <Button
        android:id="@+id/bt2_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="普通按钮"
        />
        <Button
        android:id="@+id/bt2_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="隐藏按钮"
        />
         <Button
        android:id="@+id/bt2_4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="普通按钮"
        />
    </TableRow>


    </TableLayout>

    <!-- 定义第三个表格布局，指定第二列和第三列被拉伸 -->
    <TableLayout android:id="@+id/tablelayout03"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:stretchColumns="1,2">
    <!-- 直接添加按钮，独自占一行 -->
    <Button
        android:id="@+id/bt3_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="独自占一行的按钮"
        />
        <TableRow>
           <Button
            android:id="@+id/bt3_2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="普通按钮"
            />
            <Button
            android:id="@+id/bt3_3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="拉伸按钮"
            />
             <Button
            android:id="@+id/bt3_4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="拉伸按钮"
            />
         </TableRow>
    </TableLayout>
</LinearLayout>

效果

Screenshot_20171017-143543.png

提示

android:stretchColumns属性,设置允许被拉伸的列的列序号。

android:shringkColumns属性,设置允许被收缩的列的列序号。

android:collapseColumns属性,设置需要被隐藏的列的列序号。

上述属性如果有多个列序号，直接用逗号隔开。

帧布局

帧布局由FrameLayout所代表，FrameLayout直接继承了ViewGroup组件。

代码示例

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    <!-- 依次定义6个TextView，先定义的TextView位于底层 -->

    <TextView
        android:id="@+id/view01"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:width="320pt"
        android:height="320pt"
        android:background="#f00"
        />

    <TextView
        android:id="@+id/view02"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:width="280pt"
        android:height="280pt"
        android:background="#0f0"
        />

    <TextView
        android:id="@+id/view03"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:width="240pt"
        android:height="240pt"
        android:background="#00f"
        />

    <TextView
        android:id="@+id/view04"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:width="200pt"
        android:height="200pt"
        android:background="#ff0"
        />

    <TextView
        android:id="@+id/view05"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:width="160pt"
        android:height="160pt"
        android:background="#f0f"
        />
    <TextView
        android:id="@+id/view06"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:width="120pt"
        android:height="120pt"
        android:background="#0ff"
        />
</FrameLayout>

效果

Screenshot_20171017-150702.png

提示

帧布局的效果是把组件一个个地叠加在一起。

相对布局

相对布局由RelativeLayout所代表，相对布局容器内子组件的位置总是相对兄弟组件、父容器来决定的。

代码示例

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

    <!-- 定义该组件位于父容器直中间 -->
    <Button
        android:id="@+id/bt0"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="中心按钮"
        android:layout_centerInParent="true"
        />

    <!-- 定义该组件位于bt0组件的上方 -->
    <Button
        android:id="@+id/bt1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="上方按钮"
        android:layout_above="@id/bt0"
        android:layout_alignLeft="@id/bt0"
        />

    <!-- 定义该组件位于bt0组件的下方 -->
    <Button
        android:id="@+id/bt2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="上方按钮"
        android:layout_below="@id/bt0"
        android:layout_alignLeft="@id/bt0"
     />
    <!-- 定义该组件位于bt0组件的左侧 -->
    <Button
        android:id="@+id/bt3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="左侧按钮"
        android:layout_toLeftOf="@id/bt0"
        android:layout_alignTop="@id/bt0"
     />
    <!-- 定义该组件位于bt0组件的右侧 -->
    <Button
        android:id="@+id/bt4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="右侧按钮"
        android:layout_toRightOf="@id/bt0"
        android:layout_alignTop="@id/bt0"
     />
</RelativeLayout>

效果

Screenshot_20171017-152728.png

提示

layout_above属性,控制该子组件位于给出ID组件的上方。

layout_below属性,控制该子组件位于给出ID组件的下方。

layout_toLeftOf属性,控制该子组件位于给出ID组件的左侧。

layout_toRightOf属性,控制该子组件位于给出ID组件的右侧。

layout_alignTop属性,控制该子组件与给出ID组件的上边界对齐。

layout_alignBottom属性,控制该子组件与给出ID组件下上边界对齐。

layout_alignLeft属性,控制该子组件与给出ID组件的左边界对齐

layout_alignRight属性,控制该子组件与给出ID组件的右边界对齐。

网格布局

网格布局由GridLayout所代表，它的作用类似于HTML中的table标签，它把整个容器划分成rows x columns个网格，每个网格可以放置一个组件。除此之外，也可以设置一个组件横跨多少列、纵跨多少行。

代码示例

MainActivity.java

public class MainActivity extends Activity {

    GridLayout gridLayout;

    //定义16个按钮文本
    String[] chars = new String[]
            {
                "AC","+/-","%","÷",
                "7","8","9","x",
                "4","5","6","-",
                "1","2","3","+",
                "0","00",".","="
            };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.grid);
        gridLayout = (GridLayout) findViewById(R.id.root);
        for(int i = 0; i < chars.length; i++)
        {
            Button bt = new Button(this);
            bt.setText(chars[i]);//设置按钮文本
            bt.setTextSize(40);//设置按钮的文本大小
            bt.setWidth(120);//设置按钮的宽度
            bt.setHeight(110);//设置按钮的高度
            //指定该按钮所在的行
            GridLayout.Spec rowSpec = GridLayout.spec(i / 4 + 1);
            //指定该按钮所在的列
            GridLayout.Spec columnSpec = GridLayout.spec(i % 4);
            GridLayout.LayoutParams params = new GridLayout.LayoutParams(rowSpec,columnSpec);

            //指定该按钮占满父容器
            params.setGravity(Gravity.FILL);
            gridLayout.addView(bt,params);

        }

    }


}

grid.xml

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:rowCount="6"
    android:columnCount="4"
    android:id="@+id/root"
     >
    <!-- 定义一个横跨4列的文本框，并设置该文本框的前景色、背景色等属性 -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_columnSpan="4"
        android:textSize="100sp"
        android:layout_marginLeft="2pt"
        android:layout_marginRight="2pt"
        android:padding="3pt"
        android:gravity="right"
        android:background="#eee"
        android:textColor="#000"
        android:text="0"
        />
</GridLayout>

效果

Screenshot_20171017-161435.png

提示

android:rowCount属性,设置该网格的行数量。

android:columnCount属性,设置该网格的列数量。

android:layout_rowSpan属性,设置该组件在GridLayout纵向上跨几行。

android:layout_columnSpan,设置该组件在GridLayout横向上跨几行。

绝对布局

绝对布局由AbsoluteLayout所代表。大部分时候，使用绝对布局不是一个好思路，绝对布局很难兼顾不同屏幕大小、分辨率的问题。因此AbsoluteLayout布局管理器已过时。

微信关注我们

原文链接：https://yq.aliyun.com/articles/637577

转载内容版权归作者及来源网站所有！

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。

iOS instruments trace文件解析方案

前言已很少写文章，不过这次感觉有必要写一下。因为： 1. 这个方案通过debug逆向得来，很有参考意义。 2. iOS这方面资料非常少，做这块时，无论国内外，翻遍了google，baidu都没太多合适的资料。故此，我觉得把整个流程记录下来，你可以认为这是一次iOS instruments的debug之旅。问题起因最近做iOS性能测试，要监控一段时间内App的CPU占用和网络流量。遗憾的是，iOS instruments提供的Activity Monitor和Network模板并不满足我的需求。在UI工具中，Activity Monitor只提供了CPU瞬时值，Network也只提供了总流量，它们均不提供采集样本值。由于iOS闭源，放出的资料又少，故解决此问题的方案屈指可数：（1）. 设备越狱，通过后台守护进程采集数据。 - 缺陷：新设备无法越狱。（2）. 在产品中嵌入性能数据采集模块。 - 缺陷：我不倾向在产品中嵌入测试模块；另外，该方案对第三方产品也失效。（3）. 从instruments结果文件（.trace）中尝试获取样本值。 - 缺陷...

2017-10-17

629

2017-10-17

591

资源下载

更多资源

优质分享App

近一个月的开发和优化，本站点的第一个app全新上线。该app采用极致压缩，本体才4.36MB。系统里面做了大量数据访问、缓存优化。方便用户在手机上查看文章。后续会推出HarmonyOS的适配版本。

Mario

马里奥是站在游戏界顶峰的超人气多面角色。马里奥靠吃蘑菇成长，特征是大鼻子、头戴帽子、身穿背带裤，还留着胡子。与他的双胞胎兄弟路易基一起，长年担任任天堂的招牌角色。

Eclipse

Eclipse 是一个开放源代码的、基于Java的可扩展开发平台。就其本身而言，它只是一个框架和一组服务，用于通过插件组件构建开发环境。幸运的是，Eclipse 附带了一个标准的插件集，包括Java开发工具（Java Development Kit，JDK）。

Sublime Text

Sublime Text具有漂亮的用户界面和强大的功能，例如代码缩略图，Python的插件，代码段等。还可自定义键绑定，菜单和工具栏。Sublime Text 的主要功能包括：拼写检查，书签，完整的 Python API ， Goto 功能，即时项目切换，多选择，多窗口等等。Sublime Text 是一个跨平台的编辑器，同时支持Windows、Linux、Mac OS X等操作系统。