Создание скинов Поделиться Опции

[DeshFXs]

Постепенно тема стала местом обсуждения не самих скинов, а той их части, которые выводятся на дисплей с помощью Scalable Vector Graphics.
SVG в zn5. Где и что...
Дополнительные режимы отображения Главного и Подменю.
Анимация фона Главного меню и SVG-подменю.
Цвет и размер надписей в Главном и svg-Подменю. Размер и прозрачность софт-клавиш. Смотрим colors.css

Вот это должно помочь всем кто создает скины
1) .ini файлы скинов, подробное описание
2)

ini_files.rar   ( 47.5 килобайт ) Кол-во скачиваний: 872

3)

Making_skins.rar   ( 657.48 килобайт ) Кол-во скачиваний: 1328

Программное обеспечение для упаковки и распаковки файлов ICONRES:
MotoLinux iconres composer 1.1.1


Сообщение отредактировал AstaRoth - 5.4.2011, 8:29

[Yonodmc]

TiM_22R, ты реально крут!!! таких фишек с меню я не видел ещё нигде!!! и вот у меня как у пользователя ем30 (в скором времени е8) созрел вопрос: а не мог бы ты свои фишки делать ещё и для выше указанных моделий???

[andrey_moto]

TiM_22R, ты реально крут!!! таких фишек с меню я не видел ещё нигде!!! и вот у меня как у пользователя ем30 (в скором времени е8) созрел вопрос: а не мог бы ты свои фишки делать ещё и для выше указанных моделий???

кури тему про скины в ветке е8. Тим имел возможность там выкладывать то, что сделал.

[TiM_22R]

Тем, кто хочет изменить по своему вкусу скорость "скольжения" курсора и сетки я опишу, как это сделать. Понадобится редактор типа NotePad++. Открываем в нём наш svg...
За продолжительность анимации отвечает параметр dur. Его значения можно записывать как в секундах, так и в миллисекундах: dur="0.25", dur="1", dur="250ms", dur="1000ms". Для изменения скорости курсора ищем следующие строки

Код

<animateTransform id="MoveLf" type="translate" ... dur="..." />
<animateTransform id="MoveRg" type="translate" ... dur="..." />
<animateTransform id="MoveDw" type="translate" ... dur="..." />
<animateTransform id="MoveUp" type="translate" ... dur="..." />

Скорость скольжения меню прописана чуть ниже

Код

<use id="main" xlink:href="#iconsDef" ... >
   <animateTransform type="translate" id="MvUp" ... dur="..." begin="indefinite"/>
   <animateTransform type="translate" id="MvDw" ... dur="..." begin="indefinite"/>
  </use>

Остаётся подставить свои значения в параметр dur (с соблюдением всех пробелов, двоеточий и т.п.!) и, сохранив файл, закинуть его в телефон. Удачи!

Сообщение отредактировал TiM_22R - 11.12.2009, 9:36

[Entom]

TiM_22R, подскажи а какая кодировка используется в .svg?

[TiM_22R]

svg-это обычный (Win/DOS) текст. Я пользуюсь Notepad++ с кодировкой ANSI с включённым UNIX-форматом. Хотя Win или UNIX, в данном случае, не имеет разницы.

[TiM_22R]

Ну вот, сегодня мой скромный юбилей. 5 ЛЕТ на МОТОФАНЕ - ни дня без MOTOROLA!
Всему, что знал (но, увы, уже забыл), знаю и, надеюсь, ещё узнаю о телефонах этой компании, я обязан МотоФану. За что ему низкий поклон и человеческое спасибо!
С наилучшими пожеланиями прошлым, нынешним и будущим участникам форума - Темури Шотович,
более известный в узких кругах как TiM_22r.
Прошу всех к столу...компьютерному

АНИМАЦИЯ ФОНА ГЛАВНОГО и ПОДМЕНЮ. поПЫТКА-2
Для начала. Это не полноценная замена GIF, а его жалкоподобная эмуляция.
В отличие от прошлого раза, смена кадров происходит не встроенными средствами svg, а скриптом с таймером. На этот раз удалось избавиться от "заеданий" и "сбивки" раскадровки. Если начинает тормозить, то тормозит вместе со всем телефоном.
Кстати, само по себе подменю работает медленее и что бы выравнять скорости анимации, пришлось установить задержку таймера в подменю в 1 (если поставить 0, то будет уж больно быстро )
Количество кадров может быть от 1 до 40. По умолчанию стоит 20. Именно столько кадров в gif, который создаёт программа анимации статичных изображений Sqirlz Water Reflections. Остаётся без лишних телодвижений в ImageReady CS экспортировать gif в jpg-кадры с автоматической нумерацией. Что бы изменить количество кадров, нужно в функции Animation изменить значение переменной maxframe .
Собственно сами кадры с именами 1.jpg,2.jpg... должны находиться в папке /usr/SYSqtapp/xe/resource/skins/default/media/images
(там же, где и картинки фона меню fl_mm_bg.png). Важный момент. Так как изначально этих jpg в в images нет, то нужно будет примонтировать всю папку images с файлами целиком. Хотя картинки могут быть в любом другом удобном для вас месте - нужно будет изменить путь в файле. Кстати, файлы могут быть не только jpg (но расширение именно таким). В некоторых случаях я прогоняю jpg через Paint (открыть/сохранить/закрыть). Он удаляет из файла всю избыточную информацию, что значительно уменьшает вес файла без заметного ухудшения качества. Собственно всё... Ах, да! О пресловутой "универсальности". Файл может выводить анимированный фон, фон в Подменю (fl_sm_bg.png) и один фон для главного/подменю (fl_mm_bg.png). Всё зависит от наличия этих файлов.
С искренним уважением - Тим.
P.S. Если у вас нет помидор (не сезон, кризис и т.п.) - можно брызгаться кетчупом.

main_view_RUS_1_.svg.rar   ( 9.08 килобайт ) Кол-во скачиваний: 282

main_view_INT_1_.svg.rar   ( 8.79 килобайт ) Кол-во скачиваний: 261

Кое-что сам слепил, что-то из найденого...

abstract.rar   ( 110.35 килобайт ) Кол-во скачиваний: 142

abstract_2.rar   ( 56.58 килобайт ) Кол-во скачиваний: 135

abstract_3.rar   ( 67.15 килобайт ) Кол-во скачиваний: 133

crazy.rar   ( 129.54 килобайт ) Кол-во скачиваний: 133

Fire.rar   ( 120.46 килобайт ) Кол-во скачиваний: 133

fires.rar   ( 34.75 килобайт ) Кол-во скачиваний: 136

gold.rar   ( 169.91 килобайт ) Кол-во скачиваний: 204

fish.rar   ( 228.89 килобайт ) Кол-во скачиваний: 147

graphic.rar   ( 150.6 килобайт ) Кол-во скачиваний: 147

nature.rar   ( 143.88 килобайт ) Кол-во скачиваний: 137

noname_1.rar   ( 203.69 килобайт ) Кол-во скачиваний: 139

noname_2.rar   ( 136.49 килобайт ) Кол-во скачиваний: 149

Perfection.rar   ( 191.11 килобайт ) Кол-во скачиваний: 154

rain.rar   ( 217.65 килобайт ) Кол-во скачиваний: 151

rotate_1.rar   ( 73.88 килобайт ) Кол-во скачиваний: 131

rotate_2.rar   ( 91.73 килобайт ) Кол-во скачиваний: 133

snow.rar   ( 167.44 килобайт ) Кол-во скачиваний: 204

vista.rar   ( 149.53 килобайт ) Кол-во скачиваний: 134

Сообщение отредактировал TiM_22R - 1.1.2010, 11:53

[EXL]

Спасибо большое за все твои разработки!
Очень красиво всё получилось!

Сообщение отредактировал EXL - 13.12.2009, 10:04

[Entom]

Вот это класс. И главное без тормозов! Ай спасибо.

[TiM_22R]

...чтоб main_view не определенное количество кадров умел показывать,а сколько закинул в папку столько и отображает...

Разумеется, я б это сделал. Нужно всего-то проверить наличие/отсутствие файла, но, повторюсь, в нашем варианте JS не умеет работать с файловой системой (или мне не известен синтаксис)
P.S. Сегодня обнаружил механическую ошибку в нумерации линков. Исправил. Если надумаете ставить больше 30 кадров-лучше скачать по-новой. Дико извиняюсь

[Entom]

TiM_22R, ты конечно вообще молодчага, но есть один не большой минусик.
У меня есть классные гифки-картинки, но в них кадров меньше, чем 20. Я поставил такую - все работает, но вот там, где не хватает картинок - серый фон появляется.
Пожелание: можно ли сделать, что б количество кадров начиналось от 5, а не от 20?

[V!iT]

в подразделе анимация
var maxframe=...; вставь свое число. Вроде прокатывает! у меня

[smaylik]

TiM_22R можешь объяснить что отвечает за скольжение меню, пытаюсь на е8 сделать 4х2

[TiM_22R]

rotate_3.rar   ( 164.21 килобайт ) Кол-во скачиваний: 123

fire_2.rar   ( 109.04 килобайт ) Кол-во скачиваний: 111

[kimifan316]

@TiM_22R : Can you make unlimited menu items in grid svg for E8?
Have attached the stock grid.svg from E8.
I tried to modify your ZN5 ones but the logic was a little complex.

[TiM_22R]

...Достало ума реализовать давнишнюю задумку сделать отражение с плавным изменением прозрачности. Немного неказисто и громоздко в плане кода... Ещё вспомнил про вращение иконки. Что б усилить эффект для иконок, нарисованных с трансформациями (перспектива, наклон и пр.) пришлось крутить и рамку с фоном. При удачном сочетании с фоном меню - ничего так Мож приглянется кому. Пока 3х3.

grid_slider_mirr_rotate.svg.rar   ( 27.9 килобайт ) Кол-во скачиваний: 290

[Entom]

Бомбовски сделал!
Жду 3х4

[Entom]

TiM_22R, у меня к тебе просьба будет: можешь в main_view сделать часы в сс не белого, а черного цвета?
Или скажи как и где, а то искал и не нашел. Спс.

[TiM_22R]

TiM_22R, у меня к тебе просьба будет: можешь в main_view сделать часы в сс не белого, а черного цвета?
Или скажи как и где, а то искал и не нашел. Спс.

В конце файла:

Код

<g id="Digital" transform="translate(1.5 0)">
   <textArea id="Date" width="102" transform="translate(34 7) scale(.98 1)" text-align="center" fill="#fff" stroke="none" font-size="19" font-weight="100"/>
   <textArea id="Time" width="70" transform="translate(137 7) scale(.98 1)" text-align="center" fill="#fff" stroke="none" font-size="19" font-weight="100"/>
</g>

fill ="#fff" заменить на fill="#000" или любой цвет в шестнадцатеричной форме. Один нюанс. Перед этими строками есть блок "DigitalBg" - тень текста. Если мешать будет, то в нём так же заменить fill="#000" на fill="none". Можно было и "закомментировать" этот блок, но его использует скрипт - будут глюки...

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

grid_3x4_.svg.rar   ( 30.05 килобайт ) Кол-во скачиваний: 297

[V!iT]

Ну ты молодец!!:) И чтоб Зина без тебя делала?!??::)
А если забацать,как ты когда то делал,как типо клетка крутится вокруг иконки+плавное перемещение!:)
думаю код там будет сумасшедший,но для тебя это пустяк

[Entom]

TiM_22R, спасибо, что поянил.
И еще вопрос: как уменьшить размер софт-клавишь, а то пробовал - так обрезается, а мне нужно именно уменьшить высоту где то до 15 пкс.

Сообщение отредактировал Entom - 23.12.2009, 19:20

[TiM_22R]

V!iT, попробую ещё 4х4 для полного комплекта, а потом и рамку гляну...
Entom, есть ставший уже "стандартным" способ через colors.css.

****************************************************
Softkeys
AIA
PopUp Header & Midlet Screen header
****************************************************/
.textSftkySel { fill: #E5EFFA; font-weight: light; font-size: 19; opacity: .8;}
.textSftkyStd { fill: #FFF; font-weight: light; font-size: 20; height: 30;opacity: .8;}

Параметров, выделенных жирным в файле нет (в стоке точно). Высота ВСЕХ клавиш одновременно зависит от значения параметра height в классе .textSftkyStd. А вот параметры шрифта: fill - цвет, font-weight - "жирность" (light/normal/bolder/bold) и font-size - размер шрифта можно устанавливать для НОРМАЛЬНАЯ/НАЖАТА по отдельности. Параметр opacity (от 0 до 1) отвечает за прозрачность самих софт-клавиш (не текста).
ВАЖНО! На стандартном (из коробки) main_view.svg это не работает и не устанавливать height меньше 1 - пропадёт само меню ФУНКЦИИ.

Сообщение отредактировал TiM_22R - 24.12.2009, 3:22

[TiM_22R]

От высказываний вроде "В тесноте, да не в обиде" воздержусь. Ничего лучше не придумал

grid_4x4_slider_mirr_rotate.svg.rar   ( 32.82 килобайт ) Кол-во скачиваний: 265

[TiM_22R]

Всяка всячина...
Тем, кому мешает "входная анимация" в меню и для ускорения входа в Главное Меню могу предложить файл mainmenu.js, в котором выключена процедура "перезагрузки" при каждом входе в ГМ. Режим "Пользователь" включен. (если он вам нужен).
/usr/SYSqtapp/xe/flows/mainmenu/mainmenu.js

mainmenu.rar   ( 4.31 килобайт ) Кол-во скачиваний: 265

******************************

"Сползающие" под экран софт-клавиши. Появляются при входе и нажатии. Тут два варианта...
Если использовать только softkeys.svg, то даже после "сползания" клавиш место под ними останется недоступным для вывода изображений. Иначе понадобится ещё и main_view.svg с изменёнными слоями (часы/анимация фона есть). Высота клавиш - в colors.css. Оба файла в /usr/SYSqtapp/xe/resource/skins/default/view/*.svg

softkeys.svg.rar   ( 3.34 килобайт ) Кол-во скачиваний: 255

main_view.svg.rar   ( 10.18 килобайт ) Кол-во скачиваний: 295

Сообщение отредактировал TiM_22R - 28.12.2009, 7:38

[Neomoto]

Тим, а можешь по максимуму вырезать все свистелки и перделки (анимации, переходы, трансформации и т.д.), всё, по максимуму, даже комменты, из файлов меню, главное чтобы оно загружалось и работало?
Извини что прошу, а не делаю сам - у тебя опыта в ковырянии меню на порядок больше.

Сообщение отредактировал Neomoto - 28.12.2009, 17:17

[TiM_22R]

В очередной раз приходится отказываться от идей из-за тормозов телефона. И дело не столько в размерах изображений, а в их количестве. Вот и сейчас эта "геометрия" состоит из 8 отдельных элементов. А если ещё прикрутить "исчезающее отражение", состоящее из более 10 узких "нарезок" - всё, туши свет.

grid_frame.svg.rar   ( 28.23 килобайт ) Кол-во скачиваний: 306

По спецзаказу
Сетка 3х5 без какой-либо анимации.

grid_3x5_no_anim.svg.rar   ( 15.84 килобайт ) Кол-во скачиваний: 285

Сообщение отредактировал TiM_22R - 29.12.2009, 8:06

[Karaban]

Красиво спасибо Тим:)

[TiM_22R]

Не в тему... Как-то на mmus.us не очень-то любят упоминать, откуда взяты "исходники"...

[EXL]

Не в тему, TiM_22R, в какой именно теме/темах, кинь в личку )

Сообщение отредактировал EXL - 31.12.2009, 6:45

[Entom]

Не в тему... Как-то на mmus.us не очень-то любят упоминать, откуда взяты "исходники"...

терпеть не могу этих китаез (или буржуев?), постоянно хотят что-то себе приханырить.
А ты вот молодчага.
Очень нравится эффект в меню - сползание софт-клавишь вниз.
У меня уже давно есть мечта - как то сделать часы в сс (там где она ,конечно, есть).

[Neomoto]

скиноделы, как изменить высоту софт-клавиш в главном меню?
перековырял main_view.svg, softkeys.svg, colors.css - все, чего добился - сделал почему-то только на правой( ) клавише шрифт меньше.

[TiM_22R]

Neomoto , на предыдущей странице смотрел? Всё работает! (Но не на "стоковом" main_view.svg.). Или уж в main_view.svg

Код

<!--SOFTKEY AREA-->
<g moto:bbox="#softkeys">
    <foreignObject id="softkeys" class="textSftkyStd" x="0" y="0" width="100%" height="31" />

height="..." - высота... ( (class="textSftkyStd"- в стоке нет (лучше не ставить, для этого надо ещё кое-что подправить) )
*********************************************
В продолжение "поползновений" - теперь исчезают иконки сигнала, батареи и др. Иконки появляются на короткое время при изменении их статуса. Если сигнала нет или батарея разряжена - иконки останутся на дисплее.
/usr/SYSqtapp/xe/resource/skins/default/view/***.svg
Одно печально - работает только в svg-меню

status_battery.svg.rar   ( 10.85 килобайт ) Кол-во скачиваний: 236

status_signal.svg.rar   ( 9.68 килобайт ) Кол-во скачиваний: 350

Сообщение отредактировал TiM_22R - 1.1.2010, 16:49

[Neomoto]

TiM_22R, конечно смотрел.. Косяк в том что видимо в новом Evo 0.6 как раз таки стоковый

[V!iT]

Тим заделай плиз вот этот пост сеткой 3х4
и еще 2 просьбы:)
1. Сделать спинер такой же,с геометрией,только опустить нижние иконки пониже.Хочу чтоб классно было,кода нет софт клавишь!
2. Вид- Список,сделать вроде на 4 пункта,ты уже делал такое,но он глючит,надо его по последнему слову техники сделать::))
С Новым Годом тебя!!!:)

[TiM_22R]

TiM_22R, конечно смотрел.. Косяк в том что видимо в новом Evo 0.6 как раз таки стоковый

Ясно...Не думаю, что там на 100% стоковый (в таком фон состоит из 4-х частей в верхней половине экрана). Что б не искать в теме, выкладываю файлик безо всяких там "свисто-перделок" © с одним фоном 240х320 и с вкл. регулировкой высоты клавиш через colors.css (Если что, в ЛС)

main_view_std.svg.rar   ( 2.06 килобайт ) Кол-во скачиваний: 267

V!iT, работы на весь отпуск А что по п.2 глючит? (Ещё бы найти, где этот файл есть...)
Что-то глючит ссылка на пост... 3х4 - имеется ввиду Сетка с "геометрией"? Из Спиннера скроллбар внизу убрать?

Всех с Новым годом и Рождеством!

Сообщение отредактировал TiM_22R - 2.1.2010, 5:43

[EXL]

Ясно...Не думаю, что там на 100% стоковый (в таком фон состоит из 4-х частей в верхней половине экрана). Что б не искать в теме, выкладываю файлик безо всяких там "свисто-перделок"

Да, там состоит по частям: в нижней части картинка (Из 4-х частей), а верх кажется просто залит color=black
---------------------------------------------------------------
TiM_22R,
Спасибо за файлик, поставил такой фон, получилось достаточно красиво, в тему скина kodak
Высоту клавиш оставил неизменной как в стандарте - 36

Сообщение отредактировал EXL - 2.1.2010, 10:22

[V!iT]

так я ж не говорю,не спи весь отпуск,зажги свечу и сиди делай!!:)
Как время есть,удели внимание та и все
ага,сетка с геометрией плавной,последняя твоя разработка которая,вроде.
Нет нет,из спинера ничего не убирай,просто нижние иконки опусти пониже,почти там где софт клавиши.
Список прикрепил!

Тим. Список я нашёл. Вот только облом-с выходит. Т.к. в списках встроенная функция вывода, то скрипты не работают. Т.е. хотел сделать плавное скольжение и пр. - не выходит. Что ещё с ним можно сделать - не знаю

Внешне он меня устраивает,просто сделать его чтоб он стабильно работал.Ни добавляя переходов плавных и т.д. Реально такое?? Про спинер еще не забудь. За ранее благодарен!

Сообщение отредактировал V!iT - 2.1.2010, 12:12

[TiM_22R]

grid_3x4_frame_slider.svg.rar   ( 30.63 килобайт ) Кол-во скачиваний: 286

Из возможных причин глюков нашёл и исправил одну
Для Подменю переименовать в list.svg

iconList.svg.rar   ( 3.9 килобайт ) Кол-во скачиваний: 256

Сообщение отредактировал TiM_22R - 2.1.2010, 12:33

[TiM_22R]

Вариант 1 - "нормальный"


Вариант 2 - для "сползающих с освобождением места" софт-клавиш (или вообще без них). Вот

tabs_1.svg.rar   ( 23.91 килобайт ) Кол-во скачиваний: 217

tabs_2.svg.rar   ( 23.72 килобайт ) Кол-во скачиваний: 295

Сообщение отредактировал TiM_22R - 3.1.2010, 5:59

[SanchoNT]

последний iconList.svg понравился, сделал его в подменю, только вот не понял почему у меня теперь в подменю два скролбара

Сообщение отредактировал SanchoNT - 3.1.2010, 11:27

[Entom]

TiM_22R, я вот насчет последнего grid: так и не понял, что ты там сделал?