想实现一个简单的滚动容器。例如水平排列10个图标，可以左右滑动查看的。

Egret里有布局容器可以滚动

Laya看了教程和示例，没有找到一个滚动容器，只有一个list，需要设置item，显然不是我想要的简单水平滚动容器。

示例教程里没有滚动容器的示例

组件教程里也没有滚动容器，也没有垂直和水平布局容器。

最后找到了panel+hbox组合成水平滚动容器

一   拖动一个panel和hbox到舞台，并且在hbox里放图片

二  设置panel滚动条和hbox的space

如果不设置panel的滚动条skin，这个panel是不会滚动的

如果不设置hbox的space，这个hbox也不会水平排列的

hbox的布局效果，只有在运行时才能看见

三 最终效果

四 其他

1. 设置滚动容器视口位置

Egret中设置视口位置是viewport.scrollH  scrollV

Laya中是设置滚动容器的滚动条value值：panel.hScrollBar.value

Laya的滚动容器的更多相关文章

  1. Flutter: AnimatedList 一个滚动容器，可在插入或移除项目时为其设置动画

    Flutter Widget of the Week import 'dart:math'; import 'package:flutter/material.dart'; void main() = ...

  2. bootstrap源码分析之scrollspy（滚动侦听）

    源码文件: Scrollspy.js 实现功能 1.当滚动区域内设置的hashkey距离顶点到有效位置时,就关联设置其导航上的指定项2.导航必须是 .nav > li > a 结构,并且a ...

  3. （9）UI（容器）

    1.基础容器   基础容器可以设置子容器布局.是否裁切子元素.填充颜色.背景图片资源等属性.   使用场景.   在官方示例中,大量使用了基础容器作布局管理,如下面的主界面中,用户名称,钻石和金币就使 ...

  4. 【转载/修改】ScrollLayout代码修正，追加模仿viewpager滚动速度

    组件作用为类似ViewPager但直接插视图的横向滚动容器. 修改自:http://blog.csdn.net/yaoyeyzq/article/details/7571940 在该组件基础上修正了滚 ...

  5. jq插件第二款来袭 图片滚动

    这第二款也是非常实用的插件,也是与图片相关,关于图片的需求太多了,这个是图片滚动哦,不过不是无缝滚动,是左像右滚动,到头的话再往回滚动,利用scrollLeft实现的,支持自动滚动和每次滚动的个数默认 ...

  6. 仿腾讯课堂固定滚动列表ReactNative组件

    前言 由于业务需要做成类似腾讯课堂课程详情滚动的效果,考虑到后面有可能有新的呈现方式,RN提供的组件没有这种滚动控件,不如自己封装,其实去年已经写了一篇但是写的比较乱,周末花了点时间重写梳理下做的东西 ...

  7. 移动端无限滚动 TScroll.vue组件

    // 先看使用TScroll.vue的几个demo 1.https://sorrowx.github.io/TScroll/#/ 2. https://sorrowx.github.io/TScrol ...

  8. bootstrap源码之滚动监听组件scrollspy.js详解

    其实滚动监听使用的情况还是很多的,比如导航居于右侧,当主题内容滚动某一块的时候,右侧导航对应的要高亮. 实现功能 1.当滚动区域内设置的hashkey距离顶点到有效位置时,就关联设置其导航上的指定项 ...

  9. web移动端浮层滚动阻止window窗体滚动JS/CSS处理

    CSS代码: .noscroll, .noscroll body { overflow: hidden; } .noscroll body { position: relative; } JS代码: ...

随机推荐

  1. Django的Form另类实现SelectMultiple

    昨天花了一天才解决,遇到的问题如下: 在forms.py里有一个如下的字段: jira_issue = forms.CharField( required=False, label=u"Ji ...

  2. poj3268 Silver Cow Party（最短路）

    非常感谢kuangbin专题啊,这道题一开始模拟邻接表做的,反向边不好处理,邻接矩阵的话舒服多了. 题意:给n头牛和m条有向边,每头牛1~n编号,求所有牛中到x编号去的最短路+回来的最短路的最大值. ...

  3. 计蒜之道 百度AI小课堂-上升子序列

    计蒜之道 百度AI小课堂-上升子序列 题目描述 给一个长度为 \(n\) 的数组 \(a\) .试将其划分为两个严格上升子序列,并使其长度差最小. 输入格式 输入包含多组数据. 数据的第一行为一个正整 ...

  4. html转为图片插件：html2canvas保存图片模糊问题解决

    使用官网的CDN: <script src="http://html2canvas.hertzen.com/dist/html2canvas.min.js"></ ...

  5. 前端微信小程序云开发基础讲解

    什么是云开发 云开发与传统模式的对比 云开发能力介绍云开发对小程序开发的变革 云开发是微信团队联合腾讯云提供的原生serverless云服务,致力于帮助更多的开发者快速实现小程序业务的开发,快速迭代. ...

  6. 了解Python-白 驹 过 隙 ， 忽 然 而 已

    白 驹 过 隙 , 忽 然 而 已 人 生 苦 短,我 用 Python -- Life is short , you need Python 代码量少,同一样问题 ,用不同的语言解决时,一般情况下P ...

  7. lintcode-1174.下一个更大的元素 III

    题目描述: 1174. 下一个更大的元素 III 给定一个32位整数n,用同样的数字组成新的32位整数,使得它要比n大,返回最小的这样的数.如果不存在这样的整数,返回-1. 算法思路: 首先将这个数转 ...

  8. MongoDB 数据库创建删除

    在MongoDB数据库里面是存在有数据库的概念,但是没有模式(所有的信息都是按照文档保存的),保存数据的结构就是JSON结构,只不过在进行一些数据处理的时候才会使用到MongoDB自己的一些操作符号 ...

  9. 【解决方案】Chrome崩溃问题解决

    问题描述 出现异常之前做的操作就是,因为换工位的需要,所以关闭电脑,修改网络配置. 问题分析 Firefox和其他应用网络正常 Chrome设置.帮助等选项均打不开 分析,很可能是电脑重启后,Wind ...

  10. java下载文件工具类

    java下载文件工具类 package com.skjd.util; import java.io.BufferedInputStream; import java.io.BufferedOutput ...