# # 自定义文本选择工具浮动工具框

自定义悬浮工具提示包括两个步骤。首先，您应该创建一个自定义控制器来定义目标工具的逻辑，然后在 fragments 中添加或者编辑该工具。本节内容将介绍：

- 创建自定义控制器和通过 fragments 修改组件示例
- 悬浮工具提示中使用的逻辑处理方法
- 悬浮工具提示的组件名称

## # 创建自定义控制器和通过 fragment 配置修改组件示例

示例代码在 `/examples/UIExtension/custom-text-selection-tool` 目录下。

## # 悬浮工具提示中使用的逻辑处理方法

在某些情况下，当您修改工具提示时，您很可能希望创建自己的控制器来处理工具。以下代码是创建控制器的常用方法。

    var tooltipLayer = this.component.getClosestComponentByType('tooltip-layer');
    var textSelectionTool = tooltipLayer.getCurrentSelectionTool();
    textSelectionTool.getSelectionInfo().then((selectionInfo)=>{
    });
    textSelectionTool.pageRender //The current rendering page object

getClosestComponentByType() 函数用来获取匹配的工具提示层。 getCurrentSelectionTool() 函数用来获取文本选择工具对象。 getSelectionInfo() 函数用来获取选定的文本信息和当前渲染页面对象。获取的文本信息包括：

- page // PDF 页面对象
- text // 文本内容
- rectArray // 文本块 (单位: point)

## # 悬浮工具提示的组件名称

组件名称 | 描述
--- | ---
fv--text-selection-tooltip | 悬浮工具提示层
fv--text-selection-tooltip-copy | 复制工具
fv--text-selection-tooltip-create-highlight | 高亮工具
fv--text-selection-tooltip-create-strikeout | 删除线工具
fv--text-selection-tooltip-create-underline | 下划线工具