egret 创建html组件,Egret中tree组件使用案例

这篇博客介绍了如何在 Egret 游戏开发框架中使用 Tree 组件。通过示例代码,展示了如何创建并设置数据源,实现文本过多时自动换行的功能,以及如何通过 iconFunction 设置节点图标。示例详细解释了如何配置 Tree 的属性,如 labelField,以及如何展开指定节点。
摘要由CSDN通过智能技术生成

Egret中tree组件使用案例,包含(文本过多时,自动换行功能)

private creatTree(): void {

var dp: egret.gui.ObjectCollection = new egret.gui.ObjectCollection();

dp.source = { children: [{ dir: true,name: "TreeItem0",children: [{ name: "TreeItem00大娃娃吾问无为谓\r呜呜呜呜呜呜dawd" },{ dir: true,name: "TreeItem01",children: [{ name: "TreeItem010" }] }] },name: "TreeItem1",children: [{ name: "TreeItem10" },{ name: "TreeItem11" }] },{ name: "TreeItem2" }] };

//设置数据源的父子关系,这样才会缩进

egret.gui.ObjectCollection.assignParent(dp.source,"children","parent");

//创建树

var tree: egret.gui.Tree = new egret.gui.Tree();

tree.labelField = "name";

tree.top = 20;

tree.left = 20;

tree.right = 20;

tree.height = 300;

tree.dataProvider = dp;

tree.expandItem(dp.getItemAt(0),true);

this.addChild(tree);

// 还可以通过iconFunction,设置每一项前面显示的小图标:

// tree.iconFunction = this.iconFunc;

/*呈现项的icon筛选*/

}

private iconFunc(item: any): any {

if(item.dir) return "tree_icon_dir_png";

else return "tree_icon_file_png";

}

70f146c4ad0355d4f473db1b2b109beb.png



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值