CIB doXiview technischer Leitfaden

Anpassung des Look&Feels

Das Aussehen der Elemente innerhalb der Oberfläche von CIB doXiview wird durch hinterlegte Icons und definierte CSS-Styles vorgegeben.

Oft kommt es vor, dass CIB doXiview von einer anderen Anwendung gestartet oder sogar innerhalb einer aufrufenden Anwendung dargestellt wird. Für diesen Anwendungsfall soll es möglich sein, das Aussehen von CIB doXiview so anzupassen, dass für den Nutzer kein Stilbruch zwischen den beiden Anwendungen entsteht.

Der einfachste Weg der Anpassung ist die Farbgebung anzupassen. Dies geschieht über eine einzige Konfigurationseinstellung:

Property

Beschreibung

custom.color

Definiert die Farbe der Toolbar-Schaltflächen. Selektionsrahmen etc. und wird als Hexadezimalwert angegeben. Beispiel: #164E8C

 

Falls diese Art der Anpassung noch nicht ausreicht, weil Sie beispielsweise auch die Symbole der Schaltflächen verändern wollen, sei auf das separate Tool „Spritemaker“ verwiesen.

Die Anpassung von CSS-Styles sowie die automatisierte Erstellung eines eigenen Look&Feels sind im Dokument „CIB doXiview - Stylesheets“ ausführlich beschrieben.


Erstellen einer eigenen Toolbar

Wenn Sie eine eigene Toolbar erstellen möchten, gehen Sie bitte wie folgt vor:

1) Erstellen Sie im Verzeichnis WEB-INF/classes/toolbar-config eine neue XML-Datei, die den Aufbau Ihrer Toolbar definiert. Im diesem Verzeichnis befinden sich die Toolbar-Definitionen für sämtliche Anwendungsfälle. Als Beispiel sei hier folgende Definition aufgeführt.

<toolbar-config >

       <direction>HORIZONTAL</direction>
        <groups>
        <group id="main" alignment="first">
        <elements>
                <element id="print"/>
                <element id="export-original"/>
        </elements>
        </group>
        <group id="view" alignment="first">
        <elements>
                <element id="zoom-combo"/>
                <composite-element id="zoom">
             <elements>
                                        <element id="zoom-out"/>
                                        <element id="zoom-in"/>
                                </elements>
                        </composite-element>
                </elements>
        </groups>
</toolbar-config>

 

2) Konfigurieren Sie in der Datei environment-config.xml im Verzeichnis WEB-INF/classes/context die neue Toolbar, indem ein neues Key-Value Paar in der Java Bean mit Namen „toolbarConfiguration“ hinzugefügt wird. Der Key enthält einen frei wählbaren Toolbar-Namen. Der Value enthält den Dateinamen der XML-Datei mit der Toolbar-Definition.

<bean id='toolbarConfiguration'
class='de.cib.webview.server.toolbarconfig.ToolbarConfigurationContainer'
>

                <property name="configurationFileMap" >
                        <map>
                             <!-- CIB Toolbar Styles -->
                             <entry key="doxisafe" value="/toolbar-config/ui.doxisafe.xml" />
                             <entry key="reading-mode" value="/toolbar-config/ui.reading-mode.xml" />
                             <entry key="upload" value="/toolbar-config/ui.upload.xml" />
                         </map>
                </property>
</bean>
 

3) Um die neue Toolbar in CIB doXiview zu nutzen, muss der in Schritt 2 gewählte Toolbar-Name im Start-Parameter „ui“ als Wert gesetzt werden.

Detail-Informationen dazu finden Sie in den Dokumentationen:

„CIB doXiview Toolbar Konfiguration“

CIB doXiview - Startparameter