《Monkey Android》第8课FrameLayout、GridLayout

GitOPEN

发布于 2019-01-29 10:57:56

3990

发布于 2019-01-29 10:57:56

文章被收录于专栏：来自GitOPEN的技术文摘来自GitOPEN的技术文摘

通过本节课可以学习到的内容：

FrameLayout的用法
GridLayout的用法

实例代码:

运行效果参见本课程示例App：安卓猴Demos
github地址：https://github.com/git0pen/MonkeyAndroid

FrameLayout

帧布局，在这种布局下，每个添加的子控件都被放在布局的左上角，并覆盖在前一个子控件的上层；此外，FrameLayout中的子控件的位置不能被指定。

GridLayout

自Android4.0版本（API level 14）后，新增的网格布局。

注意： 如果要达到网格的效果，推荐使用LinearLayout来实现，因为使用GridLayout会产生如下问题：

不能同时在(x,y)轴方向上进行控件的对齐；
当多层布局嵌套的时候会出现性能问题；
不能稳定地支持一些支持自由编辑布局的工具。

计算器界面

用GridLayout和Button模仿了一个计算器的按键界面。

布局源码

<?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"
  >

  <FrameLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    >

    <TextView
      android:id="@+id/textView"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="北京"
      android:textColor="#898989"
      android:textSize="18sp"
      />

    <TextView
      android:id="@+id/textView2"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="上海"
      android:textColor="#108939"
      android:textSize="22sp"
      />

    <TextView
      android:id="@+id/textView3"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="广州"
      android:textColor="#103339"
      android:textSize="26sp"
      />

    <TextView
      android:id="@+id/textView4"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="南京"
      android:textColor="#efec1c"
      android:textSize="26sp"
      />

    <TextView
      android:id="@+id/textView5"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="东莞"
      android:textColor="#ff5e00"
      android:textSize="30sp"
      />

    <TextView
      android:id="@+id/textView6"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="深圳"
      android:textColor="#ae00ff"
      android:textSize="36sp"
      />
  </FrameLayout>

  <GridLayout
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    android:layout_gravity="center"
    android:layout_weight="2"
    android:columnCount="4"
    android:rowCount="6"
    >

    <Button
      android:id="@+id/button3"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="0"
      android:layout_row="0"
      android:text="C"
      />

    <Button
      android:id="@+id/button2"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="1"
      android:layout_row="0"
      android:text="DEL"
      />

    <Button
      android:id="@+id/button4"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="2"
      android:layout_row="0"
      android:text="/"
      />

    <Button
      android:id="@+id/button5"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="0"
      android:layout_row="1"
      android:text="7"
      />

    <Button
      android:id="@+id/button6"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="1"
      android:layout_row="1"
      android:text="8"
      />

    <Button
      android:id="@+id/button7"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="2"
      android:layout_row="1"
      android:text="9"
      />

    <Button
      android:id="@+id/button12"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="3"
      android:layout_row="1"
      android:text="-"
      />

    <Button
      android:id="@+id/button8"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="0"
      android:layout_row="2"
      android:text="4"
      />

    <Button
      android:id="@+id/button9"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="1"
      android:layout_row="2"
      android:text="5"
      />

    <Button
      android:id="@+id/button10"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="2"
      android:layout_row="2"
      android:text="6"
      />

    <Button
      android:id="@+id/button11"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="3"
      android:layout_row="0"
      android:text="*"
      />

    <Button
      android:id="@+id/button13"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="3"
      android:layout_row="2"
      android:text="+"
      />

    <Button
      android:id="@+id/button15"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="0"
      android:layout_row="3"
      android:text="1"
      />

    <Button
      android:id="@+id/button16"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="1"
      android:layout_row="3"
      android:text="2"
      />

    <Button
      android:id="@+id/button17"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="2"
      android:layout_row="3"
      android:text="3"
      />

    <Button
      android:id="@+id/button14"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="3"
      android:layout_gravity="fill_vertical"
      android:layout_row="3"
      android:layout_rowSpan="2"
      android:text="="
      />

    <Button
      android:id="@+id/button18"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="0"
      android:layout_columnSpan="2"
      android:layout_gravity="fill_horizontal"
      android:layout_row="4"
      android:text="0"
      />

    <Button
      android:id="@+id/button19"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="2"
      android:layout_row="4"
      android:text="."
      />

    <TextView
      android:id="@+id/textView7"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_column="0"
      android:layout_columnSpan="4"
      android:layout_gravity="fill_horizontal"
      android:layout_row="5"
      android:gravity="center"
      android:text="计算器"
      android:textColor="#000000"
      android:textSize="38sp"
      />
  </GridLayout>

</LinearLayout>