Logo

NEWS
DOWNLOADS
EASTER EGGS
FORUM
ARTICLES

Versions KD Player

• FAQ
• История
• RU Versions
• EN Versions
• Other Languages
• Test Versions

Раздел Скинов

• Создание Скинов
• Скины (Skins)
Дата:        31.08.07
Автор:      © Кныжов Дмитрий
E-mail:      kdplayer@yandex.ru


Данная статья описывает процесс создания скинов для приложения KD Player, начиная с версии 0.8.1


Общая информация:

Скин для KD Player состоит из двух файлов с одинаковым именем, но с разными расширениями. После создания этих файлов, Вы можете поместить их в архив приложения в папку «/skin/», причем имена файлов должны быть «default.kds» и «default.kdi» - это обязательно. Также их можно просто скопировать в память телефона, в этом случае пользователь сам выбирает скин через файловый менеджер в проигрывателе.


Итак, состав скина:
  1. Первый файл – файл с расширением *.kds. Это обычный текстовый файл в кодировке ANSI. Он обязательно должен начинаться с зарезервированного слова «kdskin». Это слово частично уведомляем приложение о том, что перед ним именно файл скина. Здесь хранится текстовая информация о расположении графических элементов проигрывателя, а также цветовая схема меню. Все параметры представлены виде тегов, которые имеют следующий вид: <имя_тега параметры_тега>. Далее будет дано подробное описание каждого тега.

  2. Второй файл – файл с расширением *.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.
С Уважением, Кныжов Дмитрий и Борисов Сергей.

Internet Map Рейтинг@Mail.ru
Copyright © 15.08.2004 - 2009 by Borisov Sergey. All Rights Reserved. About