Для того чтобы лучше понять как устроенны скины данного плеера - разберем стандартный скин *Classic*.
!/Shared/PowerMP3/Skins/Classic
В данной папке находятся файлы от стандартного скина.
В нем мы видим:
bckg_240x320.png - фон на 240х320
bckg_320x240.png - фон на 320х240
elements.png - элементы скина (плей, пауза ...)
skin_240x320.xml - отвечает за расположение элементов на скине 240х320
skin_320x240.xml - отвечает за расположение элементов на скине 320х240
themes.xml - цветовые темы для данного скина (необязателен)
Самым важным файлом является skin_000x000.xml где 000x000 разрешение скина.
Итак, приступим.
1) Рисуем фон скина. И даем ему имя bckg_000x000.png где 000x000 разрешение экрана на которое расчитан скин (вообще название фоновой картинки можно сделать любым, но легче будет использовать стандартный формат имени). Естественно картинка должна быть сохранена в формате png.
2) рисуем все необходимые элементы скина (какие необходимы можно посмотреть в стандартом файле элементов elements.png). Все элементы нужно объединить и сохранить в одном пнг файле. Даем имя файлу elements.png (желательно. Можно использовать другое)
3) теперь нужно указать в файле skin_000x000.xml (где 000x000 ваше разрешение) где элементы из файла elements.png должны быть размещенны на скине. Для этого лучше отредактировать стандартный skin_000x000.xml чем создавать новый .
Редактирование файла вида skin_000x000.xml
В качестве примера я разберу skin_240x320.xml из папки !/Shared/PowerMP3/Skins/Classic.
Открываем skin_240x320.xml при помощи X-plore (наводим курсор на файл и жмем цифру 8).
Тут мы видим:
Шаг №1) фон скина
{image file="bckg_240x320.png" }
{coord id="bckg_main" left="0" top="0" width="240" height="320"/}
{/image}
Описание
З.Ы. теоретически я могу нарисовать фон размером 250х330, поместить фоновую картинку разрешением 240х320 в правый нижний угол. А в .xml файле указать это
Шаг №2) элементы в файле elements.png
Строка
Означает, что нужно указать где какой элемент в файле elements.png расположен .
Под данной строкой идет следующая
analyzer_filled - это спектр-анализатор
left="0" top="0" - координаты первого пикселя анализатора в файле элементов.
width="112" height="40" - размер элемента спектра-анализатора.
Далее идут файлы *alb_image_bckg* - обложка дорожки, *rating_filled* - рейтинг песенки и т.п. Их разбирать не стану т.к. думаю что всё уже понятно
Шаг №3) размещение элементов на скине.
Где то в середине файла .xml видим
Тут указанно разрешение области используемая для размещения элементов (думаю доступным языком написал)
Далее начинаются строчки отвечающие за размещение элементов на скине. Первый из них
left="120" top="38" width="112" height="40"}
{bars image="analyzer_filled"/}
{/analyzer}
left="120" top="38" width="112" height="40" - тут указанны начальные координаты элемента (120х38) и размер элемента (112х40)
Шаг №4) размещение текстовых надписей на скине.
Строчки отвечающие за текст идут вместе со строчками отвечающими за ремешение элементов и это немного усложняет нашу работу.
Вот эти строки отвечают за битрейт
id="BITRATE"
left="10" top="34" width="80" height="30"
font="Arial"
point="12"
style="bold"
align="center"
color="#FFFFFF"/}
*left="10" top="34" width="80" height="30"* - кусочек скина отводимый для указания битрейта )))
*font="Arial"* - тип шрифта. Существуют "Arial", "extrasmall", "small".
*point="12"* - размер шрифта.
*style="bold"* - стиль шрифта. Бывают "bold", "normal".
*align="center"* - расположение текста в отведенном для него кусочке Существуют "center", "left", "right".
*color="#FFFFFF"* - цвет текста по принципу RGB в 16тиричной форме.
P.S. файл themes.xml раскрывать не вижу смысла) после всего прочитаного всё должно быть и так понятно! ))
P.S.S. все замеченные ошибки в статье, предложения о ее дополнении прошу сообшать мне в ЛС
С уважением участник
SymbianTweak - Style Team | rap-st
прочитал статью.... и понял, что лучше не заморачиваться с созданием своего скина)))
0 ответить