FAQ для создателей скинов | как создавать скины и не только



Реп: (11)
1. Темы для экрана Today
1.1 Theme Generator by Microsoft
1.2 Extende Themes для Spb Pocket Plus
1.3 ThemeMaker McDeb
2. Выключение КПК
2.1 PsShutXP
3. Today плагины
3.1 WisBar Advance 2
3.2 WAD
3.3 spb Pocket Plus
3.4 iLauncher
3.5 Pocket Breeze
4. Клавиатуры
4.1 Resco Keyboard
5. Плееры
5.1 WMPlayer
5.2 GSPlayer
5.3 Pocket Music
5.4 Pocket Player
6. Погода
6.1 Weather Panel
6.2 Pocket Weather
6.3 spb Weather
7. Другие


1.1 Theme Generator by Microsoft

Данная программка от Microsoft предназначена для создания тем для экрана Today для ваших Windows Mobile устройств.
Скачать программу можно здесь.

Рассмотрим основные шаги создания темок для Today с помощью этой программы:

Шаг 1. Собственно сам запуск программы.
Перед нами высвечивается следующее окно:

Изображение

Нам предлагается на выбор 3 пункта:
- Create a new theme - собственно создание новой темы.
- Open an existing theme - открыть существующую темы, для возможного редактирования.
- Find themes on PocketPC.com - тут всё понятно.

Выбираем первый пункт.

Шаг 2. Нам предлагают выбрать изображение, которое будет служить фоном темы. Тут всё просто, нажимаешь "Browse", указываем место где находится наше изображение и жмём Открыть.

Изображение

После того как мы выбрали изображение, в окне программы покажется приблизительный вид нашей темы.

Изображение

Шаг 3. Изменение фона. Для изменений мы должны нажать в этом же окошке Modify This Image.

Изображение

Нам предлагают изменить настрйкии изображения (Image Options):
- Negative - Негатив изображения
- Gray Scale - Чёрно белое изображение
- Flip - Горизонтальное отображение изображения
- Mirror - зеркальное (вертикальное) отображение изображения

Darkness/Lightness - нам позволяют настроить яркость изображения
Transparency - Прозрачность изображения

Далее идут 2 кнопки - это поворот изображения по часовой, и против часовой стрелки.

После того как мы настроили изображение по своему желанию жмём ОК и возвращаемся в предыдущее окно.

Жмём Next и переходим к следующей стадии создания темы.

Шаг 4. Настройка фона Меню Старт. Тут так же всё достаточно просто. Нам предлагают выбрать из двух пунктов:
- Использовать в качестве фона в Меню старт то же изображение, что используется в качестве основного фона.
- Использовать другое изображение.
Если мы хотим использовать другое изображение, отмечаем этот пункт, и жмём на Browse, где указываем место нашего изображения.
Вы так же можете настроить это изображение нажав Modify this Image (настройки идентичны тем, что были в предыдущем шаге).

Изображение

Жмём Next

Шаг 5. Выбираем цвета Темы. Нам предлагают настроить следующие цвета:
- Today Text
- Navigation Bar
- Command Bar
- Navigation Tray
- Message
- Important message

Изображение

Здесь всё интуитивно понятно. Но следует помнить, что подбирая цвета, вы должны опираться на их читаемость на выбранном вами фоне.
После того, как вы настроили цвета и пришли к нравящемуся вам виду, жмём Next/

Шаг 6. Сохранение.
В строке Name and save your theme - вы указываете название вашей темы.
Location - место куда ваша тема будет сохранена. (на мой взгляд проще всего указать Рабочий стол)
Вы можете так же отметить пункт "Послать тему на КПК после окончания".
Advanced Options - Настройки сохраняемой темы - Нам предлагают выбрать качество Изображения (либо jpg, либо bmp). Советую вам выбрать jpg и опытным путём найти преемлимое соотношение качества (ползунок) и размера темы. После всех настроек, мы нажимаем Finish.

Изображение

Шаг 7. С читой совестью отрываем рабочий стол (или ное место где вы сохранили), и копируем свою темку на кпк. Выбираем в настройках - Личное - Сегодня свою темку и наслаждаемся.

(с) AGgarik, 2005



1.2 Extende Themes для Spb Pocket Plus

Так как по сути своей, это своеобразный add-on для Theme Generator, логично его рассмотреть именно сейчас.
Оригинальный вариант инструкции вы можете найти _http://www.spbsoftwarehouse.com/products/pocketplus/themetutorial.html?en здесь. Я же изложу только основные моменты.

Установка.
1. Скачать и установить Theme Generator. _http://www.microsoft.com/windowsmobile/downloads/themegenerator_eula.mspx Ccылка.
2. Скачать _http://www.spbsoftwarehouse.com/products/extthemegen/download.html?en Spb Extended Theme Generator add-on.
3. Установить add-on.

Создание новой темы.

Шаг 1. Создание Extended theme гораздо более трудоёмкое, и, пожалуй, требует от вас хоть какого-нибудь знания Фотошопа.
На этом этапе мы создаём Фон нашей темы и фон Меню Старт.

Если мы создаём для QVGA, нам слудует создать изображение с размерами 320x294, и задать ему имя - tdywater.gif. Это будет фон нашей темы.
Изображение
Нам так же следует создать изображение с размерами 240x320, и назвать его - stwater.gif. Это изображение послужит фоном для меню Старт.

Если мы создаём для VGA, схема абсолютно такая же.
Изображение для самой темы создаём с размерами - 640x588, и называем его tdywater.gif.
Изображение
Изображение в качестве фона Меню Старт, создаём с размерами 480x640 , и называем его stwater.gif.

Шаг 2. Создание индикаторов. Данный этап опционален, то есть вы можете создать свои индикаторы, что придаст вашей теме ещё больше индивидуальности, а можете использовать те, что предлагает программа (стоит отметить, что выбор достаточно не плохой).

Если вы решили создать свои индикаторы, давайте рассмотрим как это сделать.
вы можете так же изменить уже имеющиеся, они лежат в папке Program Files\Theme Generator\predefined\Today

Мы должны создать следующие файлы:

* pls_backlight.gif - подсветка
* pls_backlight_auto.gif - автоподсветка (не на всех КПК)
* pls_backupbattery.gif - резервная батарея
* pls_battery.gif - батарея
* pls_battery_charging.gif - батарея "заряжается"
* pls_battery_empty.gif - батарея "пуста"
* pls_storage.gif - память КПК
* pls_storagecard.gif - SD карта памяти
* pls_storagecard2.gif - CF карта памяти
* pls_storagecard3.gif - встроенная флэш память

1. определитесь с размерами индикаторов (cм картинку ниже)
Изображение

2. форат индикаторов каждый из 10 файлов имеет следующуб схему (за исключением pls_backlight.gif и pls_backlight_auto.gif у которых 3 states вместо 2)
Изображение

3. Цвета Маски.
(R, G, H) - описание
(255, 0, 0) - горизонтальная панель
(128, 0, 0) - горизонтальная панель с ползунком (для подсветки)
(0, 255, 0) - вертикальная панель
(0, 128, 0) - вертикальная панель с ползунком (для подсветки)
(0, 0, 255) - текст
(255, 0, 255) - зона кликанья

Альфа канал - используется в скине для установки прозрачности. все цвета в альфа канале должны быть чёрно белыми. Чёрный - непрозрачный, белый - полная прозрачность. Серые цвета - для частичной прозрачности.

Шаг 3. Создание индикатора батареи над панелью задач. (так же как и второй шаг опционален!)
Есть различные дефолтовые индикаторы выглядящие следующим образом:
Изображение
Но вы так же можете создать свои.
Индикаторы могут быть высотой в 2 или 3 пикселя. их толщину мы устанавливаем в настройках Покет+
Изображение
То есть каждый индикатор должен состоять из 2 файлов: plbwater2.gif, plbwater3.gif, для соответственно тонкого и толстого индикатора.
файл plbwater2.gif должен быть шириной в 640 пикселей и толщиной в 9.
Изображение

Шаг 4. Создадим папку, в которую и закиним все созданные нами индикаторы и файлы.

Шаг 5. Запустим Theme Generator и выберем создать новую тему.

Шаг 6. В качестве фона экрана тудей выбираем - tdywater.gif, а фона меню старт - stwater.gif.

Шаг 7. Настраиваем цвета нашей темы.

Шаг 8. в окне имя - мы вбиваем имя нашей темы, но с окончанием Ext, чтобы показать, что это расширенная тема. Если тема для ВГА устройства, приписываем окончание Ext VGA. Жмём Finish.

Изображение

Шаг 9. Нам высвечивается незнакомое окно. Именно здесь мы и создаём нашу Extended тему. Ставим галочку у Create an extende theme - это означает что мы созадём, затем отмечаем, что мы создаём ВГА тему (если это действительно так).
В следующем окне, укажите папку, где сохранены все наши индикаторы и файлы.
Ну а дальше всё ясно, либо мы выбираем из имеющихся индикаторов, либо ставим флажок у Custom и показываем где лежат наши файлы.

Шаг 10. После всего, мы ещё раз тщательно проверяем всё ли мы правильно указали и жмём Generate. Если всё указано правильно, то наша темка сгенерируется и сохранится там где мы указали, а если что-то сделано не так, нам вадаётся окно об ошибке - значит проверяем всё ещё раз.

© AGgarik, 2005



1.3 ThemeMaker McDeb от KAMware

А эта программа создания тем для Today, пожалуй, одна из лучших.
Скачать программу можно _http://hpc.ru/soft/software.phtml?id=9772 здесь.

Итак, устанавливаем и запускаем. Стоит оговориться, что если вы запускаете ДЕМО версию, то на всех сделанных вами темах будет не очень цензурное слово DEMO.
Перед нами появляется достаточно милый интерфейс программы.

Изображение

Нам предлагают Создать новую тему (Start new theme):
- Standard, обычная тема для qvga в портретном режиме.
- QVGA, тема для устройств qvga работающих на WM 2003SE и выше, соответственно поддерживающие как портретный, так и ландшафтный режимы.
- VGA, тут всё ясно.

Image tools
- загрузка изображения
- изменение изображения
- прозрачность
- создание скриншота

Пара слов о каждом подпункте.
загрузка изображения

Изображение

Нам предлагается либо ужать изображение (3 варианта, по оси Х и Y, либо по X, либо по Y), либо "выхватить кусочек оригинального изображения не сжимая его.
Так же его возможность покрутить изображение (горизонтально и вертикально).
После того как мы остались довольны результатом, жмём ок.
изменение изображения, собственно изменение того, что мы только что установили.
прозрачность, устанавливаем прозрачность основного фона. НО, если мы щёлкнем по кнопке Старт, нам откроется меню, и мы уже будем изменять прозрачность фона меню.
Мы так же можем задать цвет "прозрачности".
создание скриншота, для облегчения нашего труда, нам предлагают сделать скриншот, при чём в 4-х различных вариациях.

Color Toolsa
Далее мы задаём цвета нашей Темы.
количество настроек здесь немного больше чем в том же ThemeGenerator. вы так же можете щёлкнуть мышкой на объекте для которого задаёте цвет, а затем кликнуть по тому цвету на виртуальном экране Today, который вы бы хотели установить.
После настроек я получил приблизительно следующее:

Изображение

И вот мы наконец доходим до особенности этой программы. А именно настройка внутренних цветов.
Кликаем на Internal Colors.
Видим следующее окно.

Изображение

Здесь мы задаём цвет полос (каждой из двух и обеих сторон), а так же цвет кружочков, долгого удержания стилуса на месте (появляющегося меню).
Подбираем цвета. Нажимаем Save and Exit.

Далее, мы впечатываем название нашей темы в окошко Theme Name и жмём на сохранить (дискетку), выбираем куда сохранить и всё. Наша тема завершена.

© AGgarik, 2005



2.1 PsShutXP

Информация взята с оффсайта.
Как создать свои скины:

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

Элементы управления:
1. выключение экрана;
2. выключение КПК;
3. сброс КПК;
4. блокирование паролем;
5. таймер;
6. иконка в трэе (красная область - иконка для галки);
7. отмена.

Для создания своего скина необходимо просто вписаться в них своей графикой.
К примеру, вот два файла для темы основанной на теме SouLuna для ПК:
- psshutxp_skin_rus.gif, размер: 220x140 - сам диалог:
Изображение

- psshutxp_skin.gif, размер: 16x16 - галочка для IconTray: Изображение

Пример исходного файла скина SouLuna со слоями в программе Adobe Photoshop, на основе этого файла можно легко создать свой скин:
Изображение

Шаблон элементов для VGA (HiRes) версии формате PSD программы Adobe Photoshop:
Изображение

Название файлов скинов:
- psshutxp_skin.gif - галка (16x16);
- psshutxp_skin_rus.gif - русская версия (220x140);
- psshutxp_skin_eng.gif - английская версия.

Отдельно для VGA версии:
- psshutxp_skin_vga.gif - галка (24x24);
- psshutxp_skin_rus_vga.gif - русская версия (440x280);
- psshutxp_skin_eng_vga.gif - английская версия.

(с) ppcsoft.narod.ru

Сообщение отредактировал AGgarik - 05.06.06, 19:07



Реп: (11)
3.3 spb Pocket Plus

На сегодняшние день существует ряд программ, позволяющие нам выводить на экран Тудея иконки приложений, что значительно облегчает нам запуск программ. У каждой из них есть свои особенности, свои плюсы и минусы, но тем не менее каждая из них имеет право "жить".

Давайте рассмотрим одну из самых первых программ, позволившую нам сделать наш экран тудей наиболее функциональным - spb Pocket Plus. Речь пойдёт уже об обновлённой версии программы, о версии 3.1 и старше. Почему не о предыдущих версиях? Потому что именно с 3-ей версии в программе появилось много приятных нововведений, которые мы и будем украшать.

Итак, при установке программы, в её директории, создаётся папка Icons. Именно с ней мы далее и будем работать.
Как мы видим, программа позволяет создавать закладки, и приписывать им различные названия и иконки. Чтобы добавить свои, к уже имеющемуся не маленькому выбору, мы должны открыть файлы tab12 (tab24 для VGA устройств.)
Как мы видим, у нас имеется "лента" с различными иконками, каждая из которых имеет размер 12х11 (ширина и высота соответственно) и 24х22 для VGA.
Таким образом, что бы добавить один элемент, мы должны увеличить холст на 12 (24) пикселя, и на образовавшееся место разместить наше изображение.
Следует отметить, что белый цвет - отвечает за прозрачность, поэтому ту часть изображения, которая не должна отображаться, следует закрасить белым цветом.
Изображение
После этого, мы сохраняем наше изображение, и заменяем им то, которое мы имеем на кпк.
Далее выбираем из списка нашу иконку и наслаждаемся.

Идём далее, переходим к более глобальным вещам - к самим иконкам.
Здесь нужно вспомнить, что VGA девайсы поддерживают иконки 64x64 и 32х32, а QVGA устройства 32х32 и 16х16.
Поэтому выбираем уже имеющийся любой комплект изображений и увеличием его с правого боку (к примеру) в соответствии со следующими параметрами:
Изображение
Почему высота изображения должна быть и является двойной?
Потому что первым рядом идёт изображение само, а вторым идёт альфа канал этого изображения.
Добавим новые иконки для QVGA устройства. 4 иконки, значит увеличиваем имеющееся изображение на 128х64 (ширину увеличиваем на 128 пикселей, а высота остаётся прежней)
В первый ряд мы вставляем сами изображения, а во второй, как уже было сказано выше, их альфа каналы.
Изображение
Что есть альфа-канал? По сути это чб изображение, отвечающее за то, какая часть основного изобажения будет видна. То место основного изображения, которому соответствует чёрный цвет альфа канала отображаться не будет. (см изображение выше)
Где взять альфа каналы? Либо нарисовать их самому, либо если ты работаешь с tga иконкой взять альфа канал уже оттуда.
Поэтому, если вы берёте файл с иконками (ico или ещё какой), то лучше извлекать иконки оттуда в формате tga.

Изображение

Таким образом, после всех проделанных манипуляций, мы сохраняем наши иконки в разрешении png и закидываем в папку Icons на кпк заменяя предыдущие.
Вот что получилось у меня:

Изображение
--------------------------------------------------------------------------------------------
Обещанное описание метода создания наборов для SPB PocketPlus
автор: cyberscrub


Для работы нам необходимы следующее:

1. Программа SIB IconStudio (прилагается с рег.инфой)
2. Adobe Photoshop CS (я лично юзаю 9-ый)
3. Материал из которого буду сами иконки. Для этого подходят практически любые файлы. Так как у нас есть супер-могучая прога SIB IconStudio, то материал может быть PNG-Иконки, ICO, ICNS, TGA, BMP, DLL-библиотека с иконками, EXE-Шники программ (в них бывает не мало иконок), в общем почти все файлы содержащие графику

Кстати SIB IconStudio имеет отличную функцию сканировать заданные интернет-ресурсы , сайты, серверы, файл-серверы , сканировать и если там есть графические файлы которые похожи на иконки, то прога выдернет их в ваш лист. Ну а там вы можете сохранить их хоть в листе, хоть по-отдельности в *.ico для вашего ПК.
Так же SIB умеет добавлять эффекты , например ту же тень. Так,что если вы хотите сделать лист иконок для СПБ которые будут иметь тень - просто выделите мышкой все иконки в листе, нажмите Effects / Shadows. Или выберите отдельные иконки к которым нужно добавить тень.
В подробности эффектов не вдаюсь, т.к. не это основная цель поста.

Мы установили SIB IconStudio & Photoshop CS ,Итак начнем схему:

Нажимаем в левом верхнем углу FILE --> New Image List
Прикрепленное изображение
- выбираем новый лист с иконками

Устанавливаем параметры нашего листа. Item Size - Если у нас qvga,значит ставим 32х32 если VGA ставим 64x64
Colors обязательно выбираем - TRUE COLOR + Alpha (32bits)
Item Arrangement только Horizontal Line (Rectangle можно использовать для создание Preview Картинок) Жмем "ок"
Прикрепленное изображение
Далее нажимаем кнопку для добавления иконок (на рис.) Прикрепленное изображение
В диалоге выбора добавляемых элементов в строке File Type: укажите ANY FILES. Тогда вы сможете добавлять любые файлы. Кстати, если в диалоге просто выделить один файл то правее в Preview-режиме вы можете увидеть саму иконку которая содержиться например в ехе-шнике какой-нибудь программы. Если выделить DLL-библиотеку, то вы можете там же просмотреть содержимое этой библиотеки.
Прикрепленное изображение


Там где три красных восклиц. знака находиться "Превью-экран". Прикрепленное изображение

Мы выбрали нужные нам элементы в наш лист Нажимаем FILE / SAVE AS / подписываем файл и сохраняем его в TGA-Формате.
Прикрепленное изображение

Кстати, во время добавления файлов вы можете получить сообщение img-53973-sib4.gif
Это происходит если добавляемый элемент больше размером чем установленые вами размеры в параметрах Image-List. Это просто предложение сделать ресайз. По-умолчанию там установлены те размеры которые вы в параметрах создаваемого листа указали. Поэтому просто нажимайет кнопку ALL.

Закрываем программу и запускаем фотошоп. В фотошопе нажимаем файл / открыть, открываем сохраненный в SIB IconStudio наш TGA-лист с иконками. Когда наш файл откроеться, вы увидите тонкую полоску с иконками расположенными по горизонтальной линии. Нажимаем на клавиатуре сочетание клавишь CTRL + A (выделить все) когда вся наша полоска с иконками выделится, нажимаем CTRL + C (копировать), и после этого сразу нажимаем CTRL + N (создать новый рис.) Появиться диалог настроек нового создаваемого рисунка (как на скриншоте) То что на скриншоте выделено красным: Высота-64 это если мы создаем под VGA, под QVGA будет-32. Так вот вместо 64 мы ставим 128, тоесть ровно в 2 раза больше. Цветовой режим ставим 8-бит.Больше ничего не меняем и Нажимаем "ОК".
Прикрепленное изображение


У нас появляется еще одна вкладка в фотошопе, это будет горизонтальная пустая-прозрачная полоска по длине равная вашему TGA-Листу который вы создали в SIB Icon Studio и открыли в фотошопе, а по высоте ровно в 2 раза больше, т.к. мы указали 128. После того как появиться это, выбираем вкладку с нашим TGA листом, который до сих пор остается полностью выделенным (т.к. CTRL+A) Выделяли и копировали мы его для того,что бы у нас просто занеслись размеры в буффер-обмена, и при создании нового рис. программа сама подхватила их, и нам лишь нужно изменить высоту (там где мы меняли с 64 на 128). И так, мы перешли к нашему изначальному TGA-Листу, он полностью выделен, нажимаем опять CTRL+C, затем переходим к вкладке в которой наш еще пустой, новый рисунок, нажимаем CTRL+V, и на панели инструментов выбираем правую верхнюю кнопочку (см.рис. то что обведено красным) нажав на нее, ведем курсор мышки на свеже-вставленный копи-пастовый элемент. направляем на него,зажимаем на нем прав. кнопку мышки и тянем к верхней границе,так,что бы наш вставленый рисунок занял верхнюю половину поля. А так как то,что мы вставили имеет высоту 64 а то куда вы вставили мы сделали 128, то значит мы занимаем ровно половину Прикрепленное изображение (кстати там не надо сверх-четких усилий так как фотошоп как-бы примагнити к верхнему краю поля, в общем вы сами почувствуюте это.Наша нижняя половина остаеться все еще пустой и прозрачной. Вы уже догадались для чего она? Да-да, альфа канал там будет! Как его сделать? А очень просто! Выбираем опять вкладку с нашим TGA-Листом который мы создали в SIB IconStudio, он у нас все еще остается выделенным полностью,идем на панель /слои / каналы / конутры / выбираем в каналах в самом низу "АЛЬФА 1" (как на рис.) И наш лист становиться черно-белым, мы нажимаем CTRL+C и у нас копируеться Альфа-канал нашего TGA-Листа! Переходим к той вкладке где мы вставили верхнюю часть с самими иконками, нажимаем CTRL+V , у нас вставляется альфа-канал, так же берем и мышкой тащим его,что бы занять то пустой место,которое как раз имеет размер такой же как вставляемый альфа-канал. И тут опять же "магнит подхватит" и уровняет все как надо. Теперь у нас есть лист размерами высота 128 и ширина не важно какая (ну зависит от кол-ва иконок в том TGA-Листе,но высота может только быть 128 у VGA & 64 y QVGA. Верхняя половина листа это иконки - нижняя альфа канал.

Вот что должно получиться Прикрепленное изображение

Теперь все,что нужно это нажать FILE / SAVE в фотошопе и сохранить то,что у нас получилось в PNG-Формате. Все - лист готов к использованию в SPB Pocketplus!

Сообщение отредактировал Реут - 28.09.07, 08:17



Реп: (7)
3.3.1 spb Pocket Plus Meter

Основные принципы понятны, но неясны остаются несколько фич. Как их сделать.
Идеальный вариант - найти описание.
Итак, как я понял, на примере иконки батареи.

Изображение

1. Прогресс-бар
2. 100% заряд
3. 100% разряд
4-6. ??????

Теперь вопросы:
Как сделать так, что-б бар показывал прогресс заряда-разряда?
Как сделать так, что-б под полосой цифрами прописывалось кол-во процентов, а для хранилищ - кол-во свободного места? Как это сделано на EXPEA mega.



Реп: (10)
1) Чтобы бар показывал процесс заряда-разряда на твоем рисунке [1] должна быть правильным! цветом закрашена соответствующая область. Для горизонтального бара она должна быть красного цвета (R:255; G:0; B:0), а не зеленого как на твоем рисунке. Зеленый цвет (R:0; G:255; B:0) используется для вертикальных баров. К томуже полоску надо сдвинуть вправо (если наложить [1] на [2] эта полоса должна точно совпасть с "линеечкой")
2) Чтобы отображались процеты или свободное место, на рисунке [1] надо нарисовать полоску синего цвета (R:0; G:0; B:255). Тогда информация будет выводится в той области.
3) Пурпурным цветом (255, 0, 255) в зоне [1] закрашивается область "кликания".
4) Зона [4] должна быть белой. Только в правом верхнем углу нужно закрасить кусок 1х1 пиксель зеленым цветом (R:0; G:255; B:0) для ВГА метеров.
5) Зоны [5] и [6] отвечают за уровень прозрачности метера. 100% белый - 100% непрозрачная область, 100% черный - 100% прозрачная. Серый - полупрозрачная область. (для стекла, тени... и т.п.)
6) Между зоной [1] и [2] должна быть нарисована черная полоска толщиной 1 пиксель. На ней через один пиксель от левого края должна быть закрашена зона 1х1 пиксель тем цветом, которым должен выводится текст с % или свободным местом.


Прикрепленное изображение

Сообщение отредактировал Mihasus - 27.07.06, 15:55



Реп: (10)
PhoneMan @ 28.07.06 00:06:34
Вопрос, а можно ли текст располагать по окружности или по диагонали?

К сожалению нельзя.. только по горизонтали. <_<


nebulus @ 30.07.06 06:04:01
есть какие-нть нюансы при отрисовке лампочных индикаторов? Ну, там специфика расположения и размера бегунка внутрм стейта, длина/кратность всей полоски?,


Нюансы есть:
В СПБ темах содержатся два Gif-файла:
pls_backlight.gif (отвечает за стандартную регулировку подстветки)
pls_backlight_auto.gif (на некоторых устройствах (напр. Ипаках) есть опция "Авторегулировка подсветки" за которую отвечает датчик освещения. Данный индикатор имеет положение в котором подсветка будет регулироваться автоматически).

Индикатор подстветки в отличие от других индикаторов делится не на 6 зон, а на 8.
[1] [5]
[2] [6]
[3] [7]
[4] [8]

1) В зоне [1] пурпурным цветом закрашивается зона кликанья.
Для горизонтального слайдера рисуется полоска буро-красного цвета (R:128, G:0, B:0).
Для вертикального - темно-зеленого (R:0, G:128, B:0).
2) Зона [5] должна быть белой. Только в правом верхнем углу нужно закрасить кусок 1х1 пиксель зеленым цветом (R:0; G:255; B:0) для ВГА индикаторов.
3) Между зоной [1] и [2] должна быть нарисована черная полоска толщиной 1 пиксель.
4) В зоне [2] рисуется внешний вид индикатора (лампочка, полоска).
5) В зоне [6] рисуется альфа-канал (белый-100% непрозрачность; черный-100% прозрачность; серый - полупрозрачность) для зоны [2] (для лампочки, полоски).
6) В зоне [3] рисуется внешний вид только полоски.
7) В зоне [7] рисуется альфа-канал полоски.
8) В зоне [4] рисуется внешний вид ползунка (отцентровано по вертикали и горизонтали относительно зоны [4]).
9) В зоне [8] рисуется альфа-канал ползунка (отцентровано по вертикали и горизонтали относительно зоны [8]).

10) Для индикатора с автоматической подсветкой последние 20% полосы (крайнее правое положение или крайнее верхнее) отвечают за то, как будет выглядеть индикатор в данном режиме.

Для наглядности внизу примеры вертикальных и горизонтальных индикаторов:

Прикрепленное изображение

Прикрепленное изображение

Прикрепленное изображение

Прикрепленное изображение

Сообщение отредактировал Mihasus - 31.07.06, 10:48



Реп: (48)
3.6 Resco Plugin
Что ж, для особо заинтересованных опишу как к этой софтине делаются скины. Процесс чертовски незамысловат. Распишу построчно файл *.skin.
[General] тут начинаются основные настройки
DefaultStatusFontSize=10 размер шрифта для цифровой части индикатора (напр., заряд батареи 90%)
DefaultStatusFontBold=1 будет ли он жирным (1 - да, 0 - нет)
DefaultLabelFontSize=10 размер шрифта словесной подписи индикатора (напр., Main Memory)
DefaultLabelFontbold=1 будет ли подпись написана жирным шрифтом
LabelTextColor=255,255,255 цвет словесной подписи индикатора (в данном случае выбран белый цвет)
ItemPaddingHor=12 горизонтальный отступ от края экрана в пикселях
ItemPaddingVert=7 и вертикальный
StatusTextColor=255,255,255 цвет текста цифровой части индикатора
Indicator=Indicator.png эта строка используется тогда, когда мы для всех индикаторов используем одинаковую шкалу заполненности, причем она у нас идет отдельным файлом. Это несколько упрощает жизнь: нам достаточно нарисовать ее один раз, назвать Indicator.png и прикреплять к каждой из иконок индикаторов (батарее, карточке...)
IndicatorAlpha=IndicatorAlpha.png это альфа-канал для нашей шкалы. То, что на нем черное - то будет видно, а белое - обрубается. Если прописали такую строку, то файл нужно назвать IndicatorAlpha.png
IndicatorOrder=0 положение шкалы относительно иконки (0 - иконка накладывется на шкалу, 1 - наоборот)
IndicatorStates=1 положение шкалы - загадка для меня....

Последние 4 строки можно не использовать, если рисовать шкалы в самих иконках (т.е. в одном файле с ними)

[Background] Играем с отступами плагина
MarginHor=4
MarginVert=4
PaddingHor=0
PaddingVert=0

[Settings]
Alpha=SettingsAlpha.png задаем название файла альфа-канала иконки настроек

[BatteryMain] БАТАРЕЯ
NumStates=9 допустим, что мы забили на создание шкалы в отдельном
файле. Создаем несколько иконок одинакового размера с постепенно изменяющимся положением шкалы (на одной у нас шкала пустая - 0%, потом 10% и т.д.). Засовываем их в один файл в ряд, слева направо. Именно колличество этих положений индикатора и прописывается в данной строке.
IndicatorPos=55,7 положение шкалы, ежели она у нас отдельным файлом
Alpha=BatteryMain_alpha.png название рисунка иконки индикатора
ChargeAlpha=BatteryMain_alpha.png ее альфа-канал
StatusRect=20,0,70,60 область под цифровую подпись (напр., 0% - 100%); начало области (от левого края), начало области (от верхнего края), конец области (от левого края), конец области (от верхнего края)
StatusAlignHor=0 выравниваем ее горизонтально; 0/1/2 = лево/центр/право
StatusAlignVert=2 выравниваем ее вертикально; 0/1/2 = верх/центр/низ
LabelRect=0,0,0,0 область под словесную подпись
LabelAlignHor=0 выравниваем ее горизонтально; 0/1/2 = лево/центр/право
LabelAlignVert=0 выравниваем ее вертикально; 0/1/2 = верх/центр/низ

[BatteryBackup] ЗАПАСНАЯ БАТАРЕЯ
NumStates=9
IconPos=0,0
IndicatorPos=55,7
Alpha=BatteryMain_alpha.png
ChargeAlpha=BatteryMain_alpha.png
StatusRect=20,0,70,60
StatusAlignHor=0
StatusAlignVert=2
LabelRect=0,0,0,0
LabelAlignHor=0
LabelAlignVert=0

[ProgramMemory] ОПЕРАТИВКА
NumStates=9
IconPos=0,0
IndicatorPos=55,7
Alpha=BatteryMain_alpha.png
StatusRect=20,0,70,60
StatusAlignHor=0
StatusAlignVert=2
LabelRect=0,0,0,0
LabelAlignHor=0
LabelAlignVert=0

[StorageMain] ОПЕРАТИВКА ПОД ФАЙЛЫ
NumStates=9
IconPos=0,0
IndicatorPos=55,7
Alpha=BatteryMain_alpha.png
StatusRect=20,0,70,60
StatusAlignHor=0
StatusAlignVert=2
LabelRect=0,0,0,0
LabelAlignHor=0
LabelAlignVert=0

[StorageBuiltIn] ака IPAQ FILE STORE
NumStates=9
IconPos=0,0
IndicatorPos=55,7
Alpha=BatteryMain_alpha.png
StatusRect=20,0,70,60
StatusAlignHor=0
StatusAlignVert=2
LabelRect=0,0,0,0
LabelAlignHor=0
LabelAlignVert=0

[StorageSD] SD-КАРТА
NumStates=9
IconPos=0,0
IndicatorPos=55,7
Alpha=BatteryMain_alpha.png
StatusRect=20,0,70,60
StatusAlignHor=0
StatusAlignVert=2
LabelRect=0,0,0,0
LabelAlignHor=0
LabelAlignVert=0

[StorageCF] CF-КАРТА
NumStates=9
IconPos=0,0
IndicatorPos=55,7
Alpha=BatteryMain_alpha.png
StatusRect=20,0,70,60
StatusAlignHor=0
StatusAlignVert=2
LabelRect=0,0,0,0
LabelAlignHor=0
LabelAlignVert=0

Наверное, все. Если я в чем-то неправ, отпишитесь пожалуйста. Метод проб и ошибок показал именно те результаты, которые я тут и описал.



Реп: (80)
Перевел Skining Guide phoneAlarm. в пдфе. Коу надо - забирайте: Прикрепленный файлimg-32049-PhoneAlarm_skining_guide_ru.zip ( 103.28 КБ )



Реп: (39)
Как самому нарисовать скин для Wis Bar Advanced 2.

Каждый skin maker создает свои шедевры «по своему».
Я расскажу, как я ваяю скины «по своему» :) постараюсь все разложить по полочкам.

Для начала, я беру «основу», из чего буду лепить, создавать, ваять скин. Допустим, мне понравился скин «Whatsta» автор: Mickesjo, из него я и буду делать свой скин. (на мой взгляд это самое простое решение в создании скина).
Вот собственно и ссылка на прямую скачку Whatsta :)
Итак! WBA Skin состоит из: множество графических файлов, таких как: png, tga, jpg, gif, bmp. И «SKIN» файла, который прописывает все графические файлы в программе, одним словом «фундамент».
SKIN файл можно открыть с помощью стандартного блокнота. Но к нему чуть позже.

А пока, подключаем наш КПК к ББ, открываем свое мобильное устройство в ПК, копируем скин «Whatsta» в директорию: \Program Files\Lakeridge\WisBar Advance\Themes и активируем, т.е. включаем его.
Выглядит очень красиво Прикрепленное изображение
На ББ открываем папку Whatsta, делаем вид папки в режиме «Эскизы страниц», для приятного просмотра рисунков, которые входят в состав скина.

Теперь займемся графикой. Я обычно использую программу Adobe Photoshop для редактирования и рисования всех этих графических файлов.

Находим в папке «Whatsta», файлы: «whatsta_background.png» (в режиме ландскейп) и «whatsta_background480.png»
Прикрепленное изображение
Эти два файла, так сказать верхние БАРЫ, где расположено множество других кнопок (старт, часы, уровень сигнала, костюм 1,2, хоме, коннект, дисконект, батарея с памятью, таск, клосе и ок.).
Прикрепленное изображение

Кидаем эти два файла в фотошоп и редактируем их под свое воображение.
Что я собственно и сделал.
Прикрепленное изображение
Небольшой совет: размеры баров на QVGA «240х26» пикселей, а на VGA «640х52». нарисовать бар на QVGA будет немного сложно, чем на VGA, поэтому лучше увеличить бар. Допустим вместо «26» пикселей высоты в «60» пикселей. Получается так.
Прикрепленное изображение

Ну а после того, как нарисовали, вернуть его в исходное состояние (240х26)

Бары готовы. Сохраняем их такими же именами («whatsta_background.png» и «whatsta_background480.png»). почему? Потому что, в файле «Whatsta_WA2_QVGA.SKIN» адрес бара ссылается на них.
Прикрепленное изображение


Если же вы решили сохранить их под свои имена (например: bar240.png и bar320.png), тогда в «Whatsta_WA2_QVGA.SKIN» который открыли при помощи блокнота, вписываем их туда. И сохраняем.
Вместо:
Portrait=whatsta_menubar480.png
Landscape=whatsta_menubar.png
На:
Portrait=bar240.png
Landscape=bar320.png

Теперь самое время протестить то, что мы нарисовали. Кидаем наши бары в директорию \Program Files\Lakeridge\WisBar Advance\Themes\Whatsta_WA2_QVGA. С заменой на ваши. (заменить существующие файлы)
Замечание: если же вы переименовали свои бары на новое название, то не забудьте кинуть и «Whatsta_WA2_QVGA.SKIN».
Посмотрите что получилось :)
Прикрепленное изображение
Теперь рисуем кнопки бара.
Для начала нарисуем кнопку старт (Пуск).
Находим два файла: «whatsta_start.tga» и «whatsta_start_pressed.tga» (в нажатом варианте).
Кидаем их в наш любимый фотошоп :) и аналогично нашему бару, рисуем их. В простом и в нажатом варианте.
Вот как выглядит у меня.
Прикрепленное изображение
Сохраняем наши "старты", только уже не в формате ***.tga а в png. (пример: whatsta_start.png).
Почему?
Потому что:
1) формат "tga" чутка тяжелее формата "png"что губительно влияет на память :(
2) tga используется в основном для слоя прозрачности (альфа канал). Пример: если определенная кнопка имеет тень или свечение, так же может быть стекляной, а бар в нашем проекте выглядит разукрашенным в разные цвета или рисунки, тогда легче кнопке придать слой альфа канала, чтобы тень, стекло, свечение кнопки, выглядело корректно.
показываю пример разноцветного бара, стеклянного объекта с тенью и кнопочки с внешним отблеском. Для них альфа канал необходим.
Прикрепленное изображение
Итак, кнопочки старта сохранили в «png» и незабываем изменить наше изменение в редакторе (в блокноте).
Прикрепленное изображение

Теперь протестим их. Кидаем также, как и наши бары в \Program Files\Lakeridge\WisBar Advance\Themes\Whatsta_WA2_QVGA. вместе с «Whatsta_WA2_QVGA.SKIN»., так как мы прописали кнопочки в формате «png».
Вот что получилось :)
Прикрепленное изображение
Далее делаем остальные кнопочки аналогично старту.
В моем проекте остальные кнопочки уже идут с тенью, поэтому я использую альфа канал, чтобы не испортить вид бара. т.к. бар у меня, как вы заметили с небольшим свечением в центре. Поэтому я ну ни как не смогу их сделать в png.
Пример на рисунке.
как будет выглядеть простой и нажатый вариант. :)
Прикрепленное изображение
О том как делать tga с альфа каналом, подробнее описано здесь…топик от Daf - а
Кнопки готовы, протестины аналогично как и старты.

Теперь подходим к кнопкам «Уровень сигнала» и «Батарея». К сожалению я их сделать в tga не смогу, т.к. программа не хочет работать с этим форматом, сигнал будет нерабочим :( . Программа с этими кнопками работает, только на png. Поэтому придется потрудится и помучаться, :) чтобы сделать слой прозрачности.
Начнем с батареи.
На этой кнопке обычно нарисованы «уровень батареи» и «уровень памяти».
Чтобы уровень батареи показывал свой графический вид в цветах, т.е. полоску, на сколько батарея заряжена, нужны определенные цвета.
Пример:
Прикрепленное изображение
Пример:
Эту белую полосу нужно закрасить градиентом с параметрами цветов:
1) R=255, G=240, B=255 (самый низ) начало.
2) R=255, G=249, B=255. (самый верх) конец.
Заметили разницу? Меняется только цвет «G». А в градиенте идет заливка по лесенке. т.е.
1) G=240, 2) G=241, 3) G=242, 4),5),… до G=249.
Покажу на рисунке заливку.
Прикрепленное изображение

выделенную часть заливаю.
Батарею закрасили.
Подходим к памяти. Память красится аналогично батареи, меняються только цвета: c R=255, G=255, B=240 до R=255, G=255, B=249. Похожа на батарею, только параметры цвета поменяли уже не в «G» а в «B».

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

Теперь добиваемся прозрачного слоя без вмешательства tga :)
Выделяем инструментом «Прямоугольная область» только то, что хотим удалить. В моем случае удаляем часть после кнопки.
Показываю на примере.
Прикрепленное изображение

Почему берем инструмент «Прямоугольная область»
Потому что, именно этот инструмент выделяет только четкие линии, не заходя за границы выделенного. Описывать не буду, только попробовав можно это понять. :)
Батарея готова, протестина на КПК.

Теперь подходим к уровню сигнала, оператора сотовой связи.
Здесь чуть проще чем с батарейкой.
Сигнал идет так же по возрастанию. Здесь нужны 4 линии с параметрами цвета:
1 линия. R=241, G=255, B=255 низ
2 линия. R=242, G=255, B=255 .....
3 линия. R=243, G=255, B=255 .....
4 линия. R=244, G=255, B=255 верх
Прикрепленное изображение
сохраняем, тестим.
Вот и закончили с верхним баром.

Дорисовали нижний бар, дорисовали бутоны (кнопки), дорисовали радиобутоны, дорисовали волум с таском, и каскад старта.

Остается дать кнопкам цвета шрифта и назначить сам шрифт.
Делается это так: заходите в настройки WBA, выбираем «Custom Theme»,
Прикрепленное изображение
нажимаем на кнопку «настройка», нажимаем на кнопку «Импортировать тему» , выбираем в директории \Program Files\Lakeridge\WisBar Advance\Themes\Whatsta_WA2_QVGA файл «Whatsta_WA2_QVGA», нажимаем «ок». Далее тапаем на «Импортировать тему»
Прикрепленное изображение
Выбираем нужную нам вкладочку и редактируем под себя.
Например: выбираю «кнопки программ», нажимаю на «Шрифт», выбираю сам шрифт, размер, цвет, цвет тени (если он нужен).
Остальное таким же макаром.
после сохраняем, т.е. Експортируем то, что изменили.

Вот и весь процесс создания скина.
Все очень просто. Главное начать, остальное приложится. Фантазируйте, реализуйте свои фантазии в рисовании и юзайте ваши творения.
Для многих скин мэйкеров, я написал много воды. Для новичков, только малую часть. Я сам начинал с нуля. Вот и затянулся. :)
Под конец. Вот что получилось у меня. Скоро буду постить :)
Прикрепленное изображение



Реп: (14)
VPK, для кувга 240х320(портрет), 320х240(альбом), но это только полдела, если оригинал имеет к примеру разрешение 1280х1024(альбом, соотношение сторон 5:4, число соотношения 1.25), то для того чтобы корректно(сохранив пропорции) поместить данное изображение в тему(.tsk), предположим кувга+портрет,
придется выполнять обрезку, причем таким образом чтобы при делении высоты на ширину в пикселах получалось 1.333333(если нужно сохранить пропорции от оригинала), далее уже применять ресайз до нужного разрешения(для уменьшения размера\веса картинки). По сути для корректного отображения любых обоев, на любых экранах важны лишь два параметра:
1. изначальная ориентация изображения, соотношение сторон изображения
2. корректировка этих данных под нужный дисплей(ориентация+соотношение сторон), а точный подгон разрешения уже вторичен(главное не меньше разрешения экрана), на качество не повлияет, но вес уменьшит ;) , но есть нюансы, если к примеру понравившуюся картинку хочется использовать в качестве обоев через WAD, то уже нужно учитывать размер баров, для вга они имеют 52пиксела, соответственно если использовать только верхний бар
в Wad, то идеальным разрешением для вга+портет будет 480х588, если используем и нижний, то 480х536



Реп: (14)
Вот программа для создания и редактирования скинов к Wisbar Advance
img-53939-WA2SkinEditorProInstaller.rar: Прикрепленный файлimg-53939-WA2SkinEditorProInstaller.rar ( 177.75 КБ )


Это более новая версия первого релиза



Реп: (14)
Каким образом делать сделать корректный ресайз для изображений(.png, .tga)? Речь даже не о пакетном ресайзе, а хотя бы о приемлемом алгоритме\скрипте. Дело в том, что при ресайзе .png с прозрачностью в виде альфа-канала, или цвета 255.0.255, всегда происходит образование "паразитных" пикселей которые создают ореол вокруг изображения, вследствие чего приходится ручками при большом маштабе убирать всю эту бодягу :( Видимо причина в самом алгоритме маштабирования растрового изображения(пробовал разные методы ресайза). Только вот вопрос каким образом тогда профи\скинмейкеры производят ресайз, не ручками же правят после каждого уменьшения?



Реп: (43)
liver, расскажи подробнее. Уменьшаешь или расстягиваешь рисунок? При альфа-канале есть ли полупрозрачные пиксели в изначальном изображении? В каком редакторе изменяешь размер?



Реп: (14)
Бердичев,
Ним можно создать скины для WA3?

можно, но так как сабж не официальный, то будет несколько пробблем, описывать все очень долго и проще в личке.
Из основных недостатков:
не работает прямая поддержка формата .tga в самой программе, т.е придется сначала делать .png, а потом переделывать в .tga и позже прописывать в .skin файле изменение расширения
не поддержки некоторых функций от тем WBA, в частности изображений для панели task, и прочее
Я когда создавал свою тему Wisbar Advanced 2 Skins & Suits (post #1086423) , просто сравнивал записи в .skin-файле от темы Aurora Borealis
Особой разницы между скинами WBA2\WBA3 нет, за исключением новых кнопок(Сustom1\2\3\4\, доп.кнопки wba3 и прочее)



Реп: (454)
Dravt @ 12.12.07 05:18:27
Как делать скины для rlToday?

_http://rotlaus-software.de/wiki/ - тут подробный мануал по редактированию skin.xml.



Реп: (145)
5.3. Pocket Music

Виды скинов
PocketMusic использует два различных формата скинов: скины от Winamp 2.x и собственный формат PocketMusic. Для того чтобы узнать как создавать скины для Winamp, посетите страницу www.winamp.com. PocketMusic использует Wimap-овские скины из подкаталога Skins (т. е. \Program Files\PocketMusic\Skins\).

Скины в собственном формате PocketMusic располагаются в подкаталоге PMSkins. PocketMusic поддерживает горизонтальную и вертикальную ориентацию скинов. Для их разделения используются разные расширения: .vsk для вертикальных (portrait) скинов и .lsk для горизонтальных (landscape). Фактически, эти файлы обычные .zip-архивы, содержащие файл-описание (layout.xml), набор изображений с элементами скина, а также необязательный файл-превью preview.png. Этот файл должен иметь разрешение 139×185 для QVGA скинов или 278×370 для VGA и являться уменьшенным скриншотом скина. Именно она отображается на вкладке выбора скина в опциях PocketMusic.

Файл-описание layout.xml

Для начала, вы можете использовать прилагающийся к PocketMusic в качестве основы для ваших собственных творений. Скопируйте стандартный вертикальный скин (обычно это \Program Files\PocketMusic\PMSkins\default.vsk) на ваш настольный компьютер, переименуйте его в default.zip и извлеките содержимое. Файл layout.xml вы можете открыть с помощью Internet Explorer, в котором вы сможете отслеживать возникающие в xml-код ошибки. Редактировать его вы можете при помощи любого простейшего текстового редатора (например в «Блокноте»).

Описание скина состоит из двух частей:

1 часть — preload (предварительная загрузка)
<preload>
<bitmap alias="BACK" file="back.png" />
<bitmap alias="PLAYPAUSE" file="playpause.png" />
<bitmap alias="BUTTONS" file="buttons.png" />
<bitmap alias="CONTROLS" file="controls.png" />
<bitmap alias="OTHER" file="other.png" />
</preload>


Эта часть описывает все изображения, используемые в скине. Изображения могут быть в форматах PNG, JPG, BMP или в статичном GIF. Для каждого изображения необходимо задать уникальный alias, по которому в последствии оно будет вызываться.

2 часть — layout (разметка)

<layout>
<control1 param1="aaa" param2="bbb" />
<control2 param1="ccc" param2="ddd" />
. . .
<controlN param1="yyy" param2="zzz" />
</layout>


Эта часть содержит описание каждого элемента управления, используемого в скине. Ниже приведен полный перечень возможных элементов управления:

Background
<background
src="BACK"
x="0" y="0"
w="240" h="320"
/>


Этот элемент обязательно должен быть включен в каждый скин. Он определяет фоновое изображение для скина. Параметр «src» содержит alias изображения, параметры «x», «y», «w» и «h» определяют расположение и размер прямоугольной зоны фона на изображении, указанном в src. Фон должен быть на весь экран, т. е. вы не можете создавать неполноэкранные скины.

Timer
<timer>
x="17" y="15" w="76" h="30"
orientation="0"
font="Tahoma"
point="18"
weight="700"
color="000000"
</timer>


Timer — это элемент, отображающий текущее время воспроизведения. Вы можете определить его позицию на экране (параметры «x» и «y») и размер («w» и «h»). Также, вы можете установить параметр «orientation» — он может равняться 0, 90, 180 или 270 градусам. Стандартное значение — 0 градусов, остальные указывают угол поворота против часовой стрелки. Также можно определить название шрифта (параметр «font»), его размер («size») в пунктах, вес («weight», допустимые значения — 200 (тонкий), 400 (обычный), 700 (жирный), 900 (очень жирный)). Цвет текста задается в формате ККЗЗСС, где КК, ЗЗ и СС — значения красного, зеленого и синего в шестнадцатеричном формате (000000 — черный, FFFFFF — белый).

Titlebar
<titlebar>
x="15" y="41" w="210"
h="25"
orientation="0"
font="Tahoma"
point="12"
weight="700"
color="000000"
</titlebar>


Titlebar выводит название проигрываемой песни или сообщения-подсказки. Для него используются те же параметры, что и для timer.


Iconstatus
<iconstatus>
x="95" y="23" w="11" h="13"
<stop src="OTHER" x="22" y="75" />
<play src="OTHER" x="0" y="75" />
<pause src="OTHER" x="11" y="75" />
</iconstatus>


Отображает одно из трех изображений, в зависимости от текущего статуса воспроизведения: stop, play или pause. Iconstatus использует обычные параметры, определяющие положение и размер, а также 3 подраздела для описания каждого из статусов воспроизведения. Каждый подраздел содержит alias используемого изображения, а также координаты левого верхнего угла иконки внутри изображения.

Text
<text>
x="112" y="20" w="35" h="15"
id="BITRATE"
orientation="0"
font="Tahoma"
point="10"
weight="400"
color="000000"
</text>


Вы можете использовать этот элемент для отображения битрейта и частоты воспроизводимого файла. Используйте id="BITRATE" для отображения битрейта или id="SAMPLINGRATE" для отображения частоты.

Button
<button>
id="PLAY"
x="205"
y="142"
w="35"
h="75"
<released src="BACK" x="205" y="142" />
<pressed src="OTHER" x="0" y="0" />
</button>


Элемент button создает, как видно из названия, кнопку. Вы должны установить положение и размер кнопки, а также определить изображения для нажатой и отпущенной кнопки. Действие кнопки определяется параметром id. Ниже приведен список поддерживаемых id:
img-63314-pms1.gif

Checkbutton
<checkbutton>
id="XBASSONOFF"
x="12" y="102" w="35" h="35"
<state1>
<released src="BACK" x="12" y="102" />
<pressed src="BUTTONS" x="245" y="0" />
</state1>
<state2>
<released src="BUTTONS" x="280" y="0" />
<pressed src="BUTTONS" x="315" y="0" />
</state2>
</checkbutton>



Checkbutton создает кнопки, которые имеют два состояния — включено и выключено. Синтаксис этого элемента похож на синтаксис простой кнопки (button), но необходимо указывать два дополнительных изображения для отображения во втором состоянии. Список поддерживаемых id:

img-63315-pms2.gif

Slider
<slider>
id="SEEKBAR"
orientation="0"
x="10" y="67" w="220" h="24"
<released src="OTHER" x="70" y="0" w="40" h="24" mask_color="FF00FF" />
<pressed src="OTHER" x="70" y="24" w="40" h="24" mask_color="FF00FF" />
</slider>


Slider может быть использоваться для изменения громкости или для поиска позиции в файле. Параметры «x», «y», «w» и «h» определяют прямоугольник, который будет являться границами элемента. Также slider имеет параметр «orientation», который может принимать значения 0, 90, 180 или 270 градусов. При 180-градусной ориентации, slider будет выглядеть также, как и при 0 градусов, но минимальное и максимальное положения распложены на наоборот. Slider не имеет собственного фона, вместо этого использует ту часть общего фона (элемент background), которая ограничена рамками slider’а, поэтому все что вам требуется — указать изображения для движка. Движок имеет два состояния: нажатый и отпущенный. Также, он может быть частично прозрачным. Для того, чтобы сделать некоторые пиксели прозрачными, заполните их каким-либо уникальным цветом, а затем укажите его в параметре «mask_color».


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

Если у вас есть вертикальный или горизонтальный скин для PocketMusic и вы хотите им поделится с другими пользователями PocketMusic, можете отправить его на адрес pocketmusic@pocketmind.com. Удостоверьтесь, что вы включили скриншот скина, его навзание и ваше имя или никнейм.

Источник — PocketMusic Player Bundle User´s Guide

Пересено из форума "Мультимедиа" PocketMind PocketMusic (post #1264831)

Если кто знает как изменить кнопки, что отображаются на тудее - просьба отписаться - вопрос открыт - информации не нашли еще

Сообщение отредактировал Neadi - 24.12.07, 12:43



Реп: (104)
Мини фаг
1) создаем VGA P+L тему в ThemeGenCE
2) программой WinCE Cab Manager 2.1 открываем тему (правой кнопкой на файле с темой - открыть как – выбираем каб менеджер)
3) в левом столбики выбираем вкладку файлы и стираем их (их должно быть 4 штуки)
4) создаем на 4 картинки (ваши картинки на тудей и на старт меню) разрешение картинок должно быть 480х800 (две штуки) и 800х480(две штуки) в GIF вормате.
5) Переименовываем файлы. stwater_480_800 старт меню порт режим. stwater_800_480 старт меню ленд режим, tdywater_480_800 тудей валпаер порт режим, tdywater_800_480 тудей валпаер ленд режим.
6) Добавляем эти файлы в тему. В вкладке файлы в WinCE Cab Manager в правом окне щелкаем провой кнопкой и добавить.
7) После выделяем все файлы и щелкаем правой кнопкой и нажимаем свойства – расположение – и выбираем директорию windows.
8) Сохраняем и копируем на кпк.



истина всегда рядом....

Сообщение отредактировал Lestorest - 03.02.08, 13:26



Реп: (360)
Lect @ 28.02.08 05:53:08
Всем привет

Народ, научите нормально пользоваться ThemeGenCE, не могу сделать картинку под 90* и исправить обрезку меню пуск...

Объясняю!!!
У тебя так:
Прикрепленное изображение
А надо так:
Прикрепленное изображение
Вопросы? :)



Реп: (3)
Прошу помочь с редактированием скина диалера Gigabyte GSmart S1200 из вот этого моего поста. На всякий случай прилагаю ini файл, который я правил.

Нужно как то изменить порядок вывода элементов на экран чтобы история вызовов не налезала на кнопку стирания, но вот как это сделать? :comando:

Прикрепленные файлы

Прикрепленный файлPhLayout.ini ( 18.05 КБ )


Сообщение отредактировал KorneliyShnaps - 11.09.10, 23:56



Реп: (2)
Все получилось. Огромное спасибо, даже не знал, что это можно сделать. Чувствую себя чайником ;)


Полная версия   Текстовая версия

Помощь   Правила

Сейчас: 28.03.24, 13:04