安卓:带卡片的水平RecyclerView布局切断了较大布局的底部 - 腾讯云开发者社区

数据mock自玩安卓（看着有点乱，后续有时间搭个小服务，向业务贴近）， ? 重点看页面结构即可，远程模板调整了Card顺序、4列布局改成5列、改了文本颜色和瀑布流item背景色。...进行数据准备，模板地址：net_shopping_home.json 聚合数据接口：tangram/shopping/home 瀑布流数据接口：玩安卓 - article/list/0/json 模板如下...bottomTitle":[ //瀑布流标题数据 { "title":"猜你喜欢" } ] } } 一切准备就绪...template) throws JSONException { //遍历每一个卡片（布局），把数据填充进字段items for (int i = 0; i < template.length...MyApp.gson.toJson(list.get(i))); obj.put("type", card.optStringParam("itemType")); //由于使用了玩安卓的数据结构

8371 0

终于来了：Android端个人中心页面滑动冲突优化方案

问题现象首页右滑可进入“个人中心”页面，然后在底部的 RecylerView 上先左右滑动，但是不触发它们父布局 ViewPager 的切换，然后手指不抬起，进行上下滑动，此时 RecylerView...不触发自身的滑动就会直接分发下去，此时 RecyclerView 自身来说竖向（dy）差值变化较大，正常滑动。...出现问题时，用户的手先触发左右滑动，这时候由于 RecyclerView 父布局 ViewPager 中的一些临界判断没被触发，所以没拦截事件，事件还是到了 RecyclerView 中，此时如果再次上下滑动...站在巨人肩膀上，系统控件的处理一般都可以借鉴，源码之下，一切清晰，横向的可以参考 ViewPager 的事件拦截，竖向的可以参考 RecyclerView 的事件处理逻辑。...ViewPager 中判断了是否是子 View 消费事件,这里我们不能照搬过来，我们要取反，即如果当前自定义的 LinearLayout 中有横向可滑动的 View,我们的 isHorizontalDrag

1K2 0

您找到你想要的搜索结果了吗？

是的

没有找到

Android Material Design系列之RecyclerView和CardView

前面我们介绍RecyclerView时，说过RecyclerView适合多种嵌套的布局效果， ViewHolder更适合多种子布局的列表。...viewGroup, int viewType) { //如果viewType是普通item返回普通的布局，否则是底部布局并返回 if (viewType == TYPE_NORMAL_ITEM...CardView CardView介绍 CardView是Android5.0之后为新增的控件，CardView是一个卡片布局，布局可以包含圆角和阴影，本质上CardView是一个FrameLayout...CardView属性 CardView中常用的属性有： cardElevation:设置阴影的大小 cardBackgroundColor:卡片布局的背景颜色 cardCornerRadius：卡片布局的圆角的大小...conentPadding：卡片布局和内容之间的距离效果图和实例代码效果图如下： ?

2.1K8 0

学习笔记 | Android Studio安卓开发入门经验总结干货

故在此总结整理安卓开发中比较常见的一些问题，技巧和指南。 1.开发环境 Android Studio是谷歌基于IntelliJ IDEA社区版开发的，面向安卓开发的免费集成开发环境。...其方便快捷的开发调试和可视化UI编辑可以令安卓开发事半功倍。...接着，Minimum SDK指的是本项目所支持的最小安卓SDK，点击“Help me choose”会出现如下界面帮助选择合适的安卓最小SDK版本：图1 安卓API版本选择帮助界面其中CUMULATIVE...DISTRIBUTION表示如果支持该安卓版本以上设备，则预估能支持安卓设备占所有安卓设备的百分比。...RecyclerView的适用场景是有大量用于展示的列表数据的场景，比如微信的公众号页面的推文卡片、微信朋友圈、QQ的好友列表、小红书的瀑布流帖子等。

2.5K6 0

RecycleView从0到0.1 | 技术创作特训营第一期

一、文章快速总结RecycleView是安卓的列表，可以灵活控制每一项的数据，布局，动画。Adaper是整体适配器，逻辑放在这里。Holder是每一项的内容，把控件初始化放在这里。...LayoutManager是布局管理器，制定列表的整体布局。ItemDecoration设置项与项之间的分割线。...MyHolder ：这是RecyclerView.ViewHolder的实现类，用于初始化item布局中的子控件。需要注意的是，在这个类的构造方法中需要传递item布局的View给父类。...元素的布局和复用。...RecycleView提供了三种布局管理器：LinearLayoutManager：线性布局，以垂直或水平滚动列表方式显示项目。GridLayoutManager：网格布局，在网格中显示项目。

4441 1

【开源项目】Flutter版玩安卓

wanandroid_flutter 玩安卓的flutter版本，非常感谢鸿洋提供的api。这个项目中常用的widget基本都用到了，没用到的后续也会强行用到的。...非常适合学习，代码不多，注释多玩安卓 Flutter版本玩安卓 Java版本玩安卓小程序版本 github：https://github.com/yechaoa/wanandroid_flutter...apk地址截图 Android IOS 你能学到 BottomNavigationBar 底部菜单 FlutterJsonBeanFactory Json解析 WebView...加载网页 dio 网络请求 ExpansionPanelList 可折叠列表 Wrap 流布局 Chip 标签 TabBar 顶部菜单 Card 卡片 banner 轮播图 Drawer 侧边栏 SliverAppBar...本地存储 Dismissible 滑动删除 RefreshIndicator 下拉刷新 Stack 重叠布局 Flutter 打包发布等等 Todo 登录注册退出收藏分享搜索切换主题添加字体

1.4K2 0

【软件开发规范七】《Android UI设计规范》

1.5 切图注意：切图素材文件大小尽量保持 <= 200Kb，主要为png格式。 2....2.8 布局所有可操作元素最小点击区域尺寸：48dp X 48dp。栅格系统的最小单位是8dp，一切距离、尺寸都应该是8dp的整数倍。...编辑 **卡片集**是**卡片**的一个平面布局编辑即使在同一个列表中，卡片的内容和布局方式也可以不一样。编辑卡片统一带有2dp的圆角。...编辑简单一根横线就能代表输入框，可以带图标编辑激活状态和错误状态，横线的宽度变为2dp，颜色改变输入框点击区域高度至少48dp，但横线并不在点击区域的底部，还有8dp距离。 ...sheet for Adobe Illustrator - 50.07 MB (.ai) 系统图标 System icon sticker sheet - 0.39 MB (.ai) 2.12 实践知乎安卓客户端

5.1K2 0

学会使用CardView，简单实现卡片式布局效果

都掌握的怎么样啊安卓中一些常用控件学习得差不多了，今天再来学习一个新的控件CardView，在实际开发中也有非常高的地位。...app:cardBackgroundColor：设置卡片的背景色。 app:cardCornerRadius：设置卡片的圆角大小。 app:contentPadding：设置内容的padding。...继续使用WidgetSample工程的advancedviewsample模块，首先需要添加支持库，具体操作步骤同之前分享的揭开RecyclerView庐山真面目，这里不再重复分享。...三、CardView示例2 CardView被包装为一种布局，并且经常在ListView和RecyclerView的Item布局中，作为一种容器使用。...接下来简单定义一个CardView的item项，并在Java代码中修改CardView的属性，关于结合ListView和RecyclerView的部分比较简单，这里不做过多介绍。

3.3K7 0

Row本身是不支持滚动，如何实现滚动

似乎不支持一个水平滚动嵌套垂直滚动(或垂直滚动中嵌套水平滚动),所以相应布局需要合理设计此外,提及下,如果想使用像ListView或RecyclerView那样的列表组件,在Compose中可以使用LazyRow...敬请期待 verticalAlignmentment 取值有三个值: Alignment.CenterVertically 居中 Alignment.Top 靠顶部 Alignment.Bottom 靠底部...与上面一样,布局高度如果是自适应的,则不会有效果复制Row(verticalAlignment = Alignment.CenterVertically) { Box( Modifier...Row布局的参数一样,只是名字有所区别,使用方法和上面都一样 verticalArrangement 垂直方向排列 horizontalAlignmentment 水平方向对齐 Spacer Spacer...,直接翻译的话,应该是空格,其主要就是充当margin的作用,一般使用modifier修饰符来设置宽高占位来达到margin效果 Card 官方封装好的Material Design的卡片布局复制fun

1.8K3 0

Android知识笔记：记录 2 个 “容易误解” 的Android 知识点

(event); maybeUpdatePointerIcon(event); maybeUpdateTooltip(event); ... } DecorView 如果你熟悉安卓的...getWindow().superDispatchTouchEvent(ev) return true; } return onTouchEvent(ev); } 如果你熟悉安卓的...这个机制在RecyclerView卡片中还适用吗？...我们先粗略地温习一下RecyclerView的回收机制： RecyclerView在布局（自然滑动其实也是反复布局子View）时，会回收一些符合条件的ViewHolder，它会根据ViewHolder的状态来决定临时存放在哪个地方...重新绑定数据的（mRecyclerPool.mScrap）； mAttachedScrap，正常情况下，它会在RecyclerView每次布局时都用到：在布局子View时，会把全部子View所属的Holder

9482 0

导航设计的10种模式

缺点：每个宫格相互独立，它们的信息间也没有任何交集，无法跳转互通；当排布过多的时候，用户容易眼花缭乱，选择压力较大； ?...05 卡片式导航描述：宫格导航的变式吧，可用来呈现实时内容，比如新闻、菜谱、文章或照片，可以采用网格布局（比如一直播和ins）或轮盘布局（比如格瓦拉电影），还可以采用幻灯片模式进行展示。...06 抽屉式导航描述：抽屉式也是谷歌提出来的一种导航模式，由于虚拟按键的存在，所以在安卓上使用底部Tab会造成双底栏，视觉观感不佳；一般用来放置对用户而言不太常用或者对于产品而言不太核心的功能，或者不那么需要频繁切换内容的应用...09 弹窗式描述：算是菜单式的一种变种，区别是位置在界面中央不依赖于某个边缘；弹出框在安卓系统上的使用很普遍，比菜单、单选框、多选框等，在IOS系统上使用相对少些； ?...举例：淘宝首页淘宝的首页布局就是是顶部搜索框（非常重要）+banner轮播（精准推送的广告、形成变现）+宫格（给阿里系产品进行导流）+卡片+底部tab。

3.6K4 0

AndroidStudio 开发基础知识【翻译完成】

十五、保存和恢复安卓活动的状态十六、了解安卓视图、视图组和布局十七、AndroidStudio 布局编辑器工具指南十八、安卓约束布局指南十九、AndroidStudio 使用约束布局指南二十...四十五、运动布局的关键周期教程四十六、使用浮动动作按钮和 Snackbar 四十七、使用表格布局组件创建选项卡式界面四十八、使用回收视图和卡片视图小部件四十九、安卓回收视图和卡片视图教程五十、...布局编辑器的示例数据教程五十一、使用应用栏和折叠工具栏布局五十二、AndroidStudio MasterDetailFlow 教程五十三、安卓意图概述五十四、安卓显式意图——一个成功的例子五十五...二十、处理安卓活动状态变化二十一、安卓活动状态变化示例二十二、保存和恢复安卓活动的状态二十三、了解安卓视图、视图组和布局二十四、AndroidStudio 布局编辑器工具指南二十五、安卓约束布局指南...五十一、运动布局关键周期教程五十二、使用浮动动作按钮和 Snackbar 五十三、使用表格布局组件创建选项卡式界面五十四、使用回收视图和卡片视图小部件五十五、安卓回收视图和卡片视图教程五十六、

3.2K3 0

实践 | Google IO 应用是如何适配大尺寸屏幕 UI 的？

响应式导航在平板电脑这类宽屏幕设备或者横屏手机上，用户们通常握持着设备的两侧，于是用户的拇指更容易触及侧边附近的区域。同时，由于有了额外的横向空间，导航元素从底部移至侧边也显得更加自然。...为了实现这种符合人体工程学的改变，我们在用于 Android 平台的 Material Components 中新增了 Navigation rail。 △ 左图: 竖屏模式下的底部导航。...在宽尺寸屏幕上，这些列表项会转换为一格一格的卡片，卡片上直接显示了详细的内容。 △ 左图: 窄屏幕显示 Codelabs。右图: 宽屏幕显示 Codelabs。...这些独立的网格卡片是定义在 res/layout-w840dp 下的备用布局，数据绑定处理信息如何与视图绑定，以及卡片如何响应点击，所以除了不同样式下的差异之外，不需要实现太多内容。...所有的一切都集中在这个 RecyclerView 元素上: recyclerview.widget.RecyclerView android:id="@+id/codelabs_list

2.1K2 0

原生长列表内嵌 Flutter 卡片性能调研

，我们知道 Flutter 的布局是在 Flutter.ui 线程，光栅化是在 Flutter.raster 线程，它们跟原生 UI 的绘制是异步的，如果在 FlutterView 可见之后才触发卡片的布局和光栅化...FlutterCard 卡片对象是不断被 RecyclerView 循环使用的；长列表包含了 200 张卡片，在实际的运行中 RecyclerView 创建了约 9 个 FlutterCard 对象...对象时，会重新随机产生一个新的卡片高度，并通过 MessageChannel 通知 FlutterEngine 更新内容，触发该卡片的 Widget 树的更新和重布局，每个卡片显示一张图片和两段文本；...RecyclerView 会提前一些将卡片加入 View 树参与布局按照原生的逻辑，Flutter 需要在 Surface Create 时才触发 ScheduleFrame。...实际操作中会滚动到底部之后再滚动回头部，长列表设置显示 200 张卡片，在这个过程中 RecyclerView 一共创建了 9 个 FlutterCard 对象，也就是 9 对 FlutterView/

1.4K2 0

安卓天气预报app(二)——适配器、每小时数据展示

✅简易的安卓天气app(一)——解析Json数据、数据类封装简易的安卓天气app(二)——适配器、每小时数据展示 ✅简易的安卓天气app(三)——城市管理、数据库操作 ✅简易的安卓天气app(四)—...，里面包了JsonObject，7个表示7天，由于只需拿到当天数据，所以第0项就是当天详细天气)，用来存放城市的当天天气，如果我们想要展示更精美的页面呢，或者说是展示更多的数据，比如，我们这里用RecyclerView...展示一天中每个小时的天气，实现效果（若是想从当前时刻开始，获取小时温度，可自行实现，源码见页尾）涉及内容获取网络数据数据实体类的封装异步获取网络数据 Gson工具类解析Json 界面设计RecyclerView...详细讲解C一下，第一篇就是，讲的非常全面，附加地址Android RecyclerView最全使用详解布局效果需要添加的RecyclerView <LinearLayout android...this, dayWeather.getHoursWeatherBeanList()); rlvHourWeather.setAdapter(mHourAdapter); //数据水平布局

1.1K8 0

Android Tangram模型：连淘宝、天猫都在用的UI框架模型你一定要懂

页面概念模型一个页面实体由3部分组成：页面（Page）、卡片（Card） & 组件（Item）具体如下图： ? 之间的关系：组件构成卡片、卡片构成页面。...卡片作用：负责布局逻辑即对组件进行组合 & 布局只声明布局方式，不提供布局细节组成卡片由有四部分组成：header、footer、body、style ? ?...布局框架根据卡片提供的布局信息进行布局布局框架根据组件提供的组件信息获取组件实例，布局到布局容器里 ---- 6....具体使用上述讲解的只是Tangram概念模型基本架构 & 原理在具体实现时会根据不同平台采用不同实现方案：对于Android：采用基于RecyclerView+自定义LayoutManager...下面我将继续对阿里开源的框架模型Tangram进行跟踪 & 详细分析，有兴趣可以继续关注Carson_Ho的安卓开发笔记 ---- 请帮顶或评论点赞！因为你的鼓励是我写作的最大动力！

2.5K1 0

Android | Tangram动态页面之路（三）使用

() { @Override public void onScrolled(RecyclerView recyclerView, int dx, int dy) {...super.onScrolled(recyclerView, dx, dy); //在 scroll 事件中触发 engine 的 onScroll，内部会触发需要异步加载的卡片去提前加载数据...，Tangram内置了一些布局方式Card，基本满足需求了，所以我们只需定制自己的具体View也就是Cell即可，上边手动注册了两个Cell，ImageTextView和SingleImageView，...90c6cc12-742e-4c9f-b318-b912f163b8d0.png", "type": "SingleImageView" } ] } 图片取自玩安卓的...然后再来个轮播图布局container-banner，他的Cell还是使用单图SingleImageView， { "type": "container-banner", "style"

7291 0

Ios常用第三方框架（二）

表相关与Tabbar SWTableViewCell - 国内开源作者，带很多手势的表单元格。 MCSwipeTableViewCell - 带很多手势的表单元格。...WXTabBarController - 在系统 UITabBarController 的基础上完美实现了安卓版微信 TabBar 的滑动切换功能，单手操作 iPhone 6 Plus 切换 TabBar...，后续安卓版本也会开源出来。...ReorderableGridView-Swift - 拖拽排序卡片。...微博cell自动布局 - 使用autoLayout对微博的cell进行自动布局，自适应cell的高度。

7.7K6 0

1-VII-RecyclerView基本使用

零、前言 [1].RecyclerView可以说是现在安卓视图的一哥了 [2].加包implementation 'com.android.support:design:26.1.0' [3].RecyclerView...的布局样式、装饰线 ---- 一、代码实现 1.Activity布局 <?...rv1.png [1].要设置布局管理器，不然无效果 [2].费了这么大的劲，就搞出一个没有线的不能点击的ListView?...rv3.png RecyclerView能对布局的条目进行控制，者也是它强大之处 ---- 二、装饰线 1.添加装饰线 mRecyclerView.addItemDecoration(//横线...canvas.drawRect(left, top, right, bottom, mPaint); } } } } 本文由张风捷特烈原创,转载请注明更多安卓技术欢迎访问

6303 0

教你玩转 Android RecyclerView：深入解析 RecyclerView.ItemDecoration类（含实例讲解）

使用场景：设置View的边界大小，使得其大小>View的背景大小 // 如按钮图标（View的背景）较小，但是我们希望按钮有较大的点击热区（View的边界大小） // 返回到分析1进来的原处总结...区域 // 获取RecyclerView的Child view的个数 final int childCount = parent.getChildCount(); // 设置布局参数...：ItemView 的 bottom坐标 + 距离RecyclerView底部距离 +translationY final int top = child.getBottom() + params.bottomMargin...(); // ItemView的下边界：ItemView 的 bottom坐标 + 距离RecyclerView底部距离 +translationY final...- 下一篇文章我将继续结合自定义View & RecyclerView.ItemDecoration类继续进行一些有趣的自定义View实例讲解，有兴趣可以继续关注Carson_Ho的安卓开发笔记 --

2K2 1

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

Android | Tangram动态页面之路（六）数据分离

终于来了：Android端个人中心页面滑动冲突优化方案

Android Material Design系列之RecyclerView和CardView

学习笔记 | Android Studio安卓开发入门经验总结干货

RecycleView从0到0.1 | 技术创作特训营第一期

【开源项目】Flutter版玩安卓

【软件开发规范七】《Android UI设计规范》

学会使用CardView，简单实现卡片式布局效果

Row本身是不支持滚动，如何实现滚动

Android知识笔记：记录 2 个 “容易误解” 的Android 知识点

导航设计的10种模式

AndroidStudio 开发基础知识【翻译完成】

实践 | Google IO 应用是如何适配大尺寸屏幕 UI 的？

原生长列表内嵌 Flutter 卡片性能调研

安卓天气预报app(二)——适配器、每小时数据展示

Android Tangram模型：连淘宝、天猫都在用的UI框架模型你一定要懂

Android | Tangram动态页面之路（三）使用

Ios常用第三方框架（二）

1-VII-RecyclerView基本使用

教你玩转 Android RecyclerView：深入解析 RecyclerView.ItemDecoration类（含实例讲解）

扫码

相关资讯

热门标签

活动推荐

运营活动

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐