Laya的List组件+滚动条

最新推荐文章于 2022-08-22 14:21:43 发布
最新推荐文章于 2022-08-22 14:21:43 发布
阅读量320 收藏
点赞数
文章标签： java js vue python javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43287088/article/details/108676155
版权
本文介绍了在LayaBox 2.2.0版本中如何创建和使用List组件及滚动条。通过《绯雨骑士团》服务器选择列表的例子，详细讲解了List的创建、Item的定制、滚动条的两种设置方法，以及在代码中如何处理选中和更新Item的事件，以实现选中服务器按钮高亮的效果。
摘要由CSDN通过智能技术生成

版本：2.2.0

官网教程：https://ldc2.layabox.com/doc/?nav=zh-ts-3-3-7

下面以《绯雨骑士团》的服务器选择列表为例子。

 一 创建List

首先创建一个List组件，我命名为serverList。 (不用像laya教程里那样，还要转换类型什么的，太麻烦)

设置list的renderType属性为render，不设置没法滚动。

最低0.47元/天 解锁文章
「已注销」
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Laya中使用List组件
wanfping123的博客
06-20 1901
Laya中的List组件使用 入门 1.首先我们先单独创建一个测试场景，避免混乱。 2.在场景中创建一个List组件，并且在右边属性栏Rendertype中选择render 3.在List里创建一个Text,设置FontSize = 100后，在层级栏中 右键这个Text，选择转换为容器，类型为Box 4.将box 右边属性栏Rendertype中选择render（同理步骤2） 5.点击List,在右边属性框中设置RepeatX =》 1 RepeatY =》 5 。到这一步时list的轮廓已经出现 6.
Laya中的列表操作
the_vnas的博客
03-28 1144
Laya中的List处理方式
Laya---横向滚动列表
学海无涯
08-12 457
代码】Laya---横向滚动列表。
Laya---竖向滚动列表
学海无涯
08-22 515
laya竖向滚动列表
Laya的滚动容器Panel+HBox
xuniwawa010的专栏
07-09 1483
版本：Laya 2.2.0 参考：https://ldc2.layabox.com/doc/?nav=zh-ts-3-3-18 一 拖动一个panel和hbox到舞台，并且在hbox里放图片 二 设置panel滚动条 如果不设置panel的滚动条skin，这个panel是不会滚动的 拖动assets/comp/hscroll.png到属性面板hScrollBarSkin上 hbox的布局效果，只有在运行时才能看见 三 最终效果...
Laya实现滑动列表和翻页效果及优化
HifunのZone
03-10 3017
__前言： __ 在前端游戏开发中，我们经常需要做滑动列表，或者列表翻页的效果，笔者最近接触Laya编辑器，看官方的文档真的是看的生气，索性参照其他编辑器的方式实现了想要的效果，这里整理出来。 效果展示： 前期准备： 这里要先创建一个List组件，为其添加一个scrollerBar,(这里根据需求，如果需要垂直方向滑动就加VscrollerBar)， 需要注意的是，List组件的name需要写 ...
panel滚动区域
远行的博客
09-19 959
panel是LAYA提供的一种滚动组件，LIST也可以滚动。 给panel直接添加子元素，发现panel的滚动区域有点大，最后一个子元素可以一直滑到panel中间，而策划想要的效果确实panel的最后一个子元素，滑到panel边缘就不要再滑动。 实现方法是在UI编辑器里面给panel添加一个子元素box，把原本需要添加到panel的元素添加到box，设置一个变量tempY记录box所有子元素的...
LayaBox List使用记录 创建 增加 修改 滚动
qq2588258的博客
07-17 1750
官方链接：https://ldc.layabox.com/doc/?nav=zh-ts-6-0-0 看过官方文档后 如上图进行四步操作 1 红框部分是每个item的内容，创建好后，选中这几个控件然后ctrl+B将他们转化为容器，点确定，黄框部分就被创建出来了， 2同样的操作 Ctrl+B 将黄框部分转化为list ，这时候蓝色的list的就被创建了 ，根据图里的层级关系 很容易理解， 3然后右键...
LayaBox -- List组件的使用
热门推荐
阳仔博客
03-27 1万+
本节我们使用LayaBox 自带List组件实现了一个排行榜界面，由于List组件限制很多，我们下篇自己实现一个类似Unity ScrollView的效果。list滑动效果如下： 排行榜里面的数据，头像等都是随便写上去的，而且分数也没有实现从高到低的排序，我们现在只是做出上图的效果。 一、UI效果制作 a. 创建一个View类型的UI页面，RankList.ui。 b. 制作返回按钮和上面...
Laya List翻页滚动方案 & List滚动源码解析
ddmm2012的博客
03-29 897
Laya List翻页滚动方案 & List滚动源码解析 @author ixenos 2019-03-29 1.List翻页滚动方案 1 /** 2 * 计算下一页的起始索引, 不足时补足 3 * @param direction 0 for pre, 1 for nex ， @author ixenos 2019-03-29 4 *...
LayaAir实现技能滚动刷新
fulit的博客
07-27 3273
最近项目(H5手游项目，使用LayaAir引擎)中有一个技能box滚动刷新的功能需求。 H5游戏特别是面向手机浏览器更应该追求内存优化、非必要显示对象的删减。于是有了不使用遮罩、通过代码仅绘制技能box可见部分的构思。
laya ts fgui的list滚动列表设置
qq_40390815的博客
01-18 1356
FGUI如何拼接list功能以及如何代码实现
layabox list里添加点击事件
weixin_42369486的博客
08-27 4335
  cell.getChildByName('btnBuyProps').on(laya.events.Event.CLICK, this,function(){ this.event(ShopLimitTimeView.PROPS_ID,data.shop_list[index].id) })  
unity程序员转Laya入门(7) 用List制作商店或背包（类似Scroll view）
常城的专栏
06-12 855
研究了半天Laya官网的例子，然后各种琢磨，反复试验，最终用下面的方法实现了： 1，制作
Laya学习笔记-04使用ScrollBar滚动文本
a451319296的博客
05-23 1323
一、场景搭建 1.在Laya->工程->Scenes->新建->页面/场景 新建一个场景命名为“Main” 2.设置新建的场景属性 3.创建一个Text类型的UI组件 4.在右边Text的属性栏中设置Text的宽高及位置 5.设置Text的文本内容、字体大小、字体颜色、自动换行、垂直间距、文本超出文本域行为 6.在“层级”面版->Scene->创建UI组件->VScrollBar 7.设置VScrollBar的高度及位置...
LayaList的注意事项
鱼子酱F的博客
04-08 465
注意list，box，图片直接的位置关系，列表项不显示有时候是因为相对位置不对 列表无法下拉，我照着教程做了好几次，就是无法下拉，最后我发现把脚本加上去就可以下拉，不加就下拉不了，教程上也没说啊，如果还是没用，我建议完全照着官方文档做一边，它用label，你也用，做到一模一样，最后再改 ...
Layaair list 拖拽
唐僧的专栏
03-18 1228
要想 list 可以拖拽 必须要添加 vScrollBarSkin list_res 就是 list组件 private showHistory( data) { let resdata = []; for( let i =0; i < data.length;i++ ){ resdata.push(data[i]...
laya progressBar组件
最新发布
12-07
laya progressBar组件是一种进度条组件，用于显示任务的进度。以下是laya progressBar组件的一些特点和使用方法： 1. 特点： - 可以设置进度条的方向（水平或垂直）。 - 可以设置进度条的背景和前景颜色。 - 可以...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值