android适配手机升级：最新布局FlexboxLayout替代LinearLayout（支持RecycleView）

于 2024-04-09 02:04:53 发布
阅读量451 收藏 8
点赞数 3
分类专栏： 程序员 文章标签： android 智能手机
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/FZBH_Q/article/details/137530564
版权

<TextView

android:id=“@+id/textview5”

android:layout_width=“80dp”

android:layout_height=“80dp”

android:background=“#022cff”

android:gravity=“center”

android:text=“textview5” />

</com.google.android.flexbox.FlexboxLayout>

  • Flexboxlayout 5大布局属性之-justifyContent

这里写图片描述

1、flex_start（默认值）：左对齐

2、flex-end：右对齐

3、center： 居中

4、space-between：两端对齐，控件之间的间隔相等

5、space-around：每个控件距离两侧的间隔相等(项目之间的间隔比项目与边框的间隔大一倍)

详细对应的属性如下：

1、flex_start（默认值）：左对齐

这里写图片描述

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

<FrameLayout xmlns:android=“http://schemas.android.com/apk/res/android”

xmlns:app=“http://schemas.android.com/apk/res-auto”

android:layout_width=“match_parent”

android:layout_height=“match_parent”>

<com.google.android.flexbox.FlexboxLayout

android:id=“@+id/flexbox_layout”

android:layout_width=“match_parent”

android:layout_height=“wrap_content”

app:justifyContent=“flex_start”>

<TextView

android:layout_width=“80dp”

android:layout_height=“80dp”

android:gravity=“center”

android:padding=“5dp”

android:text=“flex_start（默认值）：左对齐” />

<TextView

android:id=“@+id/textview1”

android:layout_width=“80dp”

android:layout_height=“80dp”

android:background=“#ff0202”

android:gravity=“center”

android:text=“textview1” />

<TextView

android:id=“@+id/textview2”

android:layout_width=“80dp”

android:layout_height=“80dp”

android:background=“#ffc402”

android:gravity=“center”

android:text=“textview2” />

</com.google.android.flexbox.FlexboxLayout>

2、flex-end：右对齐

这里写图片描述

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

<FrameLayout xmlns:android=“http://schemas.android.com/apk/res/android”

xmlns:app=“http://schemas.android.com/apk/res-auto”

android:layout_width=“match_parent”

android:layout_height=“match_parent”>

<com.google.android.flexbox.FlexboxLayout

android:id=“@+id/flexbox_layout”

android:layout_width=“match_parent”

android:layout_height=“wrap_content”

app:justifyContent=“flex_end”>

<TextView

android:layout_width=“80dp”

android:layout_height=“80dp”

android:gravity=“center”

android:padding=“5dp”

android:text=“flex-end：右对齐” />

<TextView

android:id=“@+id/textview1”

android:layout_width=“80dp”

android:layout_height=“80dp”

android:background=“#ff0202”

android:gravity=“center”

android:text=“textview1” />

<TextView

android:id=“@+id/textview2”

android:layout_width=“80dp”

android:layout_height=“80dp”

android:background=“#ffc402”

android:gravity=“center”

android:text=“textview2” />

</com.google.android.flexbox.FlexboxLayout>

3、center： 居中

这里写图片描述

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

<FrameLayout xmlns:android=“http://schemas.android.com/apk/res/android”

xmlns:app=“http://schemas.android.com/apk/res-auto”

android:layout_width=“match_parent”

android:layout_height=“match_parent”>

<com.google.android.flexbox.FlexboxLayout

android:id=“@+id/flexbox_layout”

android:layout_width=“match_parent”

android:layout_height=“wrap_content”

app:justifyContent=“center”>

<TextView

android:layout_width=“80dp”

android:layout_height=“80dp”

android:gravity=“center”

android:padding=“5dp”

android:text=“center： 居中” />

<TextView

android:id=“@+id/textview1”

android:layout_width=“80dp”

android:layout_height=“80dp”

android:background=“#ff0202”

android:gravity=“center”

android:text=“textview1” />

<TextView

android:id=“@+id/textview2”

android:layout_width=“80dp”

android:layout_height=“80dp”

android:background=“#ffc402”

android:gravity=“center”

android:text=“textview2” />

</com.google.android.flexbox.FlexboxLayout>

4、space-between：两端对齐，控件之间的间隔相等

这里写图片描述

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

<FrameLayout xmlns:android=“http://schemas.android.com/apk/res/android”

xmlns:app=“http://schemas.android.com/apk/res-auto”

android:layout_width=“match_parent”

android:layout_height=“match_parent”>

<com.google.android.flexbox.FlexboxLayout

android:id=“@+id/flexbox_layout”

android:layout_width=“match_parent”

android:layout_height=“wrap_content”

app:justifyContent=“space_between”>

<TextView

android:layout_width=“80dp”

android:layout_height=“wrap_content”

android:gravity=“center”

android:padding=“5dp”

android:text=“space-between：两端对齐，控件之间的间隔相等” />

<TextView

android:id=“@+id/textview1”

android:layout_width=“80dp”

android:layout_height=“80dp”

android:background=“#ff0202”

android:gravity=“center”

android:text=“textview1” />

<TextView

android:id=“@+id/textview2”

android:layout_width=“80dp”

android:layout_height=“80dp”

android:background=“#ffc402”

android:gravity=“center”

android:text=“textview2” />

</com.google.android.flexbox.FlexboxLayout>

5、space-around：每个控件距离两侧的间隔相等(项目之间的间隔比项目与边框的间隔大一倍)

这里写图片描述

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

<FrameLayout xmlns:android=“http://schemas.android.com/apk/res/android”

xmlns:app=“http://schemas.android.com/apk/res-auto”

android:layout_width=“match_parent”

android:layout_height=“match_parent”>

<com.google.android.flexbox.FlexboxLayout

android:id=“@+id/flexbox_layout”

android:layout_width=“match_parent”

android:layout_height=“wrap_content”

app:justifyContent=“space_around”>

<TextView

android:layout_width=“80dp”

android:layout_height=“wrap_content”

android:gravity=“center”

android:padding=“5dp”

android:text=“space-around：每个控件距离两侧的间隔相等(项目之间的间隔比项目与边框的间隔大一倍)” />

<TextView

android:id=“@+id/textview1”

android:layout_width=“80dp”

android:layout_height=“wrap_content”

android:background=“#ff0202”

android:gravity=“center”

android:text=“textview1” />

<TextView

android:id=“@+id/textview2”

android:layout_width=“80dp”

android:layout_height=“wrap_content”

android:background=“#ffc402”

android:gravity=“center”

android:text=“textview2” />

</com.google.android.flexbox.FlexboxLayout>

  • Flexboxlayout 5大布局属性之-alignItems

这里写图片描述

1、stretch（默认值）：如果项目未设置高度或设为auto，将占满整个容器的高度。

2、flex-start：左上方开始，并与左上方对齐

3、flex-end：左下方开始，并与左下方对齐

4、center：左控件的中间开始，并与中心线水平对齐

5、baseline: 控件中的文字向上对齐

详细对应的属性如下：

1、stretch（默认值）：如果项目未设置高度或设为auto，将占满整个容器的高度。

这里写图片描述

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

<FrameLayout xmlns:android=“http://schemas.android.com/apk/res/android”

xmlns:app=“http://schemas.android.com/apk/res-auto”

android:layout_width=“match_parent”

android:layout_height=“match_parent”>

<com.google.android.flexbox.FlexboxLayout

android:id=“@+id/flexbox_layout”

android:layout_width=“match_parent”

android:layout_height=“match_parent”

app:alignItems=“stretch”>

<TextView

android:layout_width=“80dp”

android:layout_height=“80dp”

android:gravity=“center”

android:padding=“5dp”

android:text=“stre

最低0.47元/天 解锁文章
FZBH_Q
关注
  • 3
    点赞
  • 踩
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
android适配手机升级：最新布局FlexboxLayout替代LinearLayout（支持RecycleView
m0_60721860的博客
03-23 768
代码真的是重质不重量，质量高的代码，是当前代码界提倡的，当然写出高质量的代码肯定需要一个相当高的专业素养，这需要在日常的代码书写中逐渐去吸收掌握，谁不是每天都在学习呀，目的还不是为了一个，为实现某个功能写出高质量的代码。所以，长征路还长，大家还是好好地做个务实的程序员吧。最后，小编这里有一系列Android提升学习资料，有兴趣的小伙伴们可以来看下哦~我的 Android 学习，面试文档，视频收集大整理性。默认值为auto)" />
Android利用FlexboxLayout轻松实现流动布局
01-05
前言 相信大家应该都有所体会，在以前我们要实现流动性布局，比较繁琐，Google开源了一个项目叫FlexboxLayout，相信大家都不陌生。下面我们来学习一下FlexboxLayout基础知识，并通过一个案例来加深理解。如果你对FlexboxLayout很熟悉，请忽略本文。 一、什么是 Flexbox 简单来说 Flexbox 是属于web前端领域CSS的一种布局方案，是2009年W3C提出了一种新的布局方案，可以响应式地实现各种页面布局，并且 React Native 也是使用的 Flex 布局。 我们可以简单的理解为 Flexbox 是CSS领域类似 Linearlayout 的一种布局
Android FlexboxLayout布局
周平的博客
05-06 3220
FlexboxLayout 布局详解
【Android -- 开源库】FlexboxLayout 的基本使用
Kevin Learn Android
12-05 2885
本篇文章就介绍一下它的用法和最新版添加的一些特性（支持集成RecyclerView）。
FlexboxLayout使用(Google官方实现流式布局控件)
Jason_Lee155的博客
06-20 3169
一、FlexboxLayout是什么 FlexboxLayout是Google开源的一个强大的控件，直接继承ViewGroup，效果类似于加强版的LinearLayout，但与LinearLayout并无关联。 官方原话是： FlexboxLayout is a library project which brings the similar capabilities of CSS Flexible Box Layout Module to Android. 意思是：FlexBoxLayout是为An
Android FlexboxLayout UI布局
cishaohui的博客
06-19 406
项目中添加依赖如果是在 RecycleView 中使用则添加Alpha 版本包括 RecyclerView 的集成，XML 中添加布局 运行后的效果如下 好像并没有换行啊，别急骚年，接下来我们一一介绍 FlexboxLayout 的一些常用属性。 FlexboxLayout 常用属性 flexDirection
Android FlexboxLayout布局属性详解
jixuczy的博客
03-15 1296
答应大伙的备战金三银四，大厂面试真题来啦！这份资料我从春招开始，就会将各博客、论坛。网站上等优质的Android开发中高级面试题收集起来，然后全网寻找最优的解答方案。每一道面试题都是百分百的大厂面经真题+最优解答。包知识脉络 + 诸多细节。节省大家在网上搜索资料的时间来学习，也可以分享给身边好友一起学习。给文章留个小赞，就可以免费领取啦~3000页Android开发者架构师核心知识笔记《960全网最全Android开发笔记》《379页Android开发面试宝典》
Google开源的FlexboxLayout
stormzhang的专栏
05-15 345
阅读本文大概需要8分钟。最近Google开源了一个项目叫「FlexboxLayout」，但是貌似没多少资料对这个项目介绍的，那么今天来讲讲这个项目的作用以及简单的使用介绍...
com.google.android:flexbox:0.3.0-alpha2依赖资源
03-28
要在主工程的gradle中添加版本信息或者自己在资源包中添加版本号，依赖此资源就可以实现FlexboxLayout与Recycleview的后续操作，我的主工程版本代码： ext { minSdkVersion = 9 targetSdkVersion = 25 compileSdkVersion = 25 buildToolsVersion = "25.0.2" supportLibVersion = "25.3.0" espressoVersion = "2.2.2" testRunnerVersion = "0.5" junitVersion = "4.12" }
Android布局类型：线性布局（LinearLayout）基本使用和常用使用案例，理论加案例
03-16
Android常见的布局类型是线性布局（LinearLayout），包含布局方向设置、基本使用、常用使用案例以及实现均分案例（垂直均分、水平均分）、以及线性布局嵌套，实现垂直且水平居中，整体按照“理论+案例”，分析清晰，...
Android自定义LinearLayout布局显示不完整的解决方法
08-28
主要给大家介绍了关于Android自定义LinearLayout但布局显示不完整的解决方法，文中通过示例代码介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧。
Android布局控件之常用linearlayout布局
09-02
LinearLayout是线性布局控件，它包含的子控件将以横向或竖向的方式排列，按照相对位置来排列所有的widgets或者其他的containers,超过边界时，某些控件将缺失或消失
Android布局之LinearLayout自定义高亮背景的方法
09-02
主要介绍了Android布局之LinearLayout自定义高亮背景的方法,实例分析了Android中LinearLayout布局参数设置技巧,需要的朋友可以参考下
Android FlexboxLayout布局属性详解(1)
最新发布
2401_84132381的博客
04-07 634
现在随着短视频，抖音，快手的流行NDK模块开发也显得越发重要，需要这块人才的企业也越来越多，随之学习这块的人也变多了，音视频的开发，往往是比较难的，而这个比较难的技术就是NDK里面的技术。音视频/高清大图片/人工智能/直播/抖音等等这年与用户最紧密，与我们生活最相关的技术一直都在寻找最终的技术落地平台，以前是windows系统，而现在则是移动系统了，移动系统中又是以Android占比绝大部分为前提，所以AndroidNDK技术已经是我们必备技能了。
Android FlexboxLayout布局属性详解(1)，来自阿里巴巴佛系Android程序员的指南
2401_84149743的博客
04-06 471
好像并没有换行啊，别急骚年，接下来我们一一介绍的一些常用属性属性决定主轴项目排列方向。类似的vertical和horizontal，但是更加强大，不仅支持横向和纵向还可以设置不同的排列的起点。row（默认值）：主轴为水平方向，起点在左端：主轴为水平方向，起点在右端。column：主轴为垂直方向，起点在上沿：主轴为垂直方向，起点在下沿我们添加属性，设置未纵向并且起点在下端，在xml添加属性可以看到项目是从底部开始由下而上排列的。默认和一样是不带换行属性的，但是flexWrap属性可以支持换行排列。这就是。
FlexboxLayout——实现灵活多变的瀑布流
apple_4872330的专栏
04-25 712
之前看到一个很炫酷的布局：FlexboxLayout，可以很方便地实现瀑布流的效果。今天正好用到项目中，对FlexboxLayout进行一个简单的学习。 一、效果图 先来看一波效果图。 很熟悉，对不对？就是简书的定制热门页面。通过今天的学习，利用FlexboxLayout+RecyclerView就可以实现。 下面是自己实现的效果图： 像上述的应用场景，会经常在一些APP中看到。那么就学起来吧，看看是怎么实现的。 二、FlexboxLayout简介 ...
android布局文件在LinearLayout中的图片水平居中
06-10
要让图片在 `LinearLayout` 中水平居中，可以在 `LinearLayout` 中再嵌套一个 `ImageView`，然后设置 `android:layout_gravity="center_horizontal"`，代码如下： ``` <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:src="@drawable/image_name" /> </LinearLayout> ``` 其中，`android:gravity="center"` 表示让 `LinearLayout` 中的子控件在垂直方向上居中对齐。`android:layout_gravity="center_horizontal"` 表示将 `ImageView` 在水平方向上居中对齐。`@drawable/image_name` 表示要显示的图片资源文件名。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值