在设计过程中,我们经常会遇到这样的需求:

把一条线3控制,左对齐左控制,右侧控制右对齐,中间控制,以填补剩余空间。

或者一列内放3个控件,上面的与顶部对齐,以下的沉在最底部,中间控件是弹性的。充满剩余空间。

情况一:水平布局

图示:

这是第一种情形。因为涉及到ImageView。想保持图片原比例不便使用LinearLayout的weight属性。

解决的方法:

1.外层套一个RelativeLayout

2.三个控件分别装进3个LinearLayout中。假如id分别为leftlayout,midlayout,rightlayout

leftlayout属性:android:layout_width="wrap_content"

rightlayout属性:android:layout_width="wrap_content"

midlayout属性: android:layout_width="match_parent"

android:layout_toLeftOf="@+id/rightlayout"
                                   android:layout_toRightOf="@+id/leftlayout"

这样就能够达到两端控件分别左右对齐。中部控件填充剩余空间的效果。

上图效果的布局图示:

上图效果的代码:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="34dp"android:background="#FFFFFF"android:orientation="horizontal" ><LinearLayoutandroid:id="@+id/choosetags_listview_item_leftlayout"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentLeft="true"><ImageViewandroid:id="@+id/taglistview_item_ico"android:layout_width="30dp"android:layout_height="30dp"android:layout_gravity="center_vertical"android:layout_marginBottom="2dp"android:layout_marginLeft="5dp"android:layout_marginRight="5dp"android:layout_marginTop="2dp"android:contentDescription="@string/app_name"android:src="@drawable/tag_ico_movie" /></LinearLayout><LinearLayoutandroid:id="@+id/choosetags_listview_item_midlayout"android:layout_width="match_parent"android:layout_height="fill_parent"android:layout_centerVertical="true"android:layout_toLeftOf="@+id/choosetags_listview_item_rightlayout"android:layout_toRightOf="@+id/choosetags_listview_item_leftlayout" ><com.coolletter.util.MarqueeTextViewandroid:id="@+id/taglistview_item_name"android:layout_width="fill_parent"android:layout_height="fill_parent"android:layout_gravity="center_vertical"android:checkMark="?android:attr/textCheckMark"android:ellipsize="marquee"android:focusableInTouchMode="true"android:gravity="center_vertical"android:marqueeRepeatLimit="marquee_forever"android:paddingEnd="5dp"android:paddingStart="5dp"android:scrollHorizontally="true"android:singleLine="true"android:textColor="#000000"android:textSize="15dp" /></LinearLayout> <LinearLayoutandroid:id="@+id/choosetags_listview_item_rightlayout"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentRight="true"android:layout_centerVertical="true" ><TextViewandroid:id="@+id/taglistview_item_newnum"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:text="253"android:textColor="#000000" ></TextView>   </LinearLayout></RelativeLayout>

情形二:垂直布局

图示:

垂直布局方案:

1.外层放一个RealtiveLayout

2.内部三个控件分别装进3个LinearLayout中,id设为topayout。midlayout,bottomlayout

toplayout属性:android:layout_width="wrap_content"

bottomlayout属性:android:layout_width="wrap_content"

midlayout属性: android:layout_width="match_parent"

android:layout_below="@+id/toplayout"
                                   android:layout_above="@+id/bottomlayout"

布局:

代码:

<?xml version="1.0" encoding="utf-8"?

> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="#DCDCDC" android:orientation="vertical" > <LinearLayout android:id="@+id/letter_newtext_toplayout" android:layout_width="fill_parent" android:layout_height="45dp" android:layout_alignParentTop="true" android:background="#FFFAF0" android:orientation="horizontal" > <TextView android:id="@+id/letter_newtext_cancel" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_marginBottom="5dp" android:layout_marginTop="5dp" android:layout_weight="1" android:gravity="center_horizontal" android:text="Cancel" android:textColor="#000000" android:textSize="16dp" /> <TextView android:id="@+id/letter_newtext_submit" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_marginBottom="5dp" android:layout_marginTop="5dp" android:layout_weight="1" android:gravity="center_horizontal" android:text="Submit" android:textColor="#000000" android:textSize="16dp" /> </LinearLayout> <LinearLayout android:id="@+id/letter_newtext_mainlayout" android:layout_width="fill_parent" android:layout_height="match_parent" android:layout_above="@+id/letter_newtext_deliver" android:layout_below="@+id/letter_newtext_toplayout" android:orientation="vertical" > <EditText android:id="@+id/letter_newtext_content" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_marginBottom="5dp" android:layout_marginLeft="5dp" android:layout_marginRight="5dp" android:layout_marginTop="5dp" android:background="@drawable/corners_bg" android:gravity="top" android:inputType="textMultiLine" android:textColor="#000000" /> </LinearLayout> <View android:id="@+id/letter_newtext_deliver" android:layout_above="@+id/letter_newtext__bottomlayout" android:layout_width="fill_parent" android:layout_height="0.5dp" android:background="#00BFFF" /> <LinearLayout android:id="@+id/letter_newtext__bottomlayout" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_marginBottom="5dp" android:layout_marginTop="5dp" android:gravity="bottom" android:orientation="horizontal" > <ImageView android:id="@+id/letter_newtext_ico_tag" android:layout_width="30dp" android:layout_height="30dp" android:layout_marginLeft="5dp" android:background="@drawable/letter_new_ico_maintag" /> <TextView android:id="@+id/letter_newtext_tag_content" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="bottom" android:layout_marginLeft="5dp" android:layout_marginRight="5dp" android:textColor="#000000" android:textSize="15dp" /> </LinearLayout> </RelativeLayout>

当这样的情况中间的控件是一个ScrollView时,也使用这样的办法。

就能实现ScrollView充满上下两个控件中间的区域。

版权声明:本文博客原创文章。博客,未经同意,不得转载。

转载于:https://www.cnblogs.com/mengfanrong/p/4616814.html

【Android开发日记】妙用 RelativeLayout 实现3 段布局相关推荐

  1. Android开发笔记(一百四十七)标签布局TabLayout

    标签布局TabLayout是MaterialDesign库中的一个新控件,常与工具栏Toolbar搭配使用.大家平时常用的App就有不少采用了TabLayout,比如京东App的商品页,从左到右依次是 ...

  2. Android开发笔记(三十五)页面布局视图

    布局视图的类别 布局视图有五类,分别是线性布局LinearLayout.相对布局RelativeLayout.框架布局FrameLayout.绝对布局AbsoluteLayout.表格布局TableL ...

  3. Android开发日记

    Android日记 欢迎使用Markdown编辑器 新的改变 功能快捷键 合理的创建标题,有助于目录的生成 如何改变文本的样式 插入链接与图片 如何插入一段漂亮的代码片 生成一个适合你的列表 创建一个 ...

  4. 【Android开发日记】 新浪微博API SSO授权 分享

    其实新浪API的说明文档已经说的很明白了,demo里面注释也很清晰. 官方SDK下载地址:https://github.com/sinaweibosdk/weibo_android_sdk 我直接把我 ...

  5. 【Android开发日记】第一个任务Android Service!Service靴+重力感应器+弹出窗口+保持执行...

    前言: 近期在写一个小程序,需求是手机摇一摇就弹窗出来.第一次使用了Service,学习了两天,实现了Service弹窗,开机启动,Service启动和销毁,Service保持一直执行. 满足了自己的 ...

  6. Android开发日记(六)

    textViewUserName.setCursorVisible(false);//隐藏光标 textViewUserName.setFocusable(false);//失去焦点 textView ...

  7. 【Android开发日记】jsonObject = new JSONObject(info)报错 A JSONObject text must begin with '{' at character

    问题描述: JSONObject jsonObject = new JSONObject(json);报错:A JSONObject text must begin with '{' at chara ...

  8. Android 开发日记 - Bold-Italic在TextView中,最后的字会被截掉

    TextView 使用斜体|粗体时,最右侧文字被切掉. 解决方案:add paddingEnd=3dp if wrap_content or add a space to string 在部分机型上, ...

  9. Android开发笔记(序)写在前面的目录

    知识点分类 一方面写写自己走过的弯路掉进去的坑,避免以后再犯:另一方面希望通过分享自己的经验教训,与网友互相切磋,从而去芜存菁进一步提升自己的水平.因此博主就想,入门的东西咱就不写了,人不能老停留在入 ...

最新文章

  1. 今天看论坛,有这样一句话,深有同感,还是家里好
  2. 华为「硬」生生把AI搞出暴力美学
  3. 堆排序(C\C++)
  4. pandas如何获取某一个元素的行号,也就是索引值
  5. JVM专题(2)-类加载器子系统
  6. photoshop 常见问题与分析
  7. AtCoder - arc098_b Xor Sum 2(尺取+位运算)
  8. MySQL笔记——打开日志
  9. NetBeans Weekly News: #125-Nov 17,2010
  10. linux /dev/null 中有数据
  11. 视频教程 | 3D 跑酷小游戏实战开发(上)
  12. 子龙山人翻译pdf(47篇全)打包下载 [转]
  13. [论文阅读笔记29]生物医学文本摘要(Biomedical Text Summarization)
  14. Flask蓝本创建名称错误导致的werkzeug.routing.BuildError
  15. 次模优化·第〇集:简介
  16. 生命如此脆弱——2012观后感
  17. 前端技术栈:后台管理端UI框架
  18. html时间轴横向自动播放,利用jQuery实现日期时间轴自动播放代码
  19. SQL Server 2019 开启数据库远程访问
  20. 【作用域、自由变量】

热门文章

  1. Asp.Net无刷新分页( jquery.pagination.js)
  2. Ubuntu 硬盘”分区“图文教程(用于光盘,U盘安装Ubuntu)
  3. fcpx调整图层_【FCPX萌新系列】新手常遇到的4个基础调色问题
  4. 用U盘安装一个Linux系统
  5. openssl pkeyutl执行SM2椭圆曲线数字签名
  6. 2018-03-22笔记,象棋记谱法
  7. Android 访问权限设置
  8. IOCP编程之基本原理
  9. C#调用VC的DLL的接口函数参数类型转换一览表
  10. C#图片处理之:旋转图片90度的整数倍