Podręcznik użytkownika Anuluj

Szablony publikowania w formacie HTML

  1. Podręcznik użytkownika programu Adobe Animate
  2. Wprowadzenie do programu Animate
    1. Nowości w programie Animate
    2. Słownik wizualny
    3. Wymagania systemowe programu Animate
    4. Skróty klawiaturowe programu Animate
    5. Praca z wieloma typami plików w programie Animate
  3. Animacja
    1. Podstawowe informacje o animacjach w programie Animate
    2. Korzystanie z klatek i klatek kluczowych w programie Animate
    3. Animacja klatka po klatce w programie Animate
    4. Praca z animacjami klasycznymi w programie Animate
    5. Narzędzie Pędzel
    6. Linie pomocnicze ruchu
    7. Animacje ruchu a język ActionScript 3.0
    8. Informacje o animacji ruchu
    9. Animacje ruchu
    10. Tworzenie animacji ruchu
    11. Używanie klatek kluczowych właściwości
    12. Animowanie położenia za pomocą klatek pośrednich
    13. Edytowanie animacji ruchu za pomocą Edytora ruchu
    14. Edytowanie ścieżki ruchu animacji
    15. Operacje na animacjach ruchu
    16. Dodawanie własnych krzywych dynamiki
    17. Tworzenie i stosowanie ruchów predefiniowanych
    18. Konfigurowanie zakresów animacji
    19. Praca z animacjami ruchu zapisanymi jako pliki XML
    20. Porównanie animacji ruchu i animacji klasycznych
    21. Animowanie kształtów metodą klatek pośrednich
    22. Animacja oparta na narzędziu Kość w programie Animate
    23. Tworzenie konstrukcji postaci w programie Animate
    24. Używanie warstw maskujących w programie Adobe Animate
    25. Praca ze scenami w programie Animate
  4. Funkcje interaktywne
    1. Tworzenie przycisków w programie Animate
    2. Konwertowanie projektów programu Animate na dokumenty innych typów
    3. Tworzenie i publikowanie dokumentów HTML5 Canvas w programie Animate
    4. Programowanie elementów interaktywnych za pomocą wycinków kodu w programie Animate
    5. Tworzenie własnych składników HTML5
    6. Używanie składników w zawartości HTML5 Canvas
    7. Tworzenie własnych składników: przykłady
    8. Wycinki kodu dla składników dostosowanych
    9. Sprawdzone procedury — reklama oparta na programie Animate
    10. Tworzenie i publikowanie materiałów rzeczywistości wirtualnej
  5. Przestrzeń robocza i obieg pracy
    1. Tworzenie pędzli malarskich i zarządzanie nimi
    2. Używanie czcionek Google Fonts w dokumentach HTML5 Canvas
    3. Korzystanie z Bibliotek Creative Cloud w programie Adobe Animate
    4. Korzystanie ze stołu montażowego i panelu Narzędzia w programie Animate
    5. Obieg pracy i przestrzeń robocza w programie Animate
    6. Używanie czcionek internetowych w dokumentach HTML5 Canvas
    7. Osie czasu a język ActionScript
    8. Praca z wieloma osiami czasu
    9. Ustawianie preferencji
    10. Korzystanie z paneli narzędziowych programu Animate
    11. Tworzenie warstw na osi czasu w programie Animate
    12. Eksportowanie animacji do aplikacji mobilnych i platform gier
    13. Przesuwanie i kopiowanie obiektów
    14. Szablony
    15. Znajdowanie i zamienianie w programie Animate
    16. Cofanie, ponawianie i panel Historia
    17. Skróty klawiaturowe
    18. Korzystanie z osi czasu w programie Animate
    19. Tworzenie rozszerzeń HTML
    20. Opcje optymalizacji obrazów i animowanych plików GIF
    21. Eksportowanie ustawień obrazów oraz plików GIF
    22. Panel Zasoby w programie Animate
  6. Multimedia i wideo
    1. Przekształcanie i łączenie obiektów graficznych w programie Animate
    2. Tworzenie i obsługa wystąpień symboli w programie Animate
    3. Obrys obrazu
    4. Używanie dźwięku w programie Adobe Animate
    5. Eksportowanie plików SVG
    6. Tworzenie plików wideo do używania w programie Animate
    7. Dodawanie wideo w programie Animate
    8. Rysowanie i tworzenie obiektów w programie Animate
    9. Przekształcanie linii i kształtów
    10. Obrysy, wypełnienia, i gradienty w programie Animate CC
    11. Korzystanie z programów Adobe Premiere Pro i After Effects
    12. Panel Kolory w programie Animate CC
    13. Otwieranie plików programu Flash CS6 w programie Animate
    14. Praca z tekstem klasycznym w programie Animate
    15. Umieszczanie kompozycji w programie Animate
    16. Zaimportowane bitmapy w programie Animate
    17. Grafika 3D
    18. Praca z symbolami w programie Animate
    19. Rysowanie linii i kształtów przy użyciu programu Animate
    20. Praca z bibliotekami w programie Animate
    21. Eksportowanie dźwięków
    22. Zaznaczanie obiektów w programie Animate CC
    23. Praca z plikami AI programu Illustrator w programie Animate
    24. Stosowanie trybów mieszania
    25. Układanie obiektów
    26. Automatyzacja zadań za pomocą menu Polecenia
    27. Teksty wielojęzyczne
    28. Korzystanie z kamery w programie Animate
    29. Filtry graficzne
    30. Dźwięk a język ActionScript
    31. Preferencje rysowania
    32. Rysowanie za pomocą narzędzia Pióro
  7. Platformy
    1. Konwertowanie projektów programu Animate na dokumenty innych typów
    2. Obsługa platform niestandardowych
    3. Tworzenie i publikowanie dokumentów HTML5 Canvas w programie Animate
    4. Tworzenie i publikowanie dokumentów WebGL
    5. Pakowanie aplikacji na potrzeby środowiska AIR for iOS
    6. Publikowanie aplikacji dla środowiska AIR for Android
    7. Publikowanie dla środowiska AIR na komputery
    8. Ustawienia publikowania kodu ActionScript
    9. Sprawdzone procedury — porządkowanie kodu ActionScript w aplikacji
    10. Korzystanie z kodu ActionScript w programie Animate
    11. Ułatwienia dostępu w przestrzeni roboczej programu Animate
    12. Pisanie skryptów i zarządzanie nimi
    13. Włączanie obsługi platform niestandardowych
    14. Omówienie obsługi platform niestandardowych
    15. Praca z wtyczkami obsługi platform niestandardowych
    16. Debugowanie kodu ActionScript 3.0
    17. Włączanie obsługi platform niestandardowych
  8. Eksportowanie i publikowanie
    1. Eksportowanie plików z programu Animate CC
    2. Publikowanie plików OAM
    3. Eksportowanie plików SVG
    4. Eksportowanie grafiki i wideo w programie Animate
    5. Publikowanie dokumentów ActionScript 3.0
    6. Eksportowanie animacji do aplikacji mobilnych i platform gier
    7. Eksportowanie dźwięków
    8. Sprawdzone procedury — wskazówki dotyczące tworzenia zawartości dla urządzeń przenośnych
    9. Sprawdzone procedury — konwencje dotyczące wideo
    10. Sprawdzone procedury — wskazówki dotyczące tworzenia aplikacji SWF
    11. Sprawdzone procedury — określanie struktury pliku FLA
    12. Sprawdzone procedury optymalizowania plików FLA dla programu Animate
    13. Ustawienia publikowania kodu ActionScript
    14. Określanie ustawień publikowania w programie Animate
    15. Eksportowanie plików projektora
    16. Eksportowanie obrazów i animowanych plików GIF
    17. Szablony publikowania w formacie HTML
    18. Korzystanie z programów Adobe Premiere Pro i After Effects
    19. Szybkie udostępnianie i publikowanie animacji
  9. Rozwiązywanie problemów
    1. Rozwiązane problemy
    2. Znane problemy

 

Informacje o szablonach publikowania w formacie HTML

Szablon HTML programu Animate jest to plik zawierający statyczny kod HTML oraz kod szablonu ze specjalnymi zmiennymi (innymi niż zmienne z języka ActionScript). Po opublikowaniu pliku SWF program Animate zastępuje wartości tych zmiennych wartościami wybranymi na zakładce HTML w oknie dialogowym Ustawienia publikowania, a następnie generuje stronę HTML z osadzonym plikiem SWF.

Program Animate zawiera szereg szablonów, które uwalniają projektantów od konieczności ręcznego tworzenia stron HTML z plikami SWF i w większości sytuacji są wystarczające. Na rzykład, szablon Animate Only (Tylko Flash) pozwala testować pliki w przeglądarce. Plik SWF jest umieszczany na stronie HTML, dzięki czemu można sprawdzać jego działanie w przeglądarce (o ile jest zainstalowany program Flash Player).

W celu opublikowania strony HTML należy użyć tego samego szablonu i zmienić ustawienia. Za pomocą edytora HTML można też utworzyć własny szablon. Tworzenie szablonu przebiega tak samo jak tworzenie standardowej strony HTML. W tym pierwszym wypadku jednak wartości odnoszące się do pliku SWF należy zastąpić zmiennymi rozpoczynającymi się od znaku dolara ($).

Szablon HTML programu Animate ma następujące elementy i własności:

  • Jednowierszowy tytuł, który jest wyświetlany w wyskakującym menu Szablon, na zakładce HTML w oknie dialogowym Ustawienia publikowania.

  • Dłuższy opis, który jest wyświetlany w oknie dialogowym Ustawienia publikowania po kliknięciu przycisku Informacje z zakładki HTML.

  • Zmienne szablonu rozpoczynające się od znaku dolara ($) określają sposób podstawiania wartości parametrów w momencie generowania pliku wyjściowego przez program Animate.

    Uwaga: Aby wprowadzić w dokumencie zwykły znak dolara, należy wpisać ukośnik, a po nim znak dolara (\$).

  • Znaczniki HTML object i embed, które muszą być zgodne z wymaganiami programów Microsoft Internet Explorer oraz Netscape® Communicator® lub Navigator®. Zgodność z tymi wymaganiami stanowi warunek konieczny poprawnego wyświetlania pliku SWF na stronie HTML. W programie Internet Explorer znacznik HTML object służy do otwierania plików SWF; w programie Netscape do tego celu służy znacznik embed.

Dostosowywanie szablonów publikowania w formacie HTML

Modyfikując zmienne szablonów HTML, można tworzyć mapy obrazów, raporty tekstowe lub raporty URL, a także wstawiać własne wartości dla najczęściej stosowanych znaczników HTML w programie Animate (znaczników object i embed dla parametrów). Dotyczy to przeglądarek, w których używane są odpowiednio: formanty ActiveX oraz wtyczki.

Szablony programu Animate mogą zawierać kod HTML projektowanych aplikacji, jak również kod przeznaczony dla interpreterów, takich jak ColdFusion i ASP.

  1. Za pomocą edytora HTML otwórz szablon HTML programu Animate, w którym będą wprowadzane zmiany. Te szablony znajdują się w następujących lokalizacjach:

    • System Windows XP lub Vista: dysk rozruchowy:\Documents and Settings\nazwa użytkownika\Local Settings\Application Data\Adobe\Flash CS5\język\Configuration\HTML\. Folder Application Data jest zwykle folderem ukrytym. Możliwe, że w celu wyświetlenia tego folderu konieczna będzie zmiana ustawień Eksploratora Windows.

    • System Mac OS X 10.3 lub nowszy: macOS HD/Applications/Adobe Flash CS5/język/First Run/HTML.

      Dysk rozruchowy jest to dysk, z którego jest uruchamiany system operacyjny Windows (zwykle C:). Nazwa użytkownika jest to nazwa osoby zalogowanej w systemie operacyjnym Windows. Język jest oznaczany odpowiednim skrótem. Na przykład w Stanach Zjednoczonych język angielski jest oznaczany skrótem „en”, który oznacza język angielski.

  2. Edytuj szablon.
  3. Zapisz szablon w tym samym folderze, z którego został pobrany.
  4. Aby zastosować ustawienia szablonu do pliku SWF, wybierz polecenie Plik > Ustawienia publikowania, kliknij opcję HTML i zaznacz zmodyfikowany szablon. Program Animate zmodyfikuje tylko zmienne w zaznaczonym szablonie.

  5. Wybierz pozostałe ustawienia publikowania i kliknij przycisk OK.

Zmienne szablonu HTML

W poniższej tabeli zestawiono zmienne szablonów rozpoznawane przez program Animate:

Atrybut/Parametr

Zmienna szablonu

Tytuł szablonu

$TT

Początek opisu szablonu

$DS

Koniec opisu szablonu

$DF

Tytuł Animate (pliku SWF)

$T1

Tytuł Animate (pliku SWF) na potrzeby metadanych wyszukiwarek

$TL

Opis dla metadanych wyszukiwarek

$DC

Ciąg XML metadanych używany przez wyszukiwarki

$MD

Szerokość

$WT

Wysokość

$HT

Film

$MO

Wyrównanie HTML

$HA

Zapętlanie

$LO

Parametry obiektu

$PO

Parametry osadzania

$PE

Odtwarzanie

$PL

Jakość

$QU

Skala

$SC

Salign (przyciąganie z wyrównaniem)

$SA

Tryb Wmode

$WM

Czcionka urządzenia

$DE

Kolor tła

$BG

Tekst filmu (obszar na tekst filmu)

$MT

Adres URL filmu (lokalizacja adresu URL pliku SWF)

$MU

Szerokość obrazu (nieokreślony typ obrazu)

$IW

Wysokość obrazu (nieokreślony typ obrazu)

$IH

Nazwa pliku obrazu (nieokreślony typ obrazu)

$IS

Nazwa mapy obrazu

$IU

Lokalizacja znacznika mapy obrazu

$IM

Szerokość QuickTime

$QW

Wysokość QuickTime

$QH

Nazwa pliku QuickTime

$QN

Szerokość GIF

$GW

Wysokość GIF

$GH

Nazwa pliku GIF

$GN

Szerokość JPEG

$JW

Wysokość JPEG

$JH

Nazwa pliku JPEG

$JN

Szerokość PNG

$PW

Wysokość PNG

$PH

Nazwa pliku PNG

$PN

Używanie zmiennych stenograficznych

Zmienne $PO (dotyczące znaczników object) i $PE (dotyczące znaczników embed) stanowią bardzo przydatne elementy stenograficzne. Każda z nich powoduje, że program Animate wstawia do szablonu pewne niedomyślne wartości typowych parametrów object i embed, na przykład PLAY ($PL), QUALITY ($QU), SCALE ($SC), SALIGN ($SA), WMODE ($WM), DEVICEFONT ($DE) i BGCOLOR ($BG).

Przykładowy szablon HTML

Pokazany poniżej plik szablonu Default.HTML programu Animate zawiera wiele często używanych zmiennych szablonu:

$TTFlash Only 
$DS 
Wyświetlanie pliku Adobe SWF na stronie HTML. 
$DF 
<!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;> 
<html xmlns=&quot;http://www.w3.org/1999/xhtml&quot; xml:lang=&quot;en&quot; lang=&quot;en&quot;> 
<head> 
$CS 
<title>$TI</title> 
</head> 
<body bgcolor=&quot;$BG&quot;> 
<!--url's used in the movie--> 
$MU 
<!--text used in the movie--> 
$MT 
<object classid=&quot;clsid:d27cdb6e-ae6d-11cf-96b8-444553540000&quot; codebase=&quot;http://fpdownload.adobe.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0&quot; width=&quot;$WI&quot; height=&quot;$HE&quot; id=&quot;$TI&quot; align=&quot;$HA&quot;> 
<param name=&quot;allowScriptAccess&quot; value=&quot;sameDomain&quot; /> 
$PO 
<embed $PEwidth=&quot;$WI&quot; height=&quot;$HE&quot; name=&quot;$TI&quot; align=&quot;$HA&quot; allowScriptAccess=&quot;sameDomain&quot; type=&quot;application/x-shockwave-flash&quot; pluginspage=&quot;http://www.adobe.com/go/getflashplayer&quot; /> 
</object> 
</body> 
</html>

Tworzenie mapy obrazów do zastąpienia pliku SWF

Program Animate pozwala wygenerować mapę obrazu. Mapa taka zapewnia dostęp do wszystkich fragmentów obrazu i zachowuje działanie przycisków z łączami do adresów URL. Jeśli szablon HTML zawiera zmienną $IM, program Animate wstawia do pliku kod mapy obrazu. Zmienna $IU określa nazwę pliku GIF, JPEG lub PNG.

  1. W dokumencie zaznacz klatkę kluczową, która ma stanowić mapę obrazu, i oznacz ją etykietą #Map w inspektorze Właściwości klatki (Okno > Właściwości). Użyj dowolnej klatki kluczowej z przyciskami, do których przypisano operacje języka ActionScript 1.0 lub 2.0 getURL.

    Jeśli etykieta klatki nie zostanie utworzona, program Animate utworzy mapę obrazu na podstawie przycisków z ostatniej klatki pliku SWF. Ta opcja generuje osadzoną mapę obrazu, a nie osadzony plik SWF.

  2. Aby wybrać klatkę w celu pokazania mapy obrazu, wykonaj jedną z następujących czynności:
    • W przypadku plików PNG i GIF oznacz klatkę etykietą #Static.

    • W przypadku pliku JPEG podczas operacji publikowania ustaw głowicę odtwarzania na klatce, która ma być używana na potrzeby wyświetlania.

  3. Za pomocą edytora HTML otwórz szablon HTML programu, w którym będą wprowadzane zmiany.
  4. Zapisz szablon.
  5. Wybierz polecenie Plik > Ustawienia publikowania, kliknij opcję Format, wybierz format mapy obrazu i kliknij przycisk OK.

    Na przykład wstaw w szablonie następujący kod:

    $IM 
    <img src=$IS usemap=$IU width=$IW height=$IH BORDER=0>

    Po wykonaniu polecenia Publikuj ten kod może spowodować dodanie do dokumentu HTML następującego kodu:

    <map name=&quot;mymovie&quot;> 
    <area coords=&quot;130,116,214,182&quot; href=&quot;http://www.adobe.com&quot;> 
    </map> 
    <img src=&quot;mymovie.gif&quot; usemap=&quot;#mymovie&quot; width=550 height=400 border=0>

Tworzenie raportów URL i raportów tekstowych

Użycie w szablonie zmiennej $MT powoduje, że program Animate wstawia do kodu HTML cały tekst z bieżącego pliku SWF i nadaje mu status komentarza. Jest to przydatne, gdy zawartość pliku SWF trzeba poindeksować i uczynić widoczną dla wyszukiwarek.

Użycie w szablonie zmiennej $MU powoduje, że program Animate generuje listę wszystkich adresów URL, do których odwołują się operacje z bieżącego pliku SWF, a ponadto wstawia tę listę jako komentarz. Dzięki temu narzędzia do sprawdzania poprawności łączy będą mogły wykryć i sprawdzić łącza z pliku SWF.

Osadzanie metadanych przeszukiwania

Zmienne szablonu $TL (tytuł pliku SWF) oraz $DC (metadane opisu) pozwalają dołączyć do pliku HTML metadane wyszukiwania. Dzięki temu plik SWF będzie lepiej widoczny dla wyszukiwarek, a wyniki wyszukiwania będą bardziej znaczące. Zmienna szablonu $MD pozwala dołączyć metadane wyszukiwania w postaci ciągu XML.

Więcej materiałów tego typu

Pomoc dostępna szybciej i łatwiej

Nowy użytkownik?