美文网首页
帧布局(FrameLayout)

帧布局(FrameLayout)

作者: fastcv | 来源:发表于2019-07-03 22:22 被阅读0次

    前言

    帧布局或叫层布局,从屏幕左上角按照层次堆叠方式布局,后面的控件覆盖前面的控件。该布局在开发中经常用到,因为是按层次方式布局,我们需要实现层面显示的样式时就可以采用这种布局方式,比如我们要实现一个类似百度地图的布局。(结合大佬们的博客总结的,如有侵权,麻烦联系我删除此文章)

    属性

    以下常用属性:

    属性 说明
    layout_gravity 用来设置自身相对于父元素的布局,这个属性在FrameLayout布局时会经常使用到,用来控制控件在布局中的位置,layout_gravity常用属性值有top、bottom、left、right、center、center_horizontal、center_vertical,这里的center可以让控件居于FrameLayout的中心布局,属性值可以复合使用,比如我们既要居底部布局又要垂直居中就可以这样设置:“android:layout_gravity=bottom|center_vertical

    举例

    类似于地图界面

    我们实现一个类似于百度地图的主界面:

    map.xml

    <?xml version="1.0" encoding="utf-8"?>
    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:background="@drawable/map"
        android:layout_height="match_parent">
    
        <EditText
            android:layout_width="match_parent"
            android:layout_height="40sp"
            android:background="@drawable/edit_selector"
            android:layout_marginLeft="20sp"
            android:layout_marginRight="20sp"
            android:layout_marginTop="30dp"
            android:paddingLeft="10sp"
            android:textSize="14sp"
            android:hint="搜地点、查公交、找路线"
            android:textColorHint="#aaaaaa"
            android:gravity="left|center_vertical"/>
    
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_gravity="right"
            android:layout_marginTop="80dp"
            android:layout_marginRight="20dp">
    
            <Button
                android:id="@+id/traffic"
                android:layout_width="45sp"
                android:layout_height="45sp"
                android:text="路况"
                android:textColor="#ffffff"
                android:textSize="14sp"
                android:background="@drawable/corner_black_bgborder"/>
    
            <Button
                android:id="@+id/panorama"
                android:layout_width="45sp"
                android:layout_height="45sp"
                android:text="全景"
                android:textColor="#ffffff"
                android:textSize="14sp"
                android:layout_marginTop="10dp"
                android:background="@drawable/corner_black_bgborder"/>
    
            <Button
                android:id="@+id/company"
                android:layout_width="45sp"
                android:layout_height="45sp"
                android:text="同行"
                android:textColor="#ffffff"
                android:textSize="14sp"
                android:layout_marginTop="10dp"
                android:background="@drawable/corner_black_bgborder"/>
    
        </LinearLayout>
    
        <Button
            android:id="@+id/location"
            android:layout_width="45sp"
            android:layout_height="45sp"
            android:layout_gravity="bottom"
            android:text="定位"
            android:textColor="#ffffff"
            android:textSize="14sp"
            android:layout_marginLeft="20dp"
            android:layout_marginBottom="120dp"
            android:background="@drawable/corner_black_bgborder"/>
    
    </FrameLayout>
    

    示意图:


    framelayout_map.PNG

    附加

    相关文章

      网友评论

          本文标题:帧布局(FrameLayout)

          本文链接:https://www.haomeiwen.com/subject/mcshhctx.html