# BoundHelper组件

使用BoundHelper组件可以为实体添加外包盒助手效果，由 @tx3d/extension 包提供。

import { BoundHelper } from '@tx3d/extension';

// 创建实体
const entity = engine.createEntity();

// 添加BoundHelper组件
const bound = entity.addComponent( BoundHelper, {

    opacity: 0.2,           // 外包盒透明度
    color: '#ffffff',       // 外包盒颜色
    outlineGraph: true,     // 图形边框是否可见
    outlineGraphColor: '#0ac2f0',   // 图形边框颜色
    outlineGraphWidth: 1.0,         // 图形边框宽度
    outlineCorner: false,            // 角线边框是否可见
    outlineCornerColor: '#ffffff',   // 角线边框颜色
    outlineCornerWidth: 3.0,         // 角线边框宽度
    occluded: false             // 遮挡剔除

} );

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

提示

BoundHelper组件初始化参数，详见BoundHelperParameters。

# 属性

🌏 opacity 外包盒透明度

// 获取外包盒透明度
const opacity = BoundHelper.opacity;

// 设置外包盒透明度
BoundHelper.opacity = 1.0;

1
2
3
4
5

🌏 color 外包盒颜色

// 获取外包盒颜色
const color = BoundHelper.color;

// 设置外包盒颜色
BoundHelper.color = '#ffffff';

1
2
3
4
5

🌏 outlineGraph 图形边框是否可见

// 获取图形边框是否可见
const outlineGraph = BoundHelper.outlineGraph;

// 设置图形边框是否可见
BoundHelper.outlineGraph = false;

1
2
3
4
5

🌏 outlineGraphColor 图形边框颜色

// 获取图形边框颜色
const outlineGraphColor = BoundHelper.outlineGraphColor;

// 设置图形边框颜色
BoundHelper.outlineGraphColor = '#de98de';

1
2
3
4
5

🌏 outlineGraphWidth 图形边框宽度

// 获取图形边框宽度
const outlineGraphWidth = BoundHelper.outlineGraphWidth;

// 设置图形边框宽度
BoundHelper.outlineGraphWidth = 1.0;

1
2
3
4
5

🌏 outlineCorner 角线边框是否可见

// 获取角线边框是否可见
const outlineCorner = BoundHelper.outlineCorner;

// 设置角线边框是否可见
BoundHelper.outlineCorner = false;

1
2
3
4
5
6

注意

默认边框为角线边框，切换图形边框需设置角线边框不可见

🌏 outlineCornerColor 角线边框颜色

// 获取角线边框颜色
const outlineCornerColor = BoundHelper.outlineCornerColor;

// 设置角线边框颜色
BoundHelper.outlineCornerColor = '#de98de';

1
2
3
4
5

🌏 outlineCornerWidth 角线边框宽度

// 获取角线边框宽度
const outlineCornerWidth = BoundHelper.outlineCornerWidth;

// 设置角线边框宽度
BoundHelper.outlineCornerWidth = 1.0;

1
2
3
4
5

🌏 occluded 是否遮挡剔除

// 是否遮挡剔除
const occluded = BoundHelper.occluded;

// 是否遮挡剔除
BoundHelper.occluded = false;

1
2
3
4
5

← Belt组件 CoalFlow组件 →