К основному контенту

Настройка визуальных стилей в CodeLobster IDE

Всем известно о таком, просто магическом воздействии цветов на человека. Цвета могут расслаблять и успокаивать, а могут и наоборот - возбуждать и стимулировать мысль, как кофе. Давайте в этой статье рассмотрим ключевые инструменты CodeLobster IDE, которые обеспечивают настройку цветовых схем и индивидуальных визуальных стилей для программы.

Прочитав статью, вы узнаете, как можно так настроить пользовательский интерфейс своей IDE, чтобы работать с удовольствием и на протяжении длительного времени сохранять исключительную ясность мышления и высочайшую работоспособность.

Содержание статьи: Настройка визуальных стилей в CodeLobster IDE 1. Цветовые схемы в CodeLobster IDE 2. Визуальные стили в CodeLobster IDE 3. Редактирование визуальных стилей в CodeLobster IDE Выводы Настройка визуальных стилей в CodeLobster IDE

1. Цветовые схемы в CodeLobster IDE

Задача цветовых схем - обеспечить лёгкое визуальное восприятие кода. Подобрав идеальную цветовую схему для себя, вы сможете мгновенно дифференцировать служебные слова и выражения, переменные, имена функций и классов. Большое значение также имеет возможность идентификации и выделения блоков кода, парных скобок, кавычек, открывающих и закрывающих тегов.

IDE позаботится об удобной работе с HTML и XML файлами, а так же со вложенными циклами и строками в PHP и JavaScript, подсвечивая все ключевые элементы кода в соответствии с настройками текущей цветовой схемы. В CodeLobster всего имеется 28 замечательных цветовых схем. Среди них есть насыщенные и красочные схемы, портированные из популярных редакторов - Atom, Brackets, Notepad++, PSPad и Sublime. Для тех, кто имеет опыт работы с другими современными средами для программирования, будет приятно включить для себя подсветку кода в стиле Aptana, Dreamweaver, Komodo, NetBeans, PHPStorm, RapidPHP или Eclipse.

2. Визуальные стили в CodeLobster IDE

Визуальные стили отвечают за отрисовку всего пользовательского интерфейса в масштабах программы. Здесь речь идёт о меню, графических элементах и о виджетах, таких как вкладки, кнопки, чекбоксы, списки и комбобоксы. Каждый визуальный стиль представляет собой уникальный внешний вид для приложения в целом и идёт в комплекте с полным набором иконок, максимально гармонично сочетающихся с данным стилем.

В то время, как к каждому стилю прикреплена своя цветовая схема редактора, вы можете свободно изменить настройки и выбрать любое сочетание визуальных стилей и цветовых схем. CodeLobster поставляется с предустановленными стилями, всего есть 8 тем для программы: "AtomOneDark" и "AtomOneLight" - это тёмная и светлая темы оформления, портированные из популярного редактора Atom. "Codelobster Dark" и "Codelobster Light" - родные стили для "Modern Dark" и "Modern Light" - пара современных тем оформления, разработанных с использованием принципов Material design. "Storm" и "Sublime" - это два тёмных стиля, портированы из одноимённых редакторов.

Для выбора стиля переходим в главное меню "View" -> "Visual Style".



Изменения применяются моментально и вы сразу же можете испытать, насколько этот стиль вам подходит.

3. Редактирование визуальных стилей в CodeLobster IDE

Отображение практически любого элемента UI можно изменить с помощью CSS. Эта возможность предоставляется благодаря новым технологиям, используемым при создании CodeLobster, в частности системе Qt. Теперь настраивать пользовательский интерфейс могут как разработчики программы, так и сами пользователи IDE.

Чтобы приступить к настройке визуальных стилей, переходим в главное меню "Tools" -> "Preferences" и в разделе "IDE" открываем пункт "Visual styles".



Выбираем нужный стиль из списка и дублируем его, для этого нужно нажать кнопку "Edit" и дать своему индивидуальному стилю новое имя. После чего ваш стиль будет установлен по умолчанию и все необходимые ресурсы будут скопированы в директорию "userstyles".

Например, если вы назвали стиль "NewCodelobsterLight", то путь к папке будет такой:

[user dir]/.local/share/CodeLobsterIDE/userstyles

Этот каталог имеет следующую структуру: icons - папка с иконками. img - здесь находятся дополнительные изображения. qss - в этом файле содержатся стили для виджетов.

Чтобы изменить свою тему, откройте для редактирования файл "style.qss", все правила в нём прописаны в формате таблиц стилей Qt (Qt Style Sheets). Синтаксис практически полностью идентичный CSS, но имеет некоторые модификации для более удобной работы с виджетами.

Не обязательно знать названия всех элементов наизусть, достаточно просто ввести первую букву "Q" и нажать Ctrl + Space.



Таким образом, вы получите подсказку по всем доступным селекторам, используемым при создании стилей Qt и сможете выбрать нужный виджет из списка. С простыми виджетами, например, такими как кнопки, работать очень просто. В соответствии с документацией Qt, чтобы применить собственные правила для всех кнопок в программе, нужно использовать селектор QPushButton.

Идентифицировать состояние кнопки помогут псевдо-селекторы, например, :hover - при наведении указателя мыши на кнопку или :pressed - когда кнопка в нажатом состоянии. Проведём эксперимент и заменим фон кнопки при наведении указателя - вместо плоской заливки назначим градиент. Отыщем в файле "style.qss" следующее выражение:

QPushButton:hover { color: black; background-color: #b3bad0; }

Устанавливаем новое значение для свойства "background-color" с помощью инструкции QLinearGradient(). Новый код будет выглядеть так:

QPushButton:hover { color: black; background-color: QLinearGradient( x1: 0, y1: 0, x2: 0, y2:1, stop: 0 #ffffff, stop: 1 #c4cce3); }

Сохраняем файл, жмём Ctrl + S. После внесения правок нам нужно обновить стиль, для этого выбираем в главном меню "View" -> "Visual Style" -> "Refresh current style" или используем сочетание клавиш Ctrl + Alt + R.

Чтобы проверить результат, откройте любой диалог, например, мастер создания нового проекта, теперь все кнопки будут иметь градиент при наведении мыши.



Выводы

Среда программирования CodeLobster IDE имеет такой пользовательский интерфейс, который помогает сосредоточиться, а не отвлекает. Возможность гибко настраивать цветовые схемы и стили понравится тем разработчикам, которые хотели бы писать код в привлекательной и красивой IDE. Вы сможете создавать свои приложения и одновременно получать эстетическое удовольствие.

Мы уверены, что качественные цветовые схемы и индивидуальные визуальные стили помогут продуктивно работать и даже вдохновят вас на новые идеи.

Комментарии


Дистанционная компьтерная помощь, удаленная компьютерная помощь онлайн.

Популярные сообщения из этого блога

Лучшие плагины для OBS Studio

Open Broadcast Software или OBS - это свободное программное обеспечение с открытым исходным кодом для стриминга аудио и видео данных в сеть интернет. Программа полностью кроссплатформенная и может работать в Windows, Linux или MacOS. Это отличная альтернатива для таких программ, как Wirecast и XSplit. OBS использует для вещания стандартный протокол обмена сообщениями в реальном времени, а поэтому может транслировать данные в любой сервис, поддерживающий это, например, Yotube. Несмотря на широкие возможности OBS, программа поддерживает еще и множество плагинов. В этой статье мы рассмотрим лучшие плагины для OBS Studio, которые вы можете использовать. Содержание статьи: Лучшие плагины OBS Studio 1. Browser Source Plugin 2. Video Source Plugin 3. Simple Scene Switcher 4. DirectShow Audio Source 5. CLR Browser Source 6. OBS Remote 7. AMD Advanced Media Framework Encoder 8. Text Source Plugin Выводы Лучшие плагины OBS Studio Чтобы найти плагины OBS Studio для Video пользователям пр…

Лучшие аналоги Paint для Linux

Когда я работал в Windows, я часто использовал стандартную программу редактора изображений Windows - Paint. Не всегда нужен очень и многофункциональный инструмент вроде Photoshop или Gimp. Иногда, чтобы подправить ту или иную картинку, дорисовать на ней несколько фигур или вставить текст достаточно простого, легкого в освоении графического редактора вроде Paint. В Linux таких программ довольно много. В этой инструкции мы рассмотрим лучшие аналоги Paint для Linux. В этот список не будут включены такие программы, как Gimp и Krita, ведь это полнофункциональные графические редакторы, векторные редакторы, такие как Inkscape мы тоже рассматривать не будем. А теперь перейдем к списку. Содержание статьи: KolourPaint MyPaint Gnome Paint XPaint Pinta mtPaint GPaint Rassam-paint Выводы KolourPaint На первом месте в списке аналогов Piant для Linux будет KoloutPaint. Это стандартный графический редактор для окружения рабочего стола KDE. Он поддерживает множество форматов изображений PNG, J…