Dodawanie interaktywnych komponentów w programie Flash Catalyst

• Może 16, 2024

W tym samouczku zakończymy pokaz slajdów portfolio w Adobe^R Lampa błyskowa^R Katalizator^R. Jeśli podążasz za nami, stworzyliśmy nasze przyciski i jesteśmy gotowi do dodania efektów specjalnych. Podczas poruszania się po portfolio chcemy, aby przycisk widocznego logo był przyciemniony, a pozostałe przyciski widoczne. Dlatego musimy powiedzieć Catalyst, który przycisk jest przeznaczony dla której strony i kiedy należy przyciemnić przyciski. Następnie dodamy efekt przejścia Fade między stronami.

Najpierw przyciemnimy przycisk bieżącego logo. Gdy logo 1 jest widoczne w stanie Strona1, chcemy przyciemnić odpowiedni przycisk. Musimy to zrobić dla wszystkich trzech stanów lub stron naszego portfolio.

1. Kliknij ikonę Strona 1 w panelu Strony / Stany, aby pracować na tej stronie. Kliknij miniaturę, która jest teraz naszym przyciskiem logo 1. W panelu Właściwości ustaw Krycie na 40. Ponieważ środek maty pod przyciskiem jest czarny, spowoduje to, że przycisk będzie wyglądał na przyciemniony.

2. Kliknij ikonę Strona2 w panelu Strony / Stany. Powtórz poprzedni krok dla strony 2, przyciemniając tylko przycisk pasujący do logo 2. Kliknij ikonę strony 3 w panelu Strony / Stany i powtórz ten krok.

Kliknij Plik - Uruchom projekt, aby przetestować nasz nowy efekt. Po kliknięciu przycisków odpowiednie logo powinno być widoczne, a przycisk ten powinien być przyciemniony.

Ostatnią rzeczą, którą dodamy do naszej nawigacji, jest Zanikanie Przejścia między stronami, przy użyciu Osi czasu. Wróć do strony 1, klikając ikonę strony 1. Spójrz na warstwy na osi czasu, a zobaczysz, że mamy warstwę dla każdego możliwego przejścia między wszystkimi trzema stronami.

Strona1> Strona 2
Strona1> Strona3
Strona2> Strona 1
Strona3> Strona 1

3. Kliknij warstwę Strona1> Strona2. Zobaczysz, że Catalyst dał nam opcje przejścia dla logo 1 i 2 (wygaszone) oraz przycisków 1 i 2. Ponieważ będziemy odchodzić od logo 1, mamy opcję Zanikania. Ale przejdziemy do logo 2. Dla tego logo mamy opcję Zanikania.

Dodamy tylko efekt Fade Out do logo 1 i efekt Fade In do logo 2. Nie potrzebujemy efektu Fade zastosowanego do naszych przycisków. Możesz jednak użyć tego efektu w innym projekcie.

Kliknij przycisk Płynne przejście u dołu osi czasu. Zobaczysz, że kontrolki Wycisz / Wejdź zostały rozszerzone do pół sekundy na wszystkich warstwach. Nadal na warstwie Strona 1> Strona 2 musimy wyłączyć efekt dla dwóch przycisków. Przesuń suwak w lewo dla każdego przycisku.

Kliknij warstwę Strona1> Strona3. Powtórz poprzedni krok dla dwóch przycisków i logo. Powtórz ponownie dla warstwy Strona 2> Strona 1 i warstwa Strona 3> Strona 1.

To zajmuje się wszystkimi przejściami dla stanu Page1. Ale w naszym portfolio mamy trzy stany. Musimy to zrobić ponownie dla pozostałych dwóch stanów. Kliknij ikonę Page2 w panelu Strony / Stany.

Spójrz na warstwy na osi czasu. Zauważysz, że ustawienia, które właśnie ustawiliśmy dla stanu Strony 1, zostaną przeniesione do stanu Strony 2 dla przejść między Stronami 1> Stroną 2 i Stroną 2> Stroną 3. Musimy tylko dodać przejście między Page2> Page3 a Page3> Page2.

4. Powtórz poprzednie kroki, aby zastosować przejścia do logo dla stanu Page2. Musisz to zrobić dla każdej warstwy na osi czasu.

5. Kliknij ikonę Page3 w panelu Strony / Stany. Zauważysz, że ustawienia przejścia zostały przeniesione z dwóch pozostałych stanów. Gdybyśmy mieli więcej stron, musielibyśmy pracować nad warstwami dla tego stanu. Ale ponieważ jest to ostatni z trzech stanów, wszyscy jesteśmy gotowi.

Sprawdź swój projekt jeszcze raz. Jeśli wszystko działa, jesteśmy gotowi zapisać nasz plik jako LogoPortfolio.fxp.

6. Musimy powiedzieć Catalyst, aby wygenerował pliki, które wyświetlą nasze portfolio Flash. Kliknij Plik - Opublikuj w SWF. Przejdź do właściwej lokalizacji na dysku twardym i zapisz projekt. Przekonasz się, że Catalyst daje dwa foldery. W folderze wdrażania do sieci mamy pliki potrzebne do uruchomienia portfolio na serwerze WWW. W wersji lokalnej mamy pliki do uruchomienia portfela na naszym komputerze.

Prawa autorskie 2018 Adobe Systems Incorporated. Wszelkie prawa zastrzeżone. Zrzuty ekranowe produktów Adobe zostały przedrukowane za zgodą 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 i Flash Paper jest / są [a] zarejestrowanym znakiem towarowym lub znakami towarowymi Adobe Systems Incorporated w Stanach Zjednoczonych i / lub innych krajach.

Instrukcje Wideo: 8-bit computer update (Może 2024).