Przekształcanie grafiki w przyciski w programie Flash Catalyst

• Może 6, 2024

Teraz, gdy zaimportowaliśmy nasz plik projektu portfela PhotoshopLayout.psd do Adobe^R Lampa błyskowa^R Katalizator^TM i zbadaliśmy przestrzeń roboczą Catalyst, jesteśmy gotowi do pracy nad nawigacją dla naszego portfolio.

W tej chwili mamy tylko jedną stronę lub stan naszego projektu. Musimy utworzyć jeszcze dwie strony, abyśmy mogli wyświetlać inne logo na każdej stronie.

1. W panelu Strony / Stany klikniemy dwukrotnie przycisk Duplikuj stany. To da nam Page2 i Page3. Ale wszystkie są do siebie podobne. Zajmijmy się tym.

2. Kliknij ikonę Strona 1 i przejdź do panelu Warstwy. Otwórz folder Logos. Chcemy, aby logo 1 było widoczne tylko na tej stronie. Wyłącz widoczność logo 2 i 3.

3. Kliknij ikonę Strona2 i wyłącz widoczność logo 1 i 3. Włącz widoczność logo 2.

4. Kliknij ikonę Strona3 i wyłącz widoczność logo 1 i 2. Włącz widoczność logo 3.

Następnie stworzymy przyciski dla naszego portfolio. Dla każdego logo mamy miniaturę. To będą przyciski.

5. Wróć do strony 1, klikając ikonę w panelu Strony / stany. W panelu Warstwy otwórz folder Miniatury. W obszarze roboczym kliknij miniaturę, aby wyświetlić logo 1. Po wykonaniu tej czynności zobaczysz otwarty interfejs i panel Właściwości się zmieni.

Najpierw pracujmy w interfejsie. W tym miejscu powiemy Catalyst, że chcemy przekształcić ten obraz bitmapowy w przycisk.

6. W obszarze Konwertuj grafikę kliknij opcję Konwertuj grafikę na komponent i wybierz przycisk z listy komponentów. Interfejs zmieni się, aby dać nam nowe możliwości sterowania naszym przyciskiem. Rozwiń listę Interakcje niestandardowe, a następnie kliknij ikonę Plus. Wybierz z listy opcję Kliknięcie. Otrzymasz kolejne menu rozwijane o nazwie Do Action. Z tego menu wybierz Odtwórz przejście do stanu. Z menu rozwijanego Wybierz stan wybierz Strona 1, ponieważ chcemy, aby ten przycisk przeniósł przeglądarkę na stronę 1.

7. Kliknij miniaturę logo 2 i powtórz poprzedni krok. Ustaw Wybierz stan na Strona 2.

8. Kliknij miniaturę logo 3 i powtórz poprzedni krok. Ustaw Wybierz stan na Strona3.

Przetestujmy nasze przyciski. Z paska menu kliknij Plik - Uruchom projekt. Otworzy się w przeglądarce internetowej. Po kliknięciu każdego przycisku powinno być widoczne prawidłowe logo.

W następnym samouczku przyciemnimy przycisk widocznego logo i dodamy przejście między stronami.

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: Flash - Tworzenie kształtów (Może 2024).