SCO поддерживает темы оформления. Это возможность изменить внешний вид всего приложения или отдельных форм. При помощи темы оформления можно изменить стили отображения текста, кнопок и других элементов, а также изменить расположение элементов на отдельных формах с добавлением новых элементов.
На данный момент предоставляется две темы оформления. Также можно создать новую или изменить отдельные параметры темы при помощи настроек.
Изменение темы оформления
Для выбора одной из существующих тем, достаточно указать ее название. В теме оформления можно также указать тип модели кассы.
Наименование | Возможные значения | Описание |
---|---|---|
Файл /opt/sst-sco/conf/theme.ini , секция [Theme] , настройки темы оформления | ||
name |
| Название темы. |
deviceType |
| Название модели. Используется для изменения набора изображений-подсказок для определенных моделей кассы в рамках одной темы. |
[Theme] name = default deviceType = SST-TOWER
[Theme] name = slim
Изменение параметров темы оформления
В установленной теме оформления можно изменять отдельные параметры. В каталоге основной темы /opt/
sst-sco/themes/default
присутствует файл theme.json
. В нем задаются параметры, которые можно изменить при помощи настроек вида <тип параметра><параметр с заглавной буквы> = <новое значение>.
Например, цвет горизонтальной линии в theme.json
устанавливается настройкой:
{ "default" : { "color": { "horizontalLine": "#DCDCDC", }, }, }
Для изменения цвета необходимо в файле /opt/
sst-sco/conf/
theme.ini
записать новое значение. Например:
[Theme] colorHorizontalLine = "#B5A3D0"
Изменение логотипа программы
По умолчанию используется стандартный логотип Artix. Его можно изменить настройками.
[Theme] iconLogo = /opt/sst-sco/themes/default/icons/newlogo.png geometryLogoSize = 128px 64px
Наименование | Возможные значения | Описание |
---|---|---|
Файл /opt/sst-sco/conf/theme.ini , секция [Theme] , настройки темы оформления | ||
iconLogo | путь до файла по умолчанию ./icons/logo.png из темы оформления | Путь до изображения логотипа в формате png. |
geometryLogoSize | <ширина>px <высота>px | Размер логотипа, указывается ширина и высота в пикселях. Высота ограничена темой оформления. Максимальная ширина логотипа - 512 px, высота - 64 px (86 px для темы slim). |
Если ширина и высота изображения больше или меньше значения из geometryLogoSize
, то при выводе изображения на экран размер картинки будет пропорционально изменен. Область кнопки перехода в меню изменяется в зависимости от ширины логотипа.
Создание новой темы оформления
Для создания новой темы оформления необходимо в каталоге /opt/sst-sco/themes
создать новый подкаталог с названием темы.
Каталог темы может содержать:
- conf - подкаталог с настройками интерфейса,
- fonts - подкаталог с файлами шрифтов,
- style.qss - стили,
- theme.json - параметры темы оформления,
- подкаталоги с картинками, которые используются в теме.
По умолчанию тема оформления наследуется от default
. В новой теме можно изменить только нужную часть, все остальное автоматически берется из default
. Например, чтобы изменить только картинку заднего фона приложения, надо в новой теме добавить файл картинки widgets/background.png
.
theme.json
Файл theme.json
имеет следующую структуру:
{ "inherit": "<название наследуемой темы>", "<значение параметра deviceType>" : { "<группа параметров>": { "<параметр>": "<значение параметра>" } } }
inherit
- это тема, от которой наследуется текущая.Параметр опционален и по умолчанию равен default
.
Параметр deviceType
описан выше, тема оформления может хранить разные параметры для разных типов устройств.
Группы параметров используются для удобства.
Существующие параметры можно посмотреть в теме оформления default
.
Если значением параметра является путь до файла, то путь можно указывать с префиксом "./" , который автоматически заменяется на путь до темы.
Все значения параметров задаются в строковом виде, в двойных кавычках.
Рекомендуется проверять валидность файла при помощи редактора с поддержкой формата JSON, например VS Code, или в онлайн валидаторе.
Если формат файла будет неверным, тема не загрузится.
style.qss
Все текущие стили можно посмотреть, включив trace
уровень логирования для логгера Theme
.
[Logger.Theme] file = theme.log level = trace propagate =
Формат стилей задается в соответствии с документацией Qt.
При помощи комбинации клавиш Ctrl+W в лог ui.log выводится список всех отображаемых на данный момент элементов на форме.