Автор:© Кныжов Дмитрий
E-mail:kdplayer@yandex.ru
Данная статья описывает процесс создания скинов для приложения KD Player, начиная с версии 0.8.1
Общая информация:
Скин для KD Player состоит из двух файлов с одинаковым именем, но с разными расширениями. После создания этих файлов, Вы можете поместить их в архив приложения в папку «/skin/», причем имена файлов должны быть «default.kds» и «default.kdi» - это обязательно. Также их можно просто скопировать в память телефона, в этом случае пользователь сам выбирает скин через файловый менеджер в проигрывателе.Итак, состав скина:
- Первый файл – файл с расширением *.kds. Это обычный текстовый файл в кодировке ANSI. Он обязательно должен начинаться с зарезервированного слова «kdskin». Это слово частично уведомляем приложение о том, что перед ним именно файл скина. Здесь хранится текстовая информация о расположении графических элементов проигрывателя, а также цветовая схема меню. Все параметры представлены виде тегов, которые имеют следующий вид: <имя_тега параметры_тега>. Далее будет дано подробное описание каждого тега.
- Второй файл – файл с расширением *.kdi. Это графический файл, он может быть любого графического формата, который понимает телефон, для которого Вы делаете скин. Практически все устройства понимают формат PNG и JPEG, также некоторые понимают формат GIF и BMP. Рекомендуется, конечно же, формат PNG, т.к. он обеспечивает хорошее сжатие картинки и к тому же без потерь. Этот формат также поддерживает полупрозрачность, но нужно учитывать, что при прорисовке элементов меню с полупрозрачностью телефон затрачивает гораздо больше ресурсов и памяти, к тому же, насколько мне известно, только телефоны Sony Ericsson полноценно поддерживают полупрозрачность, остальные могут не поддерживать, либо поддерживать частично. (По состоянию на 2007 год. - Прим. Владельца Сайта).
Описание тегов и их параметров:
Основное:Типы шрифтов:
- 0 - Мелкий жирный
- 1 - Мелкий обычный
- 2 - Средний жирный
- 3 - Средний обычный
- 4 - Большой жирный
- 5 - Большой обычный
- R - количество красного цвета
- G - количество зелёного цвета
- B - количество синего цвета
- Может иметь следующие значения:
- T – обычное начало координат, которое начинается в левом, верхнем углу дисплея телефона.
- B – начало координат начинается в левом, нижнем углу дисплея телефона.
- Может иметь следующие значения:
- L – выравнивание по левому краю.
- C – выравнивание по центру.
- R – выравнивание по правому краю.
Типы заполнения:
Может принимать следующие значения и виды (указан пример):
0 - | 1 - | 2 - | 3 - |
Обозначения:
P1,P2,P3...Pn – параметры тега, их количество
R,G,B – задание цвета в RGB
X1, Y1, X2,Y2 – указывают по каким координатам вырезать нужное изображение.
Рисунки:
Риc. 1 | Риc. 2 | Риc. 3 |
Теги в файле KDS и их назначение:
ТЕГ <rot P1>Этот тег отвечает за ориентацию экрана в скине. Имеет только один параметр.
Значения P1:
true – горизонтальная ориентация
false – обычная, вертикальная ориентация
ТЕГ <border R,G,B>
Этот тег указывает, какого цвета рисовать рамку в окне плеера. Цвет задается через RGB. Если первый параметр, т.е. параметр R равен -1, то рамка не рисуется.
На рис.1 эта рамка зеленого цвета.
ТЕГ <bkgnd1 X1,Y1,X2,Y2>
Этот тег указывает, какое изображение рисовать на фоне в окне проигрывателя, если изображение меньше размера дисплея телефона, то оставшееся место зарисовывается повторно.
ТЕГ <bkgnd2 X1,Y1,X2,Y2>
Этот тег указывает, какое изображение рисовать на фоне в окне главного меню, если изображение меньше размера дисплея телефона, то оставшееся место зарисовывается повторно.
ТЕГИ <menu_top_l X1,Y1,X2,Y2> <menu_top_c X1,Y1,X2,Y2> <menu_top_r X1,Y1,X2,Y2>
Эти теги указывают на изображения, которые формируют заголовок окна главного меню. Изображение, заданное в menu_top_c растягивается на всю ширину экрана.
На рис.2 обведено зеленым.
ТЕГИ <menu_bot_l X1,Y1,X2,Y2> <menu_bot_c X1,Y1,X2,Y2> <menu_bot_r X1,Y1,X2,Y2>
Эти теги указывают на изображения, которые формируют нижнюю часть окна главного меню. Изображение, заданное в menu_bot_c растягивается на всю ширину экрана.
На рис.2 обведено черным.
ТЕГИ <menu_sel_l X1,Y1,X2,Y2> <menu_sel_c X1,Y1,X2,Y2> <menu_sel_r X1,Y1,X2,Y2>
Эти теги указывают на изображения, которые формируют изображение выделенного пункта главного меню. Изображение, заданное в menu_sel_c растягивается на всю ширину экрана.
На рис.2 обведено голубым.
ТЕГ <menu_text_font P1,R1,G1,B1,R2,G2,B2>
Этот тег указывает шрифт главного меню, его цвет, а также цвет выделенного текста.
Параметры:
P1 – тип шрифта главного меню (см. выше)
R1,G1,B1 – цвет текста меню, цвет полосы прокрутки, цвет обычного текста (к примеру в окне «О программе…»), цвет сообщения «добавлено».
R2,G2,B2 – цвет выделенного текста в главном меню.
ТЕГ <menu_caption R,G,B>
Этот тег указывает цвет текста заголовка в главном меню.
ТЕГ <menu_time R,G,B>
Этот тег указывает цвет текста часов в главном меню.
ТЕГ <menu_msg_bkgnd R,G,B>
Этот тег указывает цвет фона сообщения в главном меню (например, сообщение «Добавлено…», при добавлении файлов).
ТЕГ <soft_text1 R,G,B>
Этот тег указывает цвет фона софт меню, на рис.3 он указан серым.
ТЕГ <soft_text2 R,G,B>
Этот тег указывает цвет фона выделенного пункта софт меню, на рис.3 он указан красным.
ТЕГ <soft_text3 R,G,B>
Этот тег указывает цвет основного текста софт меню, на рис.3 он указан белым.
ТЕГ <soft_sel_text4 R,G,B>
Этот тег указывает цвет текста выделенного пункта софт меню, на рис.3 он указан голубым.
ТЕГ <soft_border1 R,G,B>
Этот тег указывает цвет рамки софт меню, на рис.3 он указан розовым.
ТЕГ <soft_border2 R,G,B>
Этот тег указывает цвет рамки выделенного пункта софт меню, на рис.3 он указан черным.
ТЕГ <soft_player P1>
Этот тег указывает высоту открытия софт меню в режиме проигрывателя. Начало видеться от нижней кромки дисплея.
Параметр P1 – это число-высота.
ТЕГ <title X1,Y1,X2,Y2>
Задает изображение, которое будет рисоваться на фоне. В стандартном скине этим изображением является надпись «KD Player».
ТЕГ <title_pos P1,P2,P3,P4>
Этот тег задает положение изображения заданного в теге title.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
ТЕГ <albumart X1,Y1,X2,Y2>
Задает изображение обложки альбома (Album art), которое будет изображено по умолчанию. Размер обложки, которую удастся загрузить из файла будет равен размеру этого изображения.
ТЕГ <albumart_pos P1,P2,P3,P4>
Этот тег задает положение изображения обложки альбома заданного в теге albumart.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
ТЕГ <back1 X1,Y1,X2,Y2>
Задает изображение не нажатой кнопки «Назад».
ТЕГ <back2 X1,Y1,X2,Y2>
Задает изображение нажатой кнопки «Назад».
ТЕГ <back_pos P1,P2,P3,P4>
Этот тег задает положение изображения кнопки «Назад» заданного в теге back1 и back2.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
ТЕГ <play1 X1,Y1,X2,Y2>
Задает изображение не нажатой кнопки «Воспроизведение/Пауза».
ТЕГ <play2 X1,Y1,X2,Y2>
Задает изображение нажатой кнопки «Воспроизведение/Пауза».
ТЕГ <play_pos P1,P2,P3,P4>
Этот тег задает положение изображения кнопки «Воспроизведение/Пауза» заданного в теге play1 и play2.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
ТЕГ <next1 X1,Y1,X2,Y2>
Задает изображение не нажатой кнопки «Вперед».
ТЕГ <next2 X1,Y1,X2,Y2>
Задает изображение нажатой кнопки «Вперед».
ТЕГ <next_pos P1,P2,P3,P4>
Этот тег задает положение изображения кнопки «Вперед» заданного в теге next1 и next2.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
ТЕГ <sound1 X1,Y1,X2,Y2>
Задает изображение уровня громкости, когда он равен 0.
ТЕГ <sound2 X1,Y1,X2,Y2>
Задает изображение уровня громкости, когда он равен максимуму.
ТЕГ <sound_pos P1,P2,P3,P4,P5,P6>
Этот тег указывает расположение регулятора громкости и его тип.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает начальную позицию отображения. (Например, кружок в полосе прокрутки, можно задать его размер, чтоб он был виден, а не выезжал сбоку)
P6 – Задает тип заполнения (см. выше)
ТЕГ <repeat X1,Y1,X2,Y2>
Задает изображение для спрайта «Режима повтора».
ТЕГ <repeat_pos P1,P2,P3,P4>
Этот тег задает положение изображения «Режима повтора» заданного в теге repeat.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
ТЕГ <shuff X1,Y1,X2,Y2>
Задает изображение для спрайта «Режима перемешивания».
ТЕГ <shuff_pos P1,P2,P3,P4>
Этот тег задает положение изображения «Режима перемешивания» заданного в теге shuff.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
ТЕГ <key X1,Y1,X2,Y2>
Задает изображение индикатора блокировки клавиатуры.
ТЕГ <key_pos P1,P2,P3,P4>
Этот тег задает положение индикатора блокировки клавиатуры заданного в теге key.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
ТЕГ <wait X1,Y1,X2,Y2>
Задает изображение значка «Подождите». Например, при навигации по меню или обновлении музыкальной библиотеки.
ТЕГ <bar X1,Y1,X2,Y2>
Задает изображение, которое будет рисоваться на фоне. В стандартном скине этим изображением является полоска над надписями софт клавиш – Меню, Стоп, Воспр.
ТЕГ <bar_pos P1,P2,P3,P4>
Этот тег задает положение изображения заданного в теге bar.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
ТЕГ <posbar1 X1,Y1,X2,Y2>
Задает изображение пустой полосы прокрутки в самом начале воспроизведения.
ТЕГ <posbar2 X1,Y1,X2,Y2>
Задает изображение заполненной полосы прокрутки в конце воспроизведения.
ТЕГ <posbar_pos P1,P2,P3,P4,P5,P6>
Этот тег указывает расположение полосы прокрутки и её тип.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает начальную позицию отображения. (Например, кружок в полосе прокрутки, можно задать его размер, чтоб он был виден, а не выезжал сбоку)
P6 – Задает тип заполнения (см. выше)
ТЕГ <softL_font P1,R,G,B>
Этот тег указывает шрифт и цвет текста для левой софт клавиши.
Параметры:
P1 – Тип шрифта (см. выше)
R,G,B – Цвет текста
ТЕГ <softC_font P1,R,G,B>
Этот тег указывает шрифт и цвет текста для «серединной» софт клавиши.
Параметры:
P1 – Тип шрифта (см. выше)
R,G,B – Цвет текста
ТЕГ <softR_font P1,R,G,B>
Этот тег указывает шрифт и цвет текста для правой софт клавиши.
Параметры:
P1 – Тип шрифта (см. выше)
R,G,B – Цвет текста
ТЕГ <stop_text P1,P2,P3,P4,P5>
Этот тег задает положение надписи «Стоп» в окне проигрывателя.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает максимальную ширину надписи в точках, если текст не умещается, он урезается с «…» в конце.
ТЕГ <play_text P1,P2,P3,P4,P5>
Этот тег задает положение надписи «Воспр.» в окне проигрывателя.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает максимальную ширину надписи в точках, если текст не умещается, он урезается с «…» в конце.
ТЕГ <menu_text P1,P2,P3,P4,P5>
Этот тег задает положение надписи «Меню» в окне проигрывателя.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает максимальную ширину надписи в точках, если текст не умещается, он урезается с «…» в конце.
ТЕГ <artist_text P1,P2,P3,P4,P5>
Этот тег задает положение надписи «Исполнитель» в окне проигрывателя.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает максимальную ширину надписи в точках, если текст не умещается, он урезается с «…» в конце.
ТЕГ <artist_font P1,R,G,B>
Этот тег указывает шрифт и цвет текста для надписи «Исполнитель».
Параметры:
P1 – Тип шрифта (см. выше)
R,G,B – Цвет текста
ТЕГ <title_text P1,P2,P3,P4,P5>
Этот тег задает положение надписи «Название дорожки» в окне проигрывателя.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает максимальную ширину надписи в точках, если текст не умещается, он урезается с «…» в конце.
ТЕГ <title_font P1,R,G,B>
Этот тег указывает шрифт и цвет текста для надписи «Название дорожки».
Параметры:
P1 – Тип шрифта (см. выше)
R,G,B – Цвет текста
ТЕГ <album_text P1,P2,P3,P4,P5>
Этот тег задает положение надписи «Название альбома» в окне проигрывателя.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает максимальную ширину надписи в точках, если текст не умещается, он урезается с «…» в конце.
ТЕГ <album_font P1,R,G,B>
Этот тег указывает шрифт и цвет текста для надписи «Название альбома».
Параметры:
P1 – Тип шрифта (см. выше)
R,G,B – Цвет текста
ТЕГ <file_text P1,P2,P3,P4,P5>
Этот тег задает положение надписи «Имя файла» в окне проигрывателя. Отображается при отсутствии тегов в текущей дорожке.
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает максимальную ширину надписи в точках, если текст не умещается, он урезается с «…» в конце.
ТЕГ <file_font P1,R,G,B>
Этот тег указывает шрифт и цвет текста для надписи «Имя файла». Отображается при отсутствии тегов в текущей дорожке.
Параметры:
P1 – Тип шрифта (см. выше)
R,G,B – Цвет текста
ТЕГ <index_text P1,P2,P3,P4,P5>
Этот тег задает положение надписи «Номер текущей дорожки» в окне проигрывателя (например: 21/145).
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает максимальную ширину надписи в точках, если текст не умещается, он урезается с «…» в конце.
ТЕГ <index_font P1,R,G,B>
Этот тег указывает шрифт и цвет текста для надписи «Номер текущей дорожки» в окне проигрывателя (например: 21/145).
Параметры:
P1 – Тип шрифта (см. выше)
R,G,B – Цвет текста
ТЕГ <mediatime_text P1,P2,P3,P4,P5>
Этот тег задает положение надписи «Текущее время воспроизведения» в окне проигрывателя (например: 03:55).
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает максимальную ширину надписи в точках, если текст не умещается, он урезается с «…» в конце.
ТЕГ <mediatime_font P1,R,G,B>
Этот тег указывает шрифт и цвет текста для надписи «Текущее время воспроизведения» в окне проигрывателя (например: 03:55).
Параметры:
P1 – Тип шрифта (см. выше)
R,G,B – Цвет текста
ТЕГ <duration_text P1,P2,P3,P4,P5>
Этот тег задает положение надписи «Общее время воспроизведения» и «Оставшееся время воспроизведения» в окне проигрывателя (например: -01:02).
Параметры:
P1 – Начало координат (см. выше)
P2 – Выравнивание элемента (см. выше)
P3 – Задает смещение элемента после выравнивания по оси X
P4 – Задает смещение элемента после выравнивания по оси Y
P5 – Задает максимальную ширину надписи в точках, если текст не умещается, он урезается с «…» в конце.
ТЕГ <duration_font P1,R,G,B>
Этот тег указывает шрифт и цвет текста для надписи «Общее время воспроизведения» и «Оставшееся время воспроизведения» в окне проигрывателя (например: -01:02).
Параметры:
P1 – Тип шрифта (см. выше)
R,G,B – Цвет текста
Удачного создания скинов для приложения KD Player.
С Уважением, Кныжов Дмитрий и Борисов Сергей.
С Уважением, Кныжов Дмитрий и Борисов Сергей.