目前我们准备为tuo-three2项目添加ui拓展接口，以满足未来更多灵活插件的应用。很多计划中的插件，例如visibility, meshInspect, transform, measure等插件都需要向外沿伸出ui接口，用以触发一些事件的发生。例如，visibility需要一个按钮，来触发对被选中物体的可视化调整，meshInspect插件需要好几个按钮，来触发对mesh对象的不同检测方案。transform和measure这类需要对物体做移动，或测量的插件更需要有按钮来触发一些操作。
另一方面，我们还需要tuo-three2的插件能够对ui的内容具备一定的控制能力，所以现在我们需要规范一套与tuo-three2兼容的ui接口机制。
此规范规定与tuo-three2插件相交互的两类接口，第一类需要与TuoView的operations对接。它提供一些工具类型的交互接口，它只支持事件触发型的交互。第二类需要监听TuoView发布的“applyDialog”事件，并且能够根据“applyDialog”发布的窗口类型响应出不同类型的对话窗口。这些对话窗口最终与TuoView中内容的交互也主要是基于tuo-three2的事件机制，由其自由的交互。
基于TuoView.operations的交互机制
- 每一个ui接口都与一个TuoView实例所绑定。
- ui接口需要能够监听与之所绑定的TuoView实例的‘operationsUpdated’事件(TuoView.addEventListener('operationsUpdated', <uiHandle>)), 当ui接口监听到此事件则触发其对ui界面的一次更新。ui接口的更新方式将会参照此TuoView实例的operations属性。
- 我们规定2中提到的TuoView.operations是一个Array对象。这个Array对象中的值有如下两种类型的结构：TuoView.operations = [<TypeA_or_TypeB>, ...]
TypeA:
{
displayName: String,
eventType: String,
icon: <Svg_Url>
}
TypeB:
{
displayName: String,
icon: <Svg_Url>,
sub: [<TypeA_or_TypeB>, ...]
}4. ui界面需要提供不同的接口让每个TypeA所对应的event被与此ui界面所绑定的TuoView实例触发。 即TuoView.dispatchEvent('event')
基于'applyDialog'事件机制的交互
- TuoView会发布如下格式的事件：
TuoView.dispatchEvent({
type: 'applyDialog',
payload: {
dialog: <dialog_type>,
data: <data_needed_by_dialog>
}
})2. 与TuoView绑定的ui模块，需要监听这个消息，并响应这些消息弹出相对应的对话框。如果此对话框，需要触发TuoView的事件，可以自由访问此TuoView的实例，并调用TuoView.dispatchEvent或者TuoView.scene.dispatchEvent函数来发布事件。