Android 基础课堂
经过上一周的小课堂,我们已经成功创建一个Android工程啦,也知道了四大组件中使用最多的Activity,本周呢,按正常情况来看,我们是应该开始那个我们一直说的APP的开发了,好,那么就让我们正式进入开发吧。
既然要进入开发了,那么就让我们一步步来,首先先从搭建一个布局开始,于是乎,我们本周的小课堂,就得讲一讲Android里的五大布局了,这个嘛基础知识点,可能会比较乏味,不过还是很有必要理解的,把这些搞懂是今后做布局的第一步嘛,好了,让我们进入今天的Android基础课堂吧
第三课、五大布局
- 一、LinearLayout (线性布局)
- 什么叫做线性布局呢,其实理解起来也很简单,就是它里面的东西,都按照一定的顺序一个接着一个排放,那么一定的顺序指什么呢,在线性布局里,提供了两种布局排序方式,一种是水平的即horizontal,一种是垂直的即vertical,让我们来看看这两种布局方式吧
- 水平 horizontal:在水平布局的LinearLayout 里,内部控件是从左到右一个个排序的,最前面的在左边,最后面的在右边,具体是什么样的呢,让我们来实践一下,先看下面的这个效果图
- 聚划算三个字分别是三个控件,我们可以看到,这三个控件是从左到右进行排列的,这就是水平布局的LinearLayout ,代码如下:
- 接下来我们来看看垂直布局的LinearLayout
- 垂直 vertical:上面也讲了水平布局的了,那么垂直布局也就很好理解的,只需要把从左到右的顺序改为从上到下的顺序就是了,让我们来看看布局实现效果
- 布局代码与上面的水平的差不多:
- 我们可以看到,LinearLayout 是水平布局还是垂直布局,是通过一个叫orientation的属性来控制的,关于在代码中,有很多其他属性,在文末会给一些常用的属性的解释
- 二、RelativeLayout(相对布局)
- 相对布局是啥意思呢,就是内部各子元素按照之间的位置关系来完成布局。在此布局中的子元素里与位置相关的属性将生效。例如android:layout_below, android:layout_above, android:layout_centerVertical等。注意在指定位置关系时,引用的ID必须在引用之前,先被定义,否则将出现异常,让我们来看看实现效果:
- 在布局中,我们将“划”所对应的控件设置为水平居中,这就是一个相对位置的概念,位于父布局的水平中间,然后给“聚”所对应的控制设置的位置是在“划”的左边,给“算”所对应的控制设置的位置是在“划”的右边,所以都是通过相对位置关系来完成布局的,最后的显示效果如图,布局代码如下:
- (父布局的orientation属性是没有的,截图时候忘去掉了,由于目前没有cdn权限,比较麻烦,就不换图了,在这标注一下好了)
---
- 三、FrameLayout(帧布局)
- FrameLayout是什么样的布局呢,这个布局翻译成中文也不是那么好翻译,不是那么好懂,但是其实它的布局方式并不难,甚至可以说,是最简单的一个布局方式了,那他具体是怎么布局的呢?在FrameLayout中,所有的子元素都不能被指定放置的位置,它们统统都被放在了该区域的左上角,从左上角开始计算宽高,并且后面的子元素直接覆盖在前面的子元素之上,将前面的子元素部分和全部遮挡(具体是遮挡部分还是全部,就得看上面的布局比起下面的布局,大小问题了)。让我们来看看实现的效果:
- 在这里,我们写了三个控件,第一层的红色的,大小都为200dp,第二层为绿色的,大小都为100dp,第三次为蓝色的,大小都为50dp,然后我们可以看到,控件的显示,都是从左上角开始,并且是根据我们的层次一层层叠上去的,第一层在最下面,第二层其次,第三层在最上面,这就是FrameLayout,最简单的一个布局,完全不需要设置位置,只能是都从左上角开始布局,代码如下:
---
- 四、AbsoluteLayout(绝对布局)
- 绝对布局是什么意思呢,其实理解起来很简单,就是在这个布局里,给控件设置位置为多少,那么它实际显示的位置就是多少,所以在绝对布局中的子元素的android:layout_x和android:layout_y属性将生效,用于描述该子元素的坐标位置。屏幕左上角为坐标原点(0,0),第一个0代表横坐标,向右移动数值增大,第二个0代表纵坐标,向下移动,数值增大。在绝对布局中,控件可以完全重叠,因为它只根据x、y值来判断该显示控件的位置,如果子控件没有设置x、y值的话,那么默认将设置x、y值都为0。在实际开发中,通常不采用此布局格式,因为它的界面代码不能很好的适配各种终端,让我们来看一个例子
- 在上图显示的布局中,我们没有给红色的控件设置x、y值,所以它使用了默认的x、y值即都为0,绿色的控件,我们将它的x、y值都设为了50dp,所以它会相对于左上角顶点的位置右移50dp切下移50dp,蓝色的控件,我们将其的x、y值都设置为了100dp,所以它相对于原点向右和向下各偏移了100dp,下面看看实现代码
---
- 五、TableLayout(表格布局)
- 表格布局,从它的名字来看,大家应该也可以大概猜到它的布局方式了,没错,正如它的名字所显示的,它就是将整个所含区域分成N行N列的布局格式,一个TableLayout由许多TableRow组成,一个TableRow就代表TableLayout中的一行,既然每一行都是由一个TableRow组成的,那么每一行里的列数是由TableRow控制的,所以我们上面说的N行N列,这两个N不一定是相等的,还有甚至每一行的列数都是可以不相等的,下面让我们来看看实现效果
- 从上面的布局来看,我们将给第一行设置了一个控件,所以它只含有一列,第二行有两个控件,含有两列,第三行有三个控件,含有三列,下面看看代码实现:
- 这些只是五大布局的一些简单用法,还有很多东西的可以研究的可以学的,可以在后面的学习中慢慢深入,不同的布局结合着使用可以带来各种效果,当然了,一个好的程序员,会在能实现相同效果的情况下,去巧妙的使用布局,使得层级较少,本周的基础课堂就先讲讲五大布局,下周我们就会开始实际使用这些布局啦,让我们下周的基础课堂见吧(下面附上一些常用的xml属性,属性实在是太多了,还需要自己了解了解,下面这些只是平时可能用的比较多的)
- android:layout_width 指定组件布局宽度
- android:layout_height 指定组件布局高度
- android:alpha 设置组件透明度
- android:background 设置组件背景颜色
- android:clickable 设置组件是否可以激发单击事件
- android:foucsable 设置该组件是否可以获取焦点
- android:foucsableInTouchMode 设置组件在触摸模式下是否可以获取焦点
- android:id id,同于识别控件
- android:longClickable 设置组件是否可以响应长单击事件
- android:minHeight 设置组件的最小高度
- android:minWidth 设置组件的最小宽度
- android:onClick 绑定监听事件
- android:padding 设置四周的内部距离
- android:paddingBouttom 设置底部的内部距离
- android:paddingLeft 设置左边的内部距离
- android:paddingRight 设置右边的内部距离
- android:paddingTop 设置上面的内部距离
- android:layout_margin 设置距离四周的距离
- android:layout_marginBouttom 设置距离底部的距离
- android:layout_marginLeft 设置距离左边的距离
- android:layout_marginRight 设置距离右边的距离
- android:layout_marginTop 设置距离顶部的距离
- android:rotation 设置组件旋转的角度
- android:rotationX 设置组件绕x轴旋转的角度
- android:rotationY 设置组件绕Y轴旋转的角度
- android:scaleX 设置在水平方向上的缩放比
- android:scaleY 设置在垂直方向上的缩放比
- android:scrollX 设置水平滚动偏移量
- android:scrollY 设置垂直滚动偏移量
- android:scrollbarSize 滚动条大小
- android:scrollbarStyle 滚动条风格
- android:trasformPivotX 设置旋转中心的X坐标
- android:trasformPivotY 设置旋转中心的X坐标
- android:traslationX 设置在x方向上的位移
- android:traslationY 设置在Y方向上的位移
- android:visibility 是否可见