属性面板插件

属性面板 BasePropertyViewPlugin 是个非常特殊的插件，它要与构件树控件 BuildingTreeWidget 以及建筑 BIM 场景下的建筑构件联动，属性面板的属性之意就是构件的属性。

1. 初始化

由于属性面板需要时刻与建筑 BIM 场景下的建筑构件联动，所以属性面板插件的初始化是跟随场景的构建的，当场景初始化的时候，属性面板也被初始化了，只是当我们没有添加自定义工具栏控件 ToolbarWidget 时，属性面板时不被展示出来的。

即属性面板在场景构建时内置初始化。

2. 插件管理

正如上述，属性面板不需要手动注册，但是可以通过属性控制其在自定义工具栏控件 ToolbarWidget 中按钮的显示与隐藏。

2.1 控制显隐

控制属性面板在自定义工具栏控件 ToolbarWidget 中的显示与隐藏，需要用 popup 属性对象中的 autoOpenEnabled , true 为显示，反之不显示。

代码示例如下：

const scene = new ubm.Scene('app', {
  viewingMode: 'local',
  popup: {
    autoOpenEnabled: true
  }
})

 scene.ui.add(new ubm.ToolbarWidget(scene, {
    container: container,
    tools: []
  }))//自定义工具栏

2.2 插件用法

该插件使用普遍，关联众多，用法居多。

2.2.1 普通使用

普通用法就是使用上述方法，设置 autoOpenEnabled:true (或者直接不设置，默认为 true )使该插件在自定义工具栏中显示，点击对应按钮打开属性面板，然后再点击建筑场景构件，就会展示出构件属性。

2.2.2 右键菜单使用

在右键菜单中使用特性即属性面板，然后点击建筑构件右键点击特性，就会展示属性面板。

代码示例如下：

const scene = new ubm.Scene('app', {
  viewingMode: 'local',
  ui: {
    //右键菜单
    contextMenu: {
      enable: true,
      menus: [[
        {
          label: '特性', //属性面板
          name: 'property',
        }
      ]]
    }
  }
})
注：在使用上述方法时不可设置 autoOpenEnabled:false 。否则不显示。

2.2.3 构件树使用

此插件与构件树控件 BuildingTreeWidget 具有联动，所以构件树也可唤醒属性面板插件。

示例代码如下：

const scene = new ubm.Scene('app', {
  viewingMode: 'local',
  ui: {
    widgets: [
      {
        id: 'toolbar',
        name: 'ToolbarWidget',
        position: 'manual',
        props: {
          container: 'toolbar',
          tools: [
            {
              name: 'tree',
              label: '构件树',
              props: {
                //是否点击节点唤醒属性面板
                openProperty: true,
                keys: {
                  primary_key: 'guid',
                }
              }
            }
          ]
        }
      }
    ]
  }
})
注：在使用上述方法时也不可设置 autoOpenEnabled:false 。否则不显示。

当场景中添加构件树控件时，只要对构件树传入属性 openProperty: true ，点击构建树的节点就会唤醒属性面板。

2.3 插件方法

在某些场景下，需要使用到该属性面板中构件属性信息。所以 SDK 将该构件属性信息暴露了。方法如下：

  // scene为场景示例
  scene.event.on('plugin.basePropertyView.show',(e)=>{
    // e.detail 为属性面板中鼠标所点击构件相关信息
    console.log(e.detail)
  })

上述方法使用到了 SDK 内置的事件监听，在属性面板插件 BasePropertyViewPlugin 中发布事件，在场景中监听事件触发。

Table of Contents