VintaSoft Imaging .NET SDK 15.1: Документация для Веб разработчика
В этом разделе
    Создание кнопки с возможностью выбора цвета для UI веб просмотрщика документов
    В этом разделе
    Вот код на JavaScript, который показывает, как создать кнопку с помощью средства выбора цвета и добавить созданную кнопку в меню "Tools" в VintaSoft веб просмотрщике документов:
    /**
     Initializes main menu of Vintasoft web document viewer.
     @param {object} docViewerSettings Settings of Vintasoft web document viewer.
    */
    function __initMenu(docViewerSettings) {
        // get items of document viewer
        var items = docViewerSettings.get_Items();
    
        // get the main menu of document viewer
        var mainMenu = items.getItemByRegisteredId("mainMenu");
        // if main menu is found
        if (mainMenu != null) {
            // get items of main menu
            var mainMenuItems = mainMenu.get_Items();
    
            // get "Tools" menu in web document viewer
            var toolsToolbarPanel = mainMenuItems.getItemByRegisteredId("toolsMenuPanel");
            // get items of "Tools" menu
            var toolsToolbarPanelItems = toolsToolbarPanel.get_Items();
    
            // create button with color picker
            var buttonWithColorPicker1 = new Vintasoft.Imaging.UI.UIElements.WebUiButtonWithColorPickerJS({
                cssClass: "vsui-button vsdv-imageViewerSettingsButton",
                title: "Select the text color",
                localizationId: "selectTextColorButton",
                initialColor: '#FF0000',
                showColorOnButton: false
            });
            // subscribe to the "colorChanged" event of button
            Vintasoft.Shared.subscribeToEvent(buttonWithColorPicker1, "colorChanged", function (event, eventArgs) {
                function argbIntToColor(argbInt) {
                    // ensure the number is treated as an unsigned 32-bit integer
                    argbInt >>>= 0;
    
                    // extract the components using bitwise shifts and masks
                    const b = argbInt & 0xFF; // Blue component
                    const g = (argbInt & 0xFF00) >>> 8; // Green component
                    const r = (argbInt & 0xFF0000) >>> 16; // Red component
                    const a = ((argbInt & 0xFF000000) >>> 24) / 255; // Alpha component (normalized to 0-1)
    
                    // return the color in the CSS rgba() string format
                    return "rgba(" + r + ", " + g + ", " + b + ", " + a.toFixed(2) + ")";
                }
    
    
                // get integer ARGB value
                var argbIntValue = eventArgs.color;
                // convert integer ARGB value to a color value
                var colorValue = argbIntToColor(argbIntValue);
                alert("Color is selected: " + colorValue);
            });
    
            // add button with color picker to the "Tools" menu in web document viewer
            toolsToolbarPanelItems.addItem(buttonWithColorPicker1);
        }
    }
    


    Вот скриншот VintaSoft веб просмотрщика документов с кнопкой выбора цвета, который был создан с использованием JS-кода, приведенного выше: