本文实例为大家分享了Android GridView实现横向列表水平滚动的具体代码，供大家参考，具体内容如下 有时候根据项目需要，使用可横向滑动的GridView。...stretchMode="spacingWidthUniform"/ </LinearLayout </HorizontalScrollView </LinearLayout 2.主界面GridView列表子项布局文件...id_gridview_home.setHorizontalSpacing(5); // 设置列表项水平间距 id_gridview_home.setStretchMode(GridView.NO_STRETCH...); id_gridview_home.setNumColumns(size); // 设置列数量=列表集合数 AblGridViewBaseAdapter adapter = new AblGridViewBaseAdapter...convertView = loadHomeHyOrYs(position, convertView, parent); return convertView; } /** * 加载会员或医生的功能列表
有些报表会很宽，浏览器水平放不下，需要水平滚动显示，这个可以设置overflow-y:hidden实现，很基本的实现，没什么难度。但是，如果同时希望垂直滚动的时候，表格头是固定的。此时该如何实现呢？...box{display:flex;flex-direction:column;}.top{height:30px;}.content{flex:1}但是实现代码比起 ：《纯CSS实现标题栏、表格头水平滚动垂直不滚动...转载本站文章《如何纯CSS实现标题栏、表格头水平滚动垂直不滚动》,请注明出处：https://www.zhoulujun.cn/html/webfront/SGML/html5/2021_0731_8650
本节代码利用Flutter的ListView组件实现垂直/水平方向滚动的列表，效果图如下： ? ?...垂直方向的滚动： import 'package:flutter/material.dart'; void main() => runApp(MyApp()); const CITY_NAMES =...TextStyle( color: Colors.white, fontSize: 20, ), ), ); } } 水平方向滚动的列表只需要给
ListView 在Flutter中，ListView可以沿一个方向（垂直或者水平方向）来排列其所有子Widget，因此常被用于需要展示一组连续视图元素的场景，比如通讯录、优惠券、商家列表等。...但是，对于某些特殊交互场景，比如多个效果联动、嵌套滚动、精细滑动、视图跟随手势操作等，还需要嵌套多个ListView来实现。...这时，各自视图的滚动和布局模型就是相互独立、分离的，就很难保证整个页面统一一致的滑动效果。 那么，Flutter是如何解决多ListView嵌套时，页面滑动效果不一致的问题的呢？...以一个有着封面头图的列表为例，我们希望封面头图和列表这两层视图的滚动联动起来，当用户滚动列表时，头图会根据用户的滚动手势，进行缩小与展开。...ListView组件，同时支持垂直方向和水平方向滚动，不仅提供了少量一次性创建子视图的默认构造方法，也提供了大量按需创建子视图的ListView.builder机制，并且支持自定义分割线。
可以在其内部嵌套其他滚动视图的滚动视图，其滚动位置是固有链接的。...在普通的ScrollView中， 如果有一个Sliver组件容纳了一个TabBarView，它沿相反的方向滚动（例如，允许用户在标签所代表的页面之间水平滑动，而列表则垂直滚动），则该TabBarView...例如，浏览内部列表以滚动到顶部不会导致外部ScrollView中的SliverAppBar折叠以展开。...: true, ... ) scrollDirection滚动方向，分为垂直和水平方向。...reverse参数表示反转滚动方向，并不是由垂直转为水平，而是垂直方向滚动时，默认向下滚动，reverse设置false，滚动方向改为向上，同理水平滚动改为水平向左。
一 HorizontalScrollView基本介绍 HorizontalScrollView是Android SDK中的一个视图容器，它允许用户在水平方向上滚动其子视图。...单个子视图：HorizontalScrollView只能有一个直接子视图，该子视图通常是一个水平方向的LinearLayout。...嵌套滚动：HorizontalScrollView可以与其他滚动容器（如ScrollView）嵌套使用，同时支持水平和垂直滚动。...默认值为true，在子视图不足以填充水平空间时，会拉伸子视图使得水平空间被填满。 android:overScrollMode：设置滚动边界效果模式。...四 总结 使用HorizontalScrollView时，需要根据实际需求和内容的水平滚动性质来设置布局结构和子视图。通过合理处理布局和内容，可以为用户提供流畅且舒适的水平滚动体验。
NestedScrollView 可以在其内部嵌套其他滚动视图的组件，其滚动位置是固有链接的。...在普通的ScrollView中， 如果有一个Sliver组件容纳了一个TabBarView，它沿相反的方向滚动（例如，允许用户在标签所代表的页面之间水平滑动，而列表则垂直滚动），则该TabBarView...例如，浏览内部列表以滚动到顶部不会导致外部ScrollView中的SliverAppBar折叠以展开。...滚动隐藏AppBar 比如实现如下场景，当列表滚动时，隐藏AppBar，用法如下： NestedScrollView( headerSliverBuilder: (BuildContext context...reverse参数表示反转滚动方向，并不是由垂直转为水平，而是垂直方向滚动时，默认向下滚动，reverse设置false，滚动方向改为向上，同理水平滚动改为水平向左。
但其实在真实应用中，可能 头部 和 列表 的数据来自不同的接口，当列表的数据请求失败时要展示缺省图，但头部还是会展示。这时头部和列表 分开实现 是比较好的选择。 这里给出解决方案： <?...支持嵌套滚动轴。...水平方向，垂直方向，或者不指定 * @param type 滑动类型，ViewCompat.TYPE_NON_TOUCH fling 效果ViewCompat.TYPE_TOUCH...支持嵌套滚动轴。...水平方向，垂直方向，或者不指定 * @param type 滑动类型，ViewCompat.TYPE_NON_TOUCH fling 效果ViewCompat.TYPE_TOUCH
ScrollView可以嵌套其他视图组件，例如TextView、ImageView等，以实现滚动展示更多内容。它对于需要显示较长文本、图片或其他可滚动内容的界面非常有用。...在ScrollView中，只能包含一个直接子视图（ViewGroup），通常是一个垂直方向的线性布局或相对布局。如果需要水平滚动效果，可以使用HorizontalScrollView作为替代。...android:scrollbars：定义滚动条的显示方式。可选值有"none"（不显示）、"vertical"（只显示垂直滚动条）和"horizontal"（只显示水平滚动条）。...android:fadeScrollbars：控制滚动条是否在不活动状态时渐隐。设置为true表示滚动条会渐隐，默认为false。...常见方法： scrollTo(int x, int y)：将ScrollView滚动到指定的位置，参数x和y分别代表目标位置的水平和垂直偏移量。
ListView、GridView自带滚动模型，SliverList、SliverGrid不包含滚动模型，不会造成滚动冲突。...：视图窗口内部长度，大小等于屏幕显示的列表长度； extentAfter：列表中未滑入视图窗口部分的长度； atEdge：是否滚动到了可滚动组件的边界。...如果滚动方向是垂直方向，则表示子组件的高度；如果滚动方向为水平方向，则表示子组件的长度。...childrenDelegate: SliverChildListDelegate(_items), ) ) ); } } 示例效果： 如果滚动视图中出现列表嵌套的场景...，为了不造成滚动时的冲突，需要对子组件添加禁止滚动属性。
可移动页面MoveActivity 滑出式菜单从界面上看，像极了一个水平滚动视图HorizontalScrollView，当然也可以使用HorizontalScrollView来实现侧滑菜单。...可是LinearLayout作为水平展示时有点逗，因为如果下面有两个子视图的宽度都是match_parent，那么LinearLayout只会显示第一个子视图，第二个子视图却是怎么拉也死活显示不了。...) { menuParams.leftMargin = -screenWidth; ll_menu_move.setLayoutParams(menuParams); } } } 水平列表视图...现在有个开源的HorizontalListView，它是水平滚动的列表视图，如果该视图只有两列，左边一列作为菜单页面，右边一列作为内容页面，这就很类似侧滑菜单的功能。...2、菜单默认在左边页，内容默认在右边页，所以首次加载视图时，页面要自动滑到右边的内容页（调用scrollTo方法滚动到内容页）。
简介 先上个小米日历的图，让大家知道要做一个什么效果： [strip] 这是小米日历的效果，在用户操作列表的时候，将日历折叠成周视图，扩大列表的显示区域，同时也不影响日历部分的功能使用，有趣且实用。...滚动时，日历也向上滚动，最多到当前选中日期那一行，滚动范围和当前选中日期有关。...列表的滚动范围则是固定的，最多向上移动 5 倍的日历行高，也就是从 0 到 -calendarLineHeight 5。...，不处理 if (target.canScrollVertically(-1)) { return; } // 切换月视图 setMonthMode(child...当嵌套滑动结束时会回调 onStopNestedScroll 方法，可以在这里根据当前控件的位置，判断是否要切换视图。
、组件概述 组件是视图层基本的组成单元，具备UI风格样式以及特定的功能效果。...当打开某款小程序之后，界面中的图片、文字等元素都需要使用组件，小程序组件使用灵活，组件之间通过相互嵌套进行界面设计，开发者可以通过组件的选择和样式属性设计出不同的界面效果。...属性如下表所示 2.1.1 案例 本例设计了两组父子view容器的点击态，第一组父子view容器种子view容器不阻止点击态向父容器传递，第二组父子view容器中子view容器阻止点击态向父容器传递...2.2 scroll-view scroll-view容器为可滚动的视图容器，允许用户通过手指在容器上滑动来改变显示区域，常见的滑动方向有水平滑动和垂直滑动。其属性表如下所示。...6组用于显示滚动效果，内部元素宽度均为250rpx。
每个菜单项都包含不关联的选项或操作，可影响app，页面或视图中已选定的元素。 菜单不应该被用作app内导航的主要方法。 ?...情景菜单 菜单是可滚动的 如果菜单高度阻止其显示所有菜单项目，菜单可以在内部滚动。 一个例子是在横向上查看手机上的菜单。 ?...可以内部滚动的菜单 级联菜单（仅限pc） 级联菜单可根据菜单与屏幕垂直和水平边缘的接近程度放置菜单。 ?...菜单嵌套 菜单项可以显示嵌套的子菜单。 理想情况下，嵌套的层级都需要做显示，因为很难用嵌套多层的子菜单进行导航。 ?...·简单的菜单总是与列表项文本的开头左对齐，并且不会基于点击位置重新水平定位（如下图）。 ?
01 - 视图的布局方式 简单说一下我对 Flutter 视图布局的看法，在前篇中我有提到 Flutter 是使用了 Dart 语言进行编写，所以弱化了视图编辑的部分，视图的渲染、结构、布局都通过代码逻辑来生成...在一定程度上在视图结构和逻辑的关联性是强了，但在直观布局结构方面却弱了，所以就导致在代码中会发现嵌套层次很多很深，同事也会对开发者的能力有了一些要求，当然如果有面向对象编程的经验的话，那么就上手来说问题并不大...多子类元素布局 多子类元素布局的 Widget 有10种： Row 在水平方向上排列子元素的列表。 Column 在垂直方向上排列子元素的列表。...ListView 可滚动的列表控件。ListView 是最常用的滚动 Widget，它在滚动方向上一个接一个地显示它的子元素。在纵轴上，子元素们被要求填充ListView。...Wrap 可以在水平或垂直方向多行显示其子元素。 Flow 一个可以实现流式布局算法的 Widget。 Stack 可以允许其子元素简单的堆叠在一起。
CustomScrollView CustomScrollView是使用Sliver组件创建自定义滚动效果的滚动组件，使用场景： ListView和GridView相互嵌套场景，ListView嵌套GridView...时，需要给GridView指定高度，但我们希望高度随内容而变化（不指定），ListView和GridView作为整体滚动效果。...相互嵌套场景 在实际业务场景中经常见到这样的布局，顶部是网格布局（GridView），然后是列表布局（ListView），滚动的时候做为一个整体，此场景是无法使用GridView+ListView来实现的...，分为垂直和水平方向。...reverse参数表示反转滚动方向，并不是垂直转为水平，而是垂直方向滚动时，默认向下滚动，reverse设置false，滚动方向改为向上，同理水平滚动改为水平向左。
本节学习目标 掌握scroller组件的使用 概念 是一个竖直的，可以容纳多个排成一列的子组件的滚动器。...如果子组件的总高度高于其本身，那么所有的子组件都可滚动 使用途径 如果我们想要根组件也可以滑动的效果,就可以使用组件 水平滚动的视图 多个滚动视图嵌套 注意事项 1.滑动组件默认方向为垂直...，并且不会出现滚动条 掌握以下技能(请使用真机测试) 如何控制滚动条的显示或者隐藏 how-scrollbar值为true或者false,这个是标签的属性,不是样式,不能写在css样式表里,具体使用如下... 定义滚动的方向 scroll-direction 值为horizontal 水平滚动,值为vertical...2.loadmore 事件 当滚动条距离底部的值等于loadmoreoffset 时,触发这个事件 3.如果滚动方向为水平,不会产生任何效果! 思考:如何滚动到指定的位置 ?
列表视图——为变化的数据列表的垂直滚动的高效显示而设计的一个核心组件。...3.4.1 Props alwaysBounceHorizontal 布尔型 当为真时，滚动视图到达内容底部时，水平反弹，即使该内容小于滚动视图。...合理的选择包括——正常:0.998(默认)——快 速:0.9 horizontal布尔型 当为真时，滚动视图的子视图水平排列为一行，而不是竖直排列为一列。默认值是false。...这可以用于水平分页。默认值是false。...这在长 列表中可以提高滚动性能。默认值是false。
网格列表 网格列表（Grid lists） 网格列表是标准列表视图的替代方法。 Grid lists由以垂直和水平布局排列的cell重复后组成。 Grid lists最适用于同质数据类型。...类型 仅图像 单行文本（可带图标） 两行文字（可带图标） 操作 垂直滚动 筛选 替代 Lists Cards ---- 用法 网格列表最适合呈现同类数据，通常为图像，并且针对视觉理解和区分类似数据类型进行了优化...操作可以打开后续的视图，如一张card。 主要操作 ·填充整个tile，因此不会通过图标或文字的形式呈现 ·在一个特定grid list中的所有tile中都保持一致。...例如，一个grid list中的所有标题可能位于左下角，而另一个网格列表中的所有标题可能会放置在左上角。 ? 次要操作与文案的位置 ---- 行为 滚动 grid lists通常只能垂直滚动。...不鼓励横向滚动grid lists，因为滚动会干扰典型的阅读模式，影响理解。 一个明显的例外是水平滚动的单行图像grid list，例如图库，它与典型的阅读模式相符合。
点击事件传递过程如下左图所示，在flutter点击区域由flutter处理事件，若flutter不处理则回到父view处理。...flutter点击事件 flutter滑动事件 list滚动事件则需要在flutter view子树的祖先view中进行适当屏蔽，确保flutter列表能嵌套滚动。...本次实现的业务场景是1.2节中的场景二，在一个native滚动列表最下方嵌入flutter滚动列表，flutter滚动列表正好能占满一个屏幕。...整个列表向下滚动过程中，先滚动外层列表，当滚动到底部时滚动flutter列表；反之，整个列表向上滚动过程中，先滚动flutter列表，当flutter列表滚动到头部时滚动，向上滚动外层列表。...后续会在此基础上做进一步的优化，比如flutter view的滚动事件如何很平滑地传输到native，使得双列表嵌套滚动的时候没有顿挫感。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM
