Columns UI — это один из самых популярных компонентов для плеера Foobar2000. Это такой конструктор, который можно крутить как угодно и он будет просить еще. В отличие от Default User Interface, Колумнс на порядок более гибок в настройке мелких деталей интерфейса. Плюс очень часто его наличие является необходимым для всякого рода скинов и прочих красивостей.
Про сам плагин немало написано на сайте и форуме Фубара, а скачать его можно тут. Устанавливается помещением файла foo_ui_columns.dll в папку Components Фубара. Здесь же речь пойдет о тонкостях настройки и конструирования интерфейса Foobar2000 через Columns UI.
Кастомизация Columns UI и странная логика разработчиков
Как и в Default User Interface, разбивка будущего интерфейса начинается с разделителей (Splitter). Тут-то и кроется странность. В Default UI вертикальный разделитель называется "Left/Right" и делит область интерфейса вертикальной линией на 2 части — левую и правую, что на мой взгляд соответствует человеческой логике. В Columns UI же такой разделитель внезапно называтся горизонтальным (Horizontal Splitter). Такая противоположная логика здесь видимо в том, что подразумевается разделение вдоль горизонтали на несколько вертикальных частей.
Соответственно за сплиттер, который в Default UI называется "Top/Bottom" (т.е. горизонтальная линия, разделяющая на верхнюю и нижнюю части) в Columns UI отвечает Vertical Splitter.
Теперь на примере. Допустим, нам нужен следующий вид интерфейса плеера, состоящий из 2-х основных колонок:
- в левой вся музыкальная библиотека или список плейлистов и обложка альбома
- в правой, собственно, выбранный список композиций для проигрывания и какая-нибудь визуализация для красоты
Все кнопки управления, ползунок громкости, дорожка и т.д. пусть будут сверху.
Приступим. Скриншотов будет много лишь для максимальной наглядности, фактически же ничего сложного.
После установки плагина и запуска Foobar встречает нас окошком с предложением выбора. Продолжить использовать Default User Interface или включить свежеинсталлированный Columns UI. Выбираем последний.
Расчистка элементов интерфейса готового шаблона под свой.
Тут же нам предложат выбрать один из нескольких готовых шаблонов интерфейса.
Но мы собрались креативить, поэтому выбираем любой, все равно сразу снесем его под корень (здесь звучит зловещий смех).
Идем в меню: View > Layout жмем Live Editing.
Правая кнопка мыши на любой элемент > Close.
Убираем так все элементы и сплиттеры, пока не останется только один горизонтальный или вертикальный сплиттер (его убрать нельзя). Для нашего шаблона нужен горизонтальный (так как делить будем на 2 основные колонки), поэтому если у вас остался вертикальный, то поменяйте его. Правая кнопка > Change Splitter > Horizontal Splitter.
Сборка желаемого интерфейса.
Основной разделитель есть. Займемся левой колонкой с обложкой, списком исполнителей или жанров библиотеки музыки и плейлистами. Для этого между ними должен быть разделитель. Добавим его: правая кнопка > Add Panel > Splitters > Vertical Splitter
Теперь добавляем поле для обложки диска. Жмем правой кнопкой мыши, в разделе Vertical Splitter выбираем Add Panel > Panels > Artwork View.
Обложка есть, остались фильтр жанров/исполнителей и плейлисты. Для пущей юзабилити сделаем их в разных вкладках. Для этого добавим вкладки. Правая мышь - раздел Vertial Splitter: Add Panel > Splitters > Tab Stack.
В первой вкладке будет фильтр музыкальной библиотеки. Тыц туда правой мышью, раздел Tab Stack: Add Panel > Panels > Filter.
Во второй вкладке будет список плейлистов. Также правой мышью, раздел Tab Stack: Add Panel > Panels > Playlist Switcher.
Левая колонка интерфейса готова, осталось сделать правую как задумывалось. Для этого справа тоже нужен разделитель, который поделит колонку на верхнюю и нижнюю части (сверху список воспроизведения, снизу визуализация). Кликаем где-нибудь в верхней части правой мышью, чтобы был доступен раздел Horizontal Splitter. В нем находим уже знакомый путь: Add Panel > Splitters > Vertical Splitter
Добавляем поле списка проигрываемых композиций. Правой мышью в правую часть. В разделе Vertical Splitter идем Add Panel > Playlists View > NG Playlist. Там сразу что-то отображается если до этого Фубар уже использовался и он знает где находится папка с музыкой.
Осталось добавить только панельку визуализации. По умолчанию в Columns UI есть только одна, ее и возьмем. Раздел Vertical Splitter, Add Panel > Visualisations > Spectrum Analyser.
Вот и все! Все основные элементы добавлены. Пока выглядит слишком симметрично и непропорционально, поэтому стоит отрегулировать по своему вкусу размеры элементов, таская их мышью за границы. Можно, кстати, уже включить музыку. У меня получилось примерно так:
Оптимизация рабочей области интерфейса.
Настало время убрать лишнее и оптимизировать рабочее пространство. Закинем кнопки и другие элементы управления на самый верх, чтобы освободить больше места под все остальное. Делается это также элементарно, тянем левой кнопкой мыши за границу элемента.
Зачем нам 2 одинаковых визуализации? Уберем ее из тулбара: правой мышкой по верхней панели: Visualisations > Spectrum Analyser.
Повыбрасываем лишние кнопки управления или добавим нужные. Правая кнопка по тулбару: Buttons Options.
С тулбаром закончили, можно отрегулировать размеры по вкусу и зафиксировать положение: Lock the Toolbars.
Избавимся от названий элементов (Vertical Splitter, Artwork View, Tab Stack и т.д.), вряд ли они будут вам нужны, только занимают полезное пространство. Правой кнопкой мыши на них, затем снять галку Show Caption.
Исключим или добавим колонки в Playlist View, а заодно отрегулируем их ширину. Идем в настройки File > Prefences (или Ctrl+P). Слева переходим в Display > Columns UI > Playlist View вкладка Columns.
Убираем ненужные (правая кнопка по названию > Remove), если надо отрегулировать ширину, то она указывается в поле Width. По умолчанию ширина всех колонок выставляется пропорционально.
Как видите, у Columns UI миллиард различных настроек, кастомизируется чуть ли не каждый пиксель. Но и без того уже все выглядит неплохо.
Почти закончили, осталась пара мелких штрихов. Можно, к примеру, убрать небольшие внутренние тени элементов. Для списка воспроизведения это отключается в настройках. Display > Columns UI > Playlist View вкладка General. У строки Playlist Edge Style выбираем None.
Для фильтра жанра/исполнителей это отключается в Display > Columns UI вкладка Filter. У строки Edge Style также выбираем None.
Чтобы убрать тенюшку у визуализации кликаем прям на нее правой кнопкой и переходим в опции.
Window Frame Style > None. Здесь же сразу можно настроить цвета и стиль самой визуализации.
Так плеер принял более минималистичный и спокойный вид. Кому нужно еще больше минимализма можно убрать статус-панель внизу, инфа в ней не настолько уж и ценная. В настройках Display > Columns UI вкладка Status Bar снять галку Show status pane
Вместе с ней пропал и ползунок регулирования громкости. Не беда - добавим его в тулбар, где ему и место. Правой кнопкой по тулбару Toolbars > Volume.
Готово! Интерфейс плеера настроен как и замышлялось. Ах да, заблокируем панель визуализации, чтобы при изменении размеров окна Foobar2000 она оставалась одинаковой. Правильно, правой мышкой по ней и Lock panel
Та-дам!
Это был лишь один из примеров. Foobar2000 — это конструктор, где можно поменять местами, изменить и дополнить почти все. Прогуляйтесь по настройкам, потыкайте, поиграйте цветами и шрифтами. Можете сделать темную тему, например. Не бойтесь что-то сломать, всегда можно быстро удалить лишнее или вернуть удаленное. Enjoy your cake!
