4.5.7.2. Тема в десктоп-приложениях

В десктоп-приложениях базовой темой является тема Nimbus.

Для внесения изменения в стандартную тему нужно создать пакет res.nimbus в пакете com.sample.sales.desktop модуля desktop. В пакете res.nimbus будут храниться файлы темы.

Рисунок 4.21.


В папке icons хранятся файлы пиктограмм, в файле nimbus.xml − описание стиля темы.

В файле свойств для десктоп-приложения нужно установить свойство cuba.desktop.resourceLocations (задает набор директорий, в которых расположены файлы стилей):

cuba.desktop.resourceLocations = \
com/haulmont/cuba/desktop/res \
com/sample/sales/desktop/res

Примеры

  1. Добавление пиктограммы.

    Если в десктоп-приложении требуется добавить новую пиктограмму, например, для кнопки, нужно создать пакет res.nimbus.icons в пакете com.sample.sales.desktop модуля desktop и поместить в него требуемое изображение.

    Рисунок 4.22.


    Описываем кнопку в дескрипторе, указывая в атрибуте icon путь до пиктограммы:

    <button id="button1" caption="Attention"  icon="icons/attention.png"/>

    Ниже представлена кнопка с пиктограммой attention.png

    Рисунок 4.23.


  2. Переопределение значений свойств темы, установленных по умолчанию.

    Рассмотрим на примере изменения цвета фона текстовых полей, обязательных для ввода.

    В пакете res.nimbus нужно создать файл nimbus.xml следующего содержания:

    <theme xmlns="http://schemas.haulmont.com/cuba/desktop-theme.xsd">
      <ui-defaults>
          <color property="cubaRequiredBackground" value="#f78260"/>
      </ui-defaults>
    </theme>

    Элемент ui-defaults служит для переопределения значений свойств темы платформы, установленных по умолчанию.

    В элементе ui-defaults присутствуют как свойства, содержащиеся в стандартной теме Nimbus (http://docs.oracle.com/javase/tutorial/uiswing/lookandfeel/_nimbusDefaults.html), так и свойства, созданные в платформе.

    В данном примере переопределено значение свойства платформы cubaRequiredBackground, хранящего цвет фона поля, обязательного для заполнения. Данное изменение коснется всех полей, обязательных для ввода.

  3. Создание стиля для элемента с помощью стандартных средств.

    Рассмотрим пример выделения надписи жирным цветом.

    Для того чтобы создать такой стиль, необходимо определить элемент style в файле темы nimbus.xml следующим образом:

    <theme xmlns="http://schemas.haulmont.com/cuba/desktop-theme.xsd">
      <style name="boldlabel">
          <font style="bold"/>
      </style>
    </theme>

    Элемент style может содержать другие элементы, в которых можно определять те или иные свойства: background, foreground, icon.

    В описании компонента надписи в xml-дескрипторе, к которой нужно применить созданный стиль, нужно указать атрибут stylename с именем стиля:

    <label id="label1" value="msg://labelVal" stylename="boldlabel"/>

    Таким образом, данный стиль будет применен только к тем надписям, для которых определен атрибут stylename со значением boldlabel.

  4. Создание пользовательского стиля.

    Если не хватает стандартных средств изменения стиля компонента, есть возможность создать пользовательский стиль.

    Создадим пользовательский стиль, который будет применяться для компонента Label. С помощью стиля содержимое компонента Label будет отображаться подчеркнутым.

    В первую очередь создадим класс-декоратор UnderlinedLabelDecorator:

    public class UnderlinedLabelDecorator implements ComponentDecorator {
    
      @Override
      @SuppressWarnings("unchecked")
      public void decorate(Object component, Set<String> state) {
          DesktopLabel item = (DesktopLabel) component;
          JLabel jlabel = item.getComponent();
    
          Font originalFont = jlabel.getFont();
          Map attributes = originalFont.getAttributes();
          attributes.put(TextAttribute.UNDERLINE, TextAttribute.UNDERLINE_ON);
          jlabel.setFont(originalFont.deriveFont(attributes));
      }
    }

    Определим пользовательский стиль в файле nimbus.xml:

    <theme xmlns="http://schemas.haulmont.com/cuba/desktop-theme.xsd">
      <style name="label-underlined" component="com.haulmont.cuba.desktop.gui.components.DesktopLabel">
          <custom class="com.sample.sales.desktop.gui.decorators.UnderlinedLabelDecorator"/>
      </style>
    </theme>

    В атрибуте component элемента style содержится название компонента, к которому может быть применен стиль с названием label-underlined.

    В элементе custom указывается путь до класса-декоратора, определенного ранее.

    При описании элемента надписи, к которой нужно применить пользовательский стиль, нужно в атрибуте stylename указать название стиля:

    <label id="label1" stylename="label-underlined" value="Label"/>

    Рисунок 4.24. Компонент надписи с пользовательским стилем

    Компонент надписи с пользовательским стилем