zoukankan      html  css  js  c++  java
  • Android 布局之FrameLayout

    Android 布局之FrameLayout


    1 FrameLayout简介

    对于FrameLayout,官方介绍是:
    FrameLayout is designed to block out an area on the screen to display a single item. Generally, FrameLayout should be used to hold a single child view, because it can be difficult to organize child views in a way that's scalable to different screen sizes without the children overlapping each other. You can, however, add multiple children to a FrameLayout and control their position within the FrameLayout by assigning gravity to each child, using the android:layout_gravity attribute.

    即,设计FrameLayout是为了显示单一项widget。通常,不建议使用FrameLayout显示多项内容;因为它们的布局很难调节。不用layout_gravity属性的话,多项内容会重叠;使用layout_gravity的话,能设置不同的位置。layout_gravity可以使用如下取值:

    top
    将对象放在其容器的顶部,不改变其大小.

    bottom
    将对象放在其容器的底部,不改变其大小.

    left
    将对象放在其容器的左侧,不改变其大小.

    right
    将对象放在其容器的右侧,不改变其大小.

    center_vertical
    将对象纵向居中,不改变其大小.
    垂直对齐方式:垂直方向上居中对齐。

    fill_vertical
    必要的时候增加对象的纵向大小,以完全充满其容器.
    垂直方向填充

    center_horizontal
    将对象横向居中,不改变其大小.
    水平对齐方式:水平方向上居中对齐

    fill_horizontal
    必要的时候增加对象的横向大小,以完全充满其容器.
    水平方向填充

    center
    将对象横纵居中,不改变其大小.

    fill
    必要的时候增加对象的横纵向大小,以完全充满其容器.

    clip_vertical
    附加选项,用于按照容器的边来剪切对象的顶部和/或底部的内容. 剪切基于其纵向对齐设置:顶部对齐时,剪切底部;底部对齐时剪切顶部;除此之外剪切顶部和底部.
    垂直方向裁剪

    clip_horizontal
    附加选项,用于按照容器的边来剪切对象的左侧和/或右侧的内容. 剪切基于其横向对齐设置:左侧对齐时,剪切右侧;右侧对齐时剪切左侧;除此之外剪切左侧和右侧.
    水平方向裁剪


    注意: 区分“android:gravity”和“android:layout_gravity”
    android:gravity            :是对控件本身来说的,是用来设置“控件自身的内容”应该显示在“控件自身体积”的什么位置,默认值是左侧。
    android:layout_gravity:是相对于控件的父元素来说的,设置该控件在它的父元素的什么位置。


    2 FrameLayout示例

    创建一个activity,包含2组FrameLayout:1组设置android:layout_gravity属性,另1组不设置android:layout_gravity属性。

    layout文件

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >
        
        <!-- 示例1 FrameLayout内容重叠 -->
        <TextView
            android:text="示例1, FrameLayout内容重叠"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            />
        <FrameLayout 
            android:layout_width="300dp"
            android:layout_height="80dp" >
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="我是TextView,内容比较长"
                android:background="#ff0000"/>
            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="#ffff00"
                android:text="我是按钮"/>
            
        </FrameLayout>
        
        
        <!-- 示例2 FrameLayout使用layout_gravity属性 -->
        <TextView
            android:text="示例2, 设置layout_gravity"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            />
        <FrameLayout 
            android:layout_width="300dp"
            android:layout_height="120dp" >
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="文本居左"
                android:background="#ff0000"
                android:gravity="center"
                android:layout_gravity="left"
                android:layout_margin="10dp"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="文本居中"
                android:background="#ffff00"
                android:gravity="center"
                android:layout_gravity="center"/>
        </FrameLayout>
    </LinearLayout>

    点击下载:源代码

    运行效果:如图

  • 相关阅读:
    Java 位运算符和移位运算符
    String类为什么是final
    SVN server 安装 并创建用户访问
    初学JavaScript正则表达式(十一)
    初学JavaScript正则表达式(十)
    初学JavaScript正则表达式(九)
    初学JavaScript正则表达式(八)
    初学JavaScript正则表达式(七)
    初学JavaScript正则表达式(六)
    初学JavaScript正则表达式(五)
  • 原文地址:https://www.cnblogs.com/skywang12345/p/3154093.html
Copyright © 2011-2022 走看看