Введение
Наверное, во мне умер один дизайнер, но меня хлебом не корми, дай с цветами поиграться. Я давно еще нашел набор цветов темы Solarized для конфигуратора, настроил себе и был счастлив. Но потом, когда начал работать в Android Studio из семейства IDEA, я увидел, сколько бывает разных цветов схем, нашел сайты, посвященные им, и пропал надолго. Вот бы такое в конфигураторе, подумал я, и взялся за разработку.
Хорошо подобранная цветовая схема делает код более читаемым, приятным глазу. После такой схемы стандартная навевает тоску. Да и вообще, необычное оформление может преобразить код до неузнаваемости:
Далее я опишу функционал разработки, но можно сначала вместо 1000 слов посмотреть видео, в котором я кратко показываю и комментирую обработку в деле.
Описание функционала
Данная обработка никак не зависит от конфигурации, запускайте хоть в пустой базе, единственное, для полного функционала необходимы платформа и режим совместимости не ниже 8.3.6. Ну и наличие Интернета для режима работы онлайн.
Рассмотрим основное окно обработки:
В заголовке формы пишется название текущей цветовой схемы (1). При открытии будут выбраны схемы, которые сейчас установлены в Конфигураторе и EDT, и в заголовке будет указано <Default>.
Слева располагается три типа источников (2), при открытии выбрано расположение Локально. В данном случае в списке (4) появятся все подходящие файлы цветовых схем (с расширениями csi, jar, icls, xml, tmtheme), которые вы скачаете из Интернета (ссылки в конце статьи) и положите в папку (3).
Жирным выделены файлы *.csi, специального формата именно для этой обработки, которые создаются через кнопку (10). Используя эти файлы, вы можете сохранять в избранное понравившееся вам схемы, отредактированные вами схемы, переносить раскраску на другой компьютер, может, даже делиться с кем-то схемой.
Обработка предназначена как для конфигуратора, так и для EDT, поэтому правая часть экрана, относящаяся к конкретным IDE, переключается вкладками (5). Для каждой области используется свой функционал, за исключением кнопки (10), она сохраняет настройки сразу по обеим IDE.
При смене текущей строки в списке (4), тут же меняется пример кода на русском и английском в поле (6) и используемая палитра (7). В примере кода использованы, по возможности, все варианты лексем, чтобы можно было увидеть полную палитру цветов.
При клике на части кода в (6) можно спозиционироваться на соответствующем цвете в (7) и поменять его, если текущий вариант вас не устраивает. Можно задать цвет RGB вручную или выбрать один из веб-цветов. А можно вообще психануть и поменять все цвета на противоположные через кнопку (8).
При считывании цветовой схемы происходит сопоставление тегов загружаемого редактора и 1С. Не всегда в файле есть все необходимые цвета, поэтому некоторые могут быть подобраны обработкой автоматически. В таком случае название цвета в палитре (7) помечается красным цветов. Это как сигнал о том, что, возможно, данный цвет нужно подправить.
Вообще, сделать сопоставление тегов совершенно разных лексических систем, было отдельной задачей натягивания совы на глобус. Поэтому я где-то мог ошибиться, и вы можете подправить этот мэппинг, который хранится в формате JSON в макетах обработки.
После того, как вы выбрали и, может, подправили схему, ее можно загружать в Конфигуратор с помощью кнопки (9). После нажатия вам надо будет в качестве подтверждения выбрать файл настроек 1cv8.pfl. Он у вас будет отображаться один среди папок. Есть небольшая вероятность, что у вас настройки берутся из предыдущей версии 1С, и в открывшейся папке файла не будет. Тогда следует посмотреть файл в рядом лежащей папке 1Cv81 или 1Cv82. После записи нужно просто перезапустить Конфигуратор, и вы увидите код в новой цветовой схеме.
При первом запуске обработки, у вас, конечно, список (4) будет пуст, но можно даже ничего не качать, для этого есть еще две вкладки (2).
На этих вкладках идет подключение к сайтам (4) с цветовыми схемами для IDEA и Sublime, и динамическое получение списка схем по API. В списке (3) появляется оформление строк, так можно сразу понять, это будет светлая или темная схема.
В верху списка находятся кнопки сортировки (1). Можно отсортировать список по названию, по "светлости" и по популярности (количестве загрузок). Также можно искать схему по названию.
По умолчанию идет сортировка по популярности и выбирается TOP-100 схем (2). Вы можете изменить это число, всего на сайте сейчас представлено более 600 схем, однако при большом числе выборки будет более долгая загрузка.
Для сайта по Sublime все тоже самое, только произойдет загрузка сразу всех 600 - 700 схем, и не будет сортировки по популярности. Если сравнивать эти вкладки, то, вроде, удобней работать с IDEA, т.к. тут показываются сразу популярные схемы. Для Sublime же поиск будет сложнее, некоторые позиции даже не будут открываться, из-за удаленного репозитория или схемы неверного формата, однако там встречаются "жемчужины", которые идеально ложатся на 1С, особенно, EDT.
В правой части можно увидеть вариант для EDT. Здесь уже другой пример кода (5) и палитра (6), на которой столько цветов, что они не поместились в одном списке. И это не полный список, особо редкие случаи я еще не покрыл, думаю, добавлю их в следующих версиях.
Чтобы считывалась текущая цветовая схема, и можно было загружать новые, необходимо указать путь к рабочей области (Workspace) EDT (7). Дальше можно сохранять настройки (8). Вас попросят подтвердить перезапись двух файлов, но перед этим нужно будет закрыть саму EDT.
Новое в версии 1.2.1
В этом году, к сожалению, перестал работать онлайн-сервис с цветовыми схемами для IDEA. Однако, к счастью, автор сохранил все данные сервиса в открытом репозитории на GitHub. Я перенес необходимые файлы в обработку, подменил обращение к сервису. Поэтому обработка "распухла", стала занимать больше места на диске, зато работа со схемами IDEA может происходить в локальном режиме.
Также в новой версии было исправлено несколько небольших ошибок.
Новое в версии 1.1.2
В этой версии не появилось какого-то совершенно нового функционала, однако сделано несколько небольших исправлений и доработок:
- Теперь обработка должна корректно работать на всех версиях плаформы и режима совместимости начиная с 8.3.6.
- Теперь текущие цветовые схемы, установленные в вашей системе, и цветовые схемы сред по умолчанию выделены в отдельные пункты списка <Current> и <Default>, поэтому с ними можно сравнивать новые схемы, либо возвращаться к ним.
- Добавлена возможность быстрого изменения яркости конкретного цвета с помощью кнопок регулирования.
- Исправления в цветовом оформлении некоторых лексем на предпросмотре кода.
- Добавлена форма с полезными ссылками.
- Исправления других мелких недочетов.
Что дальше?
Надеюсь, это решение пригодится разработчикам, и вы сами предложите варианты развития обработки. Однако, что я вижу сейчас, это возможность играться не только с цветами, но и со шрифтами. В Конфигураторе можно выбрать шрифт только для всего кода, а в EDT можно настраивать стиль написания для каждой лексемы отдельно. Например, ключевые слова жирным, директивы - курсивом. Это также повышает визуальную составляющую кода. И хорошо, что в цветовых схемах, что я подключил, есть описание таких настроек, так что нужно будет добавить эти настройки и их загрузку из источников.
Благодарности
Конечно, моя разработка не является чем-то совсем уникальным и не родилась на пустом месте. Поэтому я хотел бы поблагодарить:
- Автора с ником Ramz и его Визуальный редактор цветовых схем. У него я подсмотрел как можно распарсить файл настроек Конфигуратора и как оформить предпросмотр кода.
- Никиту Грызлова и его разработку Подсветка синтаксиса 1С в текстовых редакторах. Благодаря плагину для Sublime, я увидел, как круто может выглядеть код 1С, когда его хорошенечко покрасишь, и окончательно загорелся своей разработкой.
- Nakonechniy Dmitry, который разместил публикацию Приятная глазу цветовая схема, а именно Solarized. Здесь я впервые понял, что код в 1С можно раскрасить по-другому, и это будет круто.
Ссылки
Адреса сайтов, на которых можно скачать цветовые схемы для IDEA и Sublime, т.е. подходящие для этой обработки:
- http://color-themes.com - схемы для IDEA. Именно этот сайт используется для загрузки.
- https://tmtheme-editor.herokuapp.com - схемы для Sublime. Представляет собой не просто сайт для скачивания, но и встроенный редактор, так что моя обработка чем-то повторяет его.
- https://plugins.jetbrains.com/contest/intellij-themes/2019 - победители конкурса тем для IDEA за 2019 год.
- https://blog.codota.com/5-best-intellij-themes/ - ТОП-5 тем для IDEA. Отсюда я и взял картинки.
- https://w3bits.com/sublime-text-themes/ - еще ТОП тем, теперь для Sublime.
- https://github.com/KonstantinHeinrich/Color-Schemes-Installer-Designer-Format - репозиторий в формате Конфигуратора
- https://github.com/KonstantinHeinrich/Color-Schemes-Installer-EDT-Format - репозиторий в формате EDT
