【Foxit PDF SDK for Web】如何在工具栏中放置一个自定义的按钮,并可以自定义按钮的图标、图标下的文字、点击时的触发事件?

您可以参考开发者手册中第96页`UI fragments`章节的内容,Fragment 是一段 UI 代码段,用来在 UI template 中插入、删除和修改组件。其适用于在基于内置模板的基础上进行少量的 UI 自定义。代码实现时,您有两种方式可以参考:
(1)您可以仿照开发者手册中第97页中的代码示例,新建一个自定义的appearance变量,在其default fragments配置中完成自定义UI的编辑,然后在初始化实例对象pdfui时,赋值给appearance参数;
(2)您也可以参考SDK中内置的示例代码`examples/UIExtension/fragment_usage/`,直接在初始化实例对象pdfui的fragments参数中进行编辑,在template中写入自定义按钮的图标、文字等,config中写入自定义按钮的触发事件;
无论您采用上述两种方式中的哪一种,都请仔细阅读`Fragment 配置参数描述`章节的内容。
例如,想要在默认工具栏中的“属性”按钮后边插入用户自定义的一组或指定个数的组件,可以参考以下代码片段:

<script src="../../../lib/preload-jr-worker.js"></script>

<script>
    var readyWorker = preloadJrWorker({
        workerPath: '../../../lib/',
        enginePath: '../lib/jr-engine/gsdk',
        fontPath: '../external/brotli',
        licenseSN: licenseSN,
        licenseKey: licenseKey
    })
</script>
<script src="../../../lib/UIExtension.full.js"></script>
<script>
    var PDFUI = UIExtension.PDFUI;
    var FRAGMENT_ACTION = UIExtension.UIConsts.FRAGMENT_ACTION;
 
    var pdfui = new PDFUI({
        viewerOptions: {
            libPath: '../../../lib',
            jr: {
                readyWorker: readyWorker
            }
        },
        renderTo: '#pdf-ui',
        appearance: UIExtension.appearances.adaptive,
        fragments: [{
            target: 'file-property',
            template: `<group name="home-tab-group-custom">
                    <dropdown icon-class="fv__icon-toolbar-stamp">
                        <xbutton  name="zhangsan1">张三1</xbutton>,
                    </dropdown>
                    <ribbon-button icon-class="fv__icon-toolbar-hand" name="cus-button1" text="button1"></ribbon-button>
                </group>`,
            action: FRAGMENT_ACTION.AFTER,
            config: [{
                target: 'cus-button1',
                callback: function() {
                    alert('button1 clicked!');
                }
            }, {
                target: 'zhangsan1',
                callback: function() {
                    alert('zhangsan1');
                }
            }]
        }],
        addons: UIExtension.PDFViewCtrl.DeviceInfo.isMobile ?
            '../../../lib/uix-addons/allInOne.mobile.js' '../../../lib/uix-addons/allInOne.js'
    });
</script>