Фаде-ин ефект за апликацију Квик 2 Сторибоок


Линеарна анимација може се користити за стварање многих ефеката у вашим књигама. У нашем примјеру пројекта, прича позива да се небо нагло поцрне због олује. Можемо користити Линеарну анимацију и функцију Сакриј слој да створимо тај ефекат на позадини сцене.

Користићемо две позадинске графике које су идентичне осим боје неба. Као и код свих страница у апликацији, почетна графика позадине је на доњем слоју у панелу Слојеви и има плаво небо. Позадина која се бледи имаће тамније небо. Пошто ће друга позадина бити на слоју непосредно изнад почетног позадинског слоја, добијамо илузију да је небо постало тамније јер други слој постепено постаје непрозиран (100% алфа).

Као што можете видети из .псд датотеке за извлачење, за ово ће бити потребно да на овој страници имамо две графике које су у пуној величини екрана. Као што смо већ споменули, велика графика може користити пуно меморије што може бити проблематично. Међутим, помоћи ће вам да се ова два слоја експортирају као јпг слике, задржавајући величину датотеке на минимуму.

Користићемо функцију Квик Линеар Аниматион, као што смо урадили и са анимацијом окретања страница. Али овај пут нећемо ништа померати по слоју. Променићемо непрозирност слоја са 0% на 100%. Стварање овог ефекта затамњења је процес у два корака.

Прво, морамо креирати линеарну анимацију која ће се појавити у другој графици позадине док не буде у потпуности видљива (100% алфа). Да би слој полако постао видљив током 3 секунде, морамо рећи Квик-у да слој учини невидљивим на почетку анимације. Стога је наш други корак употреба функције Сакриј слој да се тај слој у почетку сакрије.

Отворите свој пројекат у Пхотосхопу.

  1. У нашем примјеру пројекта, страница 11 ће садржавати анимирану анимацију. Изаберите страницу11 у одељку Страница / Компоненте на Квик панелу. Требали бисте видети „@ паге11“ на врху дела

  2. Отворите моцкуп .псд датотеку за ту страницу и копирајте други позадински слој.

  3. Вратите се на страницу11.псд датотеку и одаберите доњи слој. У програму Пхотосхоп Менубар кликните на дугме Уреди - Налепи да бисте додали нови слој изнад доњег слоја који садржи другу позадину из макетне датотеке. Именујте нови слој "фадеТоДарк".

    Морамо да кажемо Квик-у да овај слој извози у облику јпг.

  4. На панелу Квик кликните на Икона слојева и замјена на траци Категорије.

  5. Када је слој фадеТоДарк још увек изабран, кликните на Алат Својства слоја у групи алата.

  6. У дијалошком оквиру потврдите избор у пољу за извоз слике као јпг и сачувајте.

    Сада овом слоју можемо додати фаде анимацију.

  7. Кликните на Икона анимације на траци Категорије.

  8. Кликните на Алат за линеарну анимацију у групи алата.

  9. У дијалошком оквиру Линеарна анимација држите одабран слој фадеТоДарк.

  10. Иако за овај ефекат користимо Линеарну анимацију, нећемо мењати положаје Кс и И за овај слој. Задржите тренутна подешавања.

  11. Трајање: Задржите ово подешавање на 3 секунде и 0 одлагања.

  12. Желимо да кажемо Квик-у да бледи слој до 100% алфе. Пошто ће слој на почетку бити постављен на 0% алфа, Квик ће знати да повећа проценат непрозирности на 100% током 3 секунде трајања. Задржите Алфа поставку на 100%.

  13. Петља: Ову анимацију ћемо репродуцирати само једном. Изаберите радио дугме Тимес и подесите број петље на 1.

  14. Почиње: Желимо да анимација почне одмах када се страница покрене.

  15. Кликните на Креирај.

    Сада морамо прво поставити слој фадеТоДарк на прозирност од 0%.

  16. Када је слој фадеТоДарк још увек изабран, кликните на Икона пројекта и странице на траци Категорије.

  17. Кликните Сакријте алат Лаиер, Гроуп или Паге у групи алата.

  18. У дијалошком оквиру Сакриј елемент задржите поставку фадеТоДарк и кликните на Креирај.

  19. На Пхотосхоп Менубар-у кликните на Филе - Саве да сачувате своје промене у страници .псд датотеке.
Изменили смо само једну страницу апликације. Дакле, само морамо поново извести ту страницу. Кликните Извези икону само за тренутну страницу на траци статуса. Затим кликните Објави.

Када је ваша апликација отворена у симулатору, помоћу дугмета Пагес отворите навигациону траку и одаберите сличицу странице11. Док се страница учитава, требали бисте видети како се небо потамни.

Идите у мапу ЛеарнКвик и направите резервну копију мапе пројекта предлошка. Преименујте резервну мапу додавањем тренутног датума до краја. (ПредложакММ-ДД-ИИ).

Ауторска права 2018. Адобе Системс Инцорпоратед. Сва права задржана. Снимке екрана Адобе производа поново су одштампане уз дозволу компаније Адобе Системс Инцорпоратед. Адобе, Пхотосхоп, Пхотосхоп Албум, Пхотосхоп Елементс, Иллустратор, ИнДесигн, ГоЛиве, Ацробат, Цуе, Премиере Про, Премиере Елементс, Бридге, Афтер Еффецтс, ИнЦопи, Дреамвеавер, Фласх, АцтионСцрипт, Фиреворкс, Цонтрибуте, Цаптивате, Фласх Цаталист и Фласх Папер је или су регистровани заштитни знак или заштитни знак компаније Адобе Системс Инцорпоратед у Сједињеним Државама и / или другим земљама.
Производ Квик, логотип Квик и Квиксхер су својства Квиксхер.цом - Цопиригхт 2011.Снимке екрана које се користе уз дозволу.

Ови водичи су за старију верзију Квик 2 и можда вам неће бити од велике помоћи када користите Квик 3 и новије верзије. Ако имате проблема, користите Квик форум.

JavaScript for Web Apps, by Tomas Reimers and Mike Rizzo (Јули 2021)



Ознаке Чланак: Фаде-ин ефекат за апликацију Квик 2 Сторибоок, дигиталну уметност и дизајн, Квик 2 туторијале књига књига приповедака фаде анимација линеарни слој скривања