Подписаться на блог
В Твиттере

Реплики и ссылки на заметки

В Фейсбуке

Ссылки на заметки

Вконтакте

Ссылки на заметки

В Телеграме

Ссылки на заметки

В Тумблере

Заметки целиком

В Же-же

Заметки целиком

По РСС

Заметки целиком

Если что-то из этого не работает, напишите мне: ilyabirman@ilyabirman.ru.

Проигрыватель: Sneak Peek

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

В Windows есть место, которое всегда пропадает понапрасну. Можно ругать Microsoft за это, а можно воспользоваться этим промахом для своих целей. Это, конечно, правый угол заголовка окна, развёрнутого на весь экран.

Место, которое мы займём
Масштаб 1:2

Обратите внимание, у окна довольно длинный заголовок, и это разрешение 1024×768. А я вот, например, работаю в 1920×1440. То есть, места дополна.

В Винампе использовался убогий шрифт, где все буквы были заглавными, а кириллицы не было вообще. Мы будем использовать шрифт, который в Windows выбран для использования в заголовках окон. В моём случае это Segoe UI, 9, Bold.

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

Как выглядит проигрыватель
Масштаб 2:3

Бегунок для «прокрутки» трека прижат к верхнему краю плейера, поэтому имеет виртуально бесконечную высоту, а значит, в него не надо целиться. Длина полоски бегунка равняется длине плейера. В винампе бегунок был чуть больше, однако он находился в середине окна, из-за чего я постоянно промахивался по нему. Кстати, он бессмысленно тратил место.

Ещё одна мелочь: в Винампе, помимо того, что можно было ткнуть на полоску бегунка, чтобы сразу прыгнуть в нужное место, за бегунок можно было ещё и «зацепиться», чтобы перетащить его куда-то и бросить. В реальной жизни вторая фича только мешала. Тыкаешь куда-то, потом тыкаешь на 5 пикселей левее, — ничего не происходит, а ты хотел сместиться на чуточку назад. А всё потому, что Винамп думает, что ты зацепился за бегунок, просто за другую его точку. У меня эта проблема отсутствует, так как Фубар не позволяет зацепиться за бегунок; бегунок просто следует за мышкой, когда левая кнопка нажата, оказываясь своим центром точно под курсором.

Прыгание по треку — единственная вещь, которую мышью делать удобнее, чем клавиатурой. Именно поэтому единственный элемент управления на плейере — бегунок. И всё же, мышью можно не только прыгать по треку. Можно делать и всё остальное. Но об управлении мышью — в следующей заметке.
Подписаться на блог
Поделиться
Отправить
4 комментария
Efreeti
А что за монитор у вас, если не секрет?
Илья Бирман
NEC-Mitsubishi Diamond Pro 2070 SB (22″)
gromit
Кстати, а можно заодно и ваш скин от оперы?
Илья Бирман
Opera Standard, вообще-то :-)
gromit
А как ее в белый цвет покрасить? И еще, никак не могу найти консоль от tagger’a в фубаре. Не подскажете где она спряталась? Или tagger идет отдельным плагином?
Илья Бирман
Я просто в меню расцветок добавил пункт:

Item, «White» = Set skin coloring, #FFFFFF

В Фубаре — по любому треку правой кнопкой, Tagging, Manage Scripts.
haruspex
А каким образом сделана такая панелька без заголовка, рамки и так далее? foo_title?
Илья Бирман
foo_gfx.

Пользовательский интерфейс
Доступен первый раздел
электронного учебника

Популярное
Эти ссылки принесут мне миллионы: ногтевой сервис киров