美文网首页
开发技巧:批量添加组件&设置组件属性

开发技巧:批量添加组件&设置组件属性

作者: iqxtreme | 来源:发表于2018-12-22 22:42 被阅读0次

应用情景

  • 场景中有大量节点需要添加某种组件。
  • 场景中有大量节点需要设置某种组件的属性。
  • 将拖拽组件一个一个的手动附加到需要的节点上,再一个一个设置这些属性会非常繁琐。

应用举例

场景中有大量节点需要添加拖拽组件(geoDraggable),

拖拽组件

并且还要把这些拖拽组件的lockTarget、dragMoveEvents、dragEndEvents设置为相同的。

拖拽组件的属性
  • 假设场景中已经有一个节点refinedNode,已经附加了拖拽组件,并且配置好了各项属性。
  • 现在要为节点rawNode下的所有携带标记drag=a”的子孙节点添加拖拽组件,并且将属性:lockTarget、dragMoveEvents、dragEndEvents,设置为与refinedNode相同。
  • 在游戏开始处(或需要的时候),使用下列代码,就能完成组件的附加和配置,不用在编辑器中手动操作:
var Utils = require('geoUtils');
// 定义要获取的组件
var Draggable = require('geoDraggable');
// 或者直接用组件类名(文件名)
var Draggable = 'geoDraggable';
// 获得已配置好的组件
var refinedCom = refinedNode.getComponent(Draggable);
// 构建要复制的属性承载结构
var attrs = Utils.obj.getAttrs(refinedCom, ['lockTarget', 'dragMoveEvents', 'dragEndEvents']);
// 为rawNode的子孙附加拖拽组件并设置属性
Utils.node.setComponentAttrs(
  rawNode, // 以该节点为起点执行操作
  Draggable, // 目标是拖拽组件
  attrs, // 要将拖拽组件的属性依据attrs进行设置
  true, // 考虑(遍历)rawNode到子孙节点
  'drag', // 只关注携带drag=a标记到节点
  'a', // 只关注携带drag=a标记到节点
  true // 若遍历到的节点没有Draggable组件就自动附加
);

方法详解

  • 方法原型:
/**
 * 设置一个节点(或包含其子孙节点)某类组件的指定属性值。
 */
setComponentAttrs(
  node, // 被设置的节点
  componentTypeOrName, // 目标组件类型或名称
  attrs, // 要设置的组件属性名及值
  includeHierarchy, // 是否考虑node子孙
  markNameInHierarchy, //列为考虑对象的子孙的标记名
  markValueInHierarchy, // 列为考虑对象的子孙的标记值
  addIfNotExists, // 若组件不存在是否自动添加, 
  validateFunc // 验证是否对遍历到到节点实施操作
)

延展阅读

相关文章

  • 开发技巧:批量添加组件&设置组件属性

    应用情景 场景中有大量节点需要添加某种组件。 场景中有大量节点需要设置某种组件的属性。 将拖拽组件一个一个的手动附...

  • 开发技巧汇总

    节点标签&节点查找 批量添加组件&设置组件属性 批量配置组件 特征匹配 获取序列中的排列模式 匹配两个序列的排列特...

  • Panel 添加Scroll Rect 滚动组件步骤及问题

    Panel 添加 ScrollRect 滚动组件 添加组件Scroll Rect 设置Content 属性 添加M...

  • 【系统】

    1. 添加组件:【系统】、【行】; 2. 设置行属性:水平居中,垂直居中; 3. 在行1中添加一个【按钮】组件; ...

  • Vue父子组件通信

    一、父组件向子组件传递数据 (1)在父组件中的子组件标签中添加属性,给子组件传递数据 要是属性值为变量,要添加冒号...

  • react props属性

    props属性信息 作用:从组件外部向组件内部传数据 可以设置默认属性 组件名.defaultProps = {}...

  • 开发技巧:批量配置组件

    前言 通过代码方式批量配置组件的方式已经介绍过,若希望通过编辑器实现批量操作,可阅读此文章。 geoCompone...

  • 微信小程序中组件的显示/隐藏:wx:if /hidden属性

    组件有个共同属性——,用于设置组件的显示/隐藏,默认为显示:设置为true时,组件隐藏;false时,组件显示。 ...

  • 玩溜Cocos Creator入门学习(九)UI系统介绍UI组件

    引言 Slider是一个滑动器组件,如图 Slider组件 点击 属性检查器下面的添加组件按钮,然后从添加UI组件...

  • 【页面】

    1. 添加组件; 2. 设置相关属性,达到以下效果; 3. 添加相应事件; 4. 预览效果;

网友评论

      本文标题:开发技巧:批量添加组件&设置组件属性

      本文链接:https://www.haomeiwen.com/subject/fivwkqtx.html