Добавяне на интерактивни компоненти в Flash Catalyst

• Април 25, 2024

В този урок ще завършим слайдшоуто на портфолиото в Adobe^R флаш^R катализатор^R, Ако сте следвали, ние направихме нашите бутони и сме готови да добавим специалните ефекти. Докато се движим из портфолиото, искаме бутонът за видимото лого да бъде затъмнен, а останалите бутони да се виждат. Затова трябва да кажем на Catalyst кой бутон е за коя страница и кога да затъмняваме бутоните. След това ще добавим ефект на преход на избледняване между страниците.

Първо ще затъмним бутона за текущото лого. Когато лого 1 се вижда в страницата Page1, искаме бутонът за съвпадение да бъде затъмнен. Трябва да направим това за трите държави или страници от нашето портфолио.

1. Щракнете върху иконата Page1 в панела Pages / States, за да работите върху тази страница. Кликнете върху миниатюрното изображение, което сега е бутонът ни за лого 1. В панела Свойства задайте Непрозрачността на 40. Тъй като центърът на постелката под бутона е черен, това ще направи бутонът да е затъмнен.

2. Кликнете върху иконата Page2 в панела Pages / States. Повторете предишната стъпка за Page2, като затъмните само бутона, който съответства на логото 2. Щракнете върху иконата Page3 в панела Страници / Съвети и повторете тази стъпка.

Щракнете върху File - Run Project, за да тестваме новия ни ефект. Когато щракнете върху бутоните, съответното лого трябва да се вижда и този бутон трябва да бъде затъмнен.

Последното нещо, което ще добавим към нашата навигация, е избледняване на прехода между страниците, използвайки времевата линия. Върнете се на Page1, като щракнете върху иконата Page1. Погледнете слоевете в Timeline и ще видите, че имаме слой за всеки възможен преход между трите страници.

Страница1> Страница2
Страница1> Страница3
Страница2> Страница1
Page3> Page1

3. Кликнете върху Page1> Page2 слой. Ще видите, че Catalyst ни предостави опциите за преход на лога 1 и 2 (притъмнени) и бутони 1 и 2. Тъй като ще се отдалечим от лого 1, имаме опция за избледняване. Но ще преминем към лого 2. Имаме опция Fade In за това лого.

Ще добавим само ефекта Fade Out към лого 1 и Fade In ефект към логото 2. Не се нуждаем от ефекта Fade, приложен към нашите бутони. Можете обаче да искате да използвате този ефект в друг проект.

Кликнете върху бутона за гладък преход в долната част на времевата линия. Ще видите, че контролите Fade Out / In са разширени до една половина секунда на всички слоеве. Все още на слоя Page1> Page2 трябва да изключим ефекта за двата бутона. Натиснете плъзгащото управление вляво за всеки бутон.

Кликнете върху слоя Page1> Page3. Повторете предишната стъпка за двата бутона и лога. Повторете отново за слоя Page2> Page1 и слоя Page3> Page1.

Това се грижи за всички преходи за състоянието Page1. Но в нашето портфолио имаме три държави. Трябва да направим това отново за другите две държави. Кликнете върху иконата Page2 в панела Страници / Състояния.

Обърнете внимание на слоевете във времевата линия. Ще забележите, че настройките, които току-що настроихме за състояние Page1, се пренасят в състояние Page2 за преходите между Page1> Page2 и Page2> Page3. Просто трябва да добавим прехода между Page2> Page3 и Page3> Page2.

4. Повторете предишните стъпки, за да приложите преходите към лога за състояние Page2. Трябва да направите това за всеки слой от времевата линия.

5. Щракнете върху иконата Page3 в панела Pages / States. Ще забележите, че настройките на прехода са се пренесли от другите две състояния. Ако разполагахме с повече страници, ще трябва да работим върху слоевете за това състояние. Но тъй като това е последното от трите състояния, всички сме готови.

Тествайте проекта си отново. Ако всичко работи, ние сме готови да запишем нашия файл като LogoPortfolio.fxp.

6. Трябва да кажем на Catalyst да генерира файловете, които ще показват нашето Flash портфолио. Щракнете върху Файл - Публикуване на SWF. Прегледайте правилното местоположение на вашия твърд диск и запазете проекта си. Ще видите, че Catalyst ви дава две папки. В папката за разгръщане към уеб имаме файловете, необходими за стартиране на портфолиото на уеб сървър. В локалния цикъл имаме файловете за стартиране на портфолиото на нашия десктоп.

Copyright 2018 Adobe Systems Incorporated. Всички права запазени. Екран (и) на екрана с продукти на Adobe препечатани с разрешение от Adobe Systems Incorporated. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst и Flash Paper е или са [a] регистрирана търговска марка (и) или търговска марка (и) на Adobe Systems Incorporated в Съединените щати и / или други страни.

Инструкции Видео: Building Dynamic Web Apps with Laravel by Eric Ouyang (Април 2024).