Come personalizzare l'interfaccia utente di CODE e nascondere barre degli strumenti specifiche

In breve: in CODE, è possibile modificare lo stile generale della barra degli strumenti tramite l'impostazione di visualizzazione Compatta o a schede. Per nascondere una scheda del notebook o un comando, il metodo supportato è l'API PostMessage dell'host WOPI; i menu standard del visualizzatore non rimuovono in modo permanente i singoli comandi per tutti gli utenti. Gli amministratori possono impostare la modalità di interfaccia predefinita per un server, mentre gli host che integrano CODE possono inviare messaggi di visualizzazione o di occultamento a livello di sessione.

Scegli il metodo più adatto al tuo livello di accesso. Se desideri solo più spazio nel documento, comprimi la barra degli strumenti o passa alla visualizzazione compatta. Se l'integrazione WOPI deve omettere la scheda Guida o un comando di formattazione, invia il messaggio PostMessage corrispondente dopo che l'editor è pronto. Se il tuo obiettivo è impedire un'azione come la stampa, il download o la modifica, utilizza anche la funzionalità o l'autorizzazione WOPI pertinente; nascondere un pulsante modifica la presentazione, non l'autorizzazione.

Scegli la personalizzazione giusta

Il manuale SDK di riferimento indica Hide_NotebookTabche la funzionalità è disponibile a partire dalla versione 24.04.11.1 e Hide_Commanddalla versione 24.04.11.2. I pacchetti di rilascio di CODE e le build dell'integratore possono differire, quindi verifica la versione del server che stai effettivamente utilizzando prima di fare affidamento su un messaggio API.

Modifica l'impostazione predefinita tra la visualizzazione compatta e quella a schede.

La visualizzazione compatta utilizza un menu e una barra degli strumenti più piccola. La visualizzazione a schede raggruppa i controlli nelle schede della barra del notebook. L'impostazione del server è user_interface.mode, con valori supportati compacte tabbed. Le etichette più vecchie come classice notebookbarsono deprecate a favore di questi nomi.

Per impostare un valore predefinito controllato dall'amministratore, modificare la <mode>voce esistente all'interno della <user_interface>sezione coolwsd.xml:

<user_interface>
  <mode type="string" desc="Controls the user interface style. The 'default' means: Take the value from ui_defaults, or decide for one of compact or tabbed (default|compact|tabbed)" default="default">tabbed</mode>
</user_interface>

Utilizzare compactal posto di tabbedper il menu compatto. In un file di configurazione reale, modificare la voce di modalità esistente anziché aggiungerne una seconda. Il percorso di configurazione esatto e la procedura di riavvio dipendono dal fatto che CODE sia installato come pacchetto, container o tramite un'altra piattaforma. Seguire il metodo di configurazione di tale distribuzione, riavviare o ricaricare il servizio secondo necessità e aprire una nuova sessione di documenti per confermare l'impostazione predefinita.

Questa impostazione definisce una modalità di interfaccia predefinita; non nasconde un comando specifico. Un utente o un integratore potrebbero aver salvato delle preferenze di interfaccia che hanno la precedenza, a seconda della configurazione dello stato dell'interfaccia utente salvata dal server. Se un browser continua a riaprirsi con una visualizzazione diversa, testa una nuova sessione e verifica il comportamento delle preferenze utente dell'integratore prima di modificare ulteriori impostazioni del server.

Comprimi la barra degli strumenti senza rimuovere i comandi

Quando l'obiettivo è semplicemente aumentare lo spazio disponibile nel documento, di solito è sufficiente comprimere la barra degli appunti a schede. Il Collapse_Notebookbarmessaggio dell'SDK nasconde i pulsanti della barra degli appunti; i nomi delle schede rimangono visibili, consentendo agli utenti di espandere nuovamente i controlli. Lo stesso messaggio nasconde anche la barra dei pulsanti nella visualizzazione compatta. Si tratta di una modifica reversibile della visualizzazione, non di un modo per disabilitare le funzionalità di modifica.

In un'interfaccia supportata, un utente può anche comprimere o espandere la barra del notebook interagendo con la relativa barra delle schede. Il comportamento preciso del clic o del doppio clic può variare a seconda della visualizzazione e del rilascio. Se gli utenti devono ripristinare una barra compressa, è consigliabile mantenere visibili i nomi delle schede e testare l'azione nella stessa versione di CODE che utilizzano.

Nascondere una scheda o un comando in un'integrazione WOPI

L'occultamento per sessione richiede un'applicazione host che incorpori CODE in un iframe e possa inviargli messaggi. Non si tratta di un'impostazione generica che può essere incollata coolwsd.xml. L'API PostMessage utilizza messaggi con un MessageId, un timestamp e un facoltativo Values. L'host WOPI deve completare lo scambio di disponibilità prima di inviare i comandi dell'editor. Configurare WOPI PostMessageOriginper la pagina host e utilizzare l'origine iframe CODE esatta come destinazione del messaggio del browser; non utilizzare un'origine di destinazione jolly.

Dopo che l'host ha ricevuto l' App_LoadingStatusevento di prontezza appropriato e ha inviato Host_PostmessageReady, può inviare un messaggio di nascondi. Ad esempio, le seguenti chiamate nascondono la scheda Guida e il comando sottolinea per la sessione dell'editor aperta:

const frame = document.getElementById("collaboraFrame");
const collaboraOrigin = "https://office.example.com";

function sendToCollabora(MessageId, Values = {}) {
  frame.contentWindow.postMessage({
    MessageId,
    SendTime: Date.now(),
    Values
  }, collaboraOrigin);
}

// Call after the WOPI PostMessage readiness exchange.
sendToCollabora("Hide_NotebookTab", { id: "Help" });
sendToCollabora("Hide_Command", { id: ".uno:Underline" });

Sostituisci office.example.comcon l'origine del tuo iframe CODE. L'esempio illustra la struttura del messaggio; collegalo al ciclo di vita iframe reale dell'host e convalida l'origine dei messaggi in arrivo prima di rispondere. La documentazione di CODE indica che i messaggi host inviati in precedenza Host_PostmessageReadypotrebbero essere ignorati.

Quale messaggio dovresti usare?

• Hide_NotebookTab: Usalo per un'intera scheda nella visualizzazione a schede. È idl'ID della scheda, ad esempio Help. Show_NotebookTabannulla la modifica. La scheda rimane nascosta per la sessione fino all'arrivo di un messaggio di visualizzazione.
• Hide_Command: Usalo quando il comando deve scomparire dal menu, dalla barra degli strumenti e dai menu contestuali. Un esempio di ID è .uno:Underline. Show_CommandLo inverte. Usalo solo quando la rimozione di quel comando da tutte queste superfici è il risultato desiderato.
• Hide_ButtonUtilizzalo quando desideri nascondere un singolo pulsante anziché tutte le voci dell'interfaccia utente per il comando. Il suo ID è l'ID di un pulsante della barra degli strumenti, non necessariamente il nome del comando UNO. Collabora documenta che questi ID di solito rimangono stabili, ma non è garantito; verificali confrontandoli con il codice sorgente per la tua build e il tuo fattore di forma del dispositivo esatti.
• Hide_Menubar: Questa opzione nasconde l'intera barra dei menu. Non si tratta di un controllo per singolo comando e non deve essere confusa con la possibilità di nascondere una scheda della barra dei notebook.

L'API postMessage è pensata per un host di integrazione. Se utilizzi Nextcloud, ownCloud o un'altra piattaforma, verifica se il relativo connettore espone un'impostazione supportata prima di creare codice host personalizzato. Evita di inserire CSS nella pagina dell'editor: è instabile tra le diverse versioni e nasconde i controlli solo a livello visivo.

Verifica che la modifica sia adatta al tuo caso d'uso

Apri un documento di prova utilizzando lo stesso browser, tipo di documento, autorizzazioni e versione di CODE dei tuoi utenti. Conferma la modalità selezionata, verifica che sia nascosto solo il tasto o il comando desiderato e testa la visualizzazione del messaggio o l'espansione della barra degli strumenti corrispondenti. Ripeti la procedura per Writer, Calc e Impress se la tua integrazione supporta tutti e tre i moduli; i comandi disponibili e gli ID delle barre degli strumenti non sono necessariamente identici tra i vari moduli.

Se un controllo nascosto appare ancora, verificare che l'host abbia inviato il comando Host_PostmessageReady, che l' PostMessageOriginorigine WOPI e l'iframe di destinazione siano corretti e che il messaggio abbia utilizzato l'ID e l'ortografia previsti. Verificare inoltre la versione del server rispetto alla baseline delle funzionalità documentata. Un occultamento visivo riuscito non rimuove il comando dal motore di documenti sottostante né stabilisce una restrizione di sicurezza. Utilizzare le autorizzazioni WOPI e le policy di backend per il controllo degli accessi.

Riferimenti ufficiali

• Manuale dell'SDK di Collabora Online, 24.04: configurazione e API PostMessage
• Documentazione dell'API PostMessage dell'SDK Collabora Online
• Note di rilascio di CODE 26.04
• Note di rilascio di CODE 21.11: Attivazione/disattivazione della visualizzazione compatta e a schede.