Komponent Efekty cząstek

Tego komponentu nie można używać w reklamach AMP HTML, reklamach wideo ani reklamach graficznych.

Komponent Efekty cząstek umożliwia dodawanie efektów animacji opartych na systemach cząstek. Cząstki są generowane w początkowych zakresach parametrów, np. wewnątrz określonego obszaru i w zakresie rozmiarów, a następnie przesuwane i zmieniane z określoną szybkością. Pozwala to uzyskać efekty wizualne o pewnym stopniu losowości, takie jak śnieg, deszcz, ogień, para wodna i dym.

Przykład efektu śniegu

Aby użyć komponentu Efekty cząstek:

1. Otwórz panel Komponenty, a potem folder Grafika i efekty.

2. Kliknij dwukrotnie komponent Efekty cząstek  lub przeciągnij go na scenę.

3. Kliknij dwukrotnie komponent na scenie lub kliknij przycisk Ustawienia… w panelu Właściwości. Otworzy się okno Efekty cząstek.

4. Przeciągnij obrazy, które chcesz uwzględnić jako warstwy, z panelu Biblioteka na panel Warstwy. Aby dodać inne obrazy, kliknij przycisk Dodaj obrazy  u dołu panelu.

5. Wybierz efekt z panelu Gotowe ustawienia na dole, a następnie przeciągnij go na scenę lub kliknij widoczny nad nim przycisk dodawania . Na scenie pojawi się migawka efektu z zaznaczonym obszarem początkowym cząstek (w którym cząstki są generowane). Możesz dodać wiele efektów jako różne warstwy.

6. Dostosuj efekt, edytując jego właściwości. Nowy zestaw właściwości możesz zapisać jako niestandardowe gotowe ustawienia.

Zmienianie kolejności warstw

Kolejność warstw odzwierciedla sposób ich nakładania się. Aby zmienić kolejność warstw:

1. Otwórz okno Efekty cząstek, klikając dwukrotnie komponent Efekty cząstek na scenie lub klikając przycisk Ustawienia… w panelu Właściwości.
2. W panelu Warstwy przeciągnij warstwę na nowe miejsce.

Zmienianie położenia warstw

Możesz przesuwać obraz lub obszar początkowy cząstek w granicach komponentu, by uzyskać efekt. Aby przenieść warstwę:

1. Otwórz okno Efekty cząstek, klikając dwukrotnie komponent Efekty cząstek na scenie lub klikając przycisk Ustawienia… w panelu Właściwości.
2. Wybierz warstwę, którą chcesz przenieść. Wokół obrazu lub obszaru początkowego efektu pojawi się ramka ograniczająca. Możesz też wybrać wiele warstw, by przenieść je razem.
3. Użyj jednej z tych metod:
   • Na scenie:
     • Przeciągnij warstwę na nowe miejsce.
     • Użyj klawiszy strzałek, by przesuwać warstwę o jeden piksel. Aby przesunąć warstwę w danym kierunku o 10 pikseli, podczas naciskania strzałki przytrzymaj wciśnięty klawisz Shift.
   • W panelu Właściwości:
     • W przypadku obrazów edytuj właściwości pozycji Góra i Lewo.
     • W przypadku efektów rozwiń właściwości Zaawansowane i zmień Wartość X emisji oraz Wartość Y emisji. Ustaw opcję Zablokuj różnicę , aby przesunąć obszar początkowy cząstek bez zmieniania rozmiaru.

Zmienianie rozmiaru warstw

Możesz zmienić rozmiar obrazu lub obszaru początkowego cząstek maksymalnie do szerokości i wysokości komponentu, by uzyskać efekt. W przypadku efektów możesz zmienić rozmiar obszaru początkowego cząstek. Aby zmienić rozmiar warstwy:

1. Otwórz okno Efekty cząstek, klikając dwukrotnie komponent Efekty cząstek na scenie lub klikając przycisk Ustawienia… w panelu Właściwości.
2. Wybierz warstwę, której rozmiar chcesz zmienić. Wokół obrazu lub obszaru początkowego efektu pojawi się ramka ograniczająca. Możesz też wybrać wiele warstw.
3. Użyj jednej z tych metod:
   • Na scenie: przeciągnij uchwyty sterowania znajdujące się po bokach i w rogach ramki ograniczającej.
   • W panelu Właściwości:
     • W przypadku obrazów edytuj właściwości Szerokość i Wysokość.
     • W przypadku efektów rozwiń właściwości Zaawansowane i zmień Wartość X emisji oraz Wartość Y emisji. Pamiętaj, że opcja Zablokuj różnicę  musi być wyłączona.

Usuwanie warstw

Aby usunąć warstwę z komponentu:

1. Otwórz okno Efekty cząstek, klikając dwukrotnie komponent Efekty cząstek na scenie lub klikając przycisk Ustawienia… w panelu Właściwości.
2. Na panelu Warstwy zaznacz warstwy, które chcesz usunąć.
3. Naciśnij klawisz Delete lub kliknij przycisk Usuń warstwy  u dołu panelu.

Ukrywanie i pokazywanie warstw

Możesz ukryć warstwę, by ułatwić sobie pracę z pozostałymi warstwami. Ukryte warstwy nie będą widoczne w podglądzie ani w opublikowanych plikach. Aby ukryć lub wyświetlić warstwę:

1. Otwórz okno Efekty cząstek, klikając dwukrotnie komponent Efekty cząstek na scenie lub klikając przycisk Ustawienia… w panelu Właściwości.
2. Kliknij pole pod ikoną Ukryj wszystkie warstwy  w warstwie, którą chcesz ukryć lub pokazać.

Właściwości

Wraz z właściwościami całego komponentu możesz skonfigurować właściwości każdego zawartego w nim efektu.

Właściwości komponentu Efekty cząstek

Właściwość	Opis
Nazwa	Ustawia nazwę komponentu Efekty cząstek.
Autoodtwarzanie	Zaznaczenie tej opcji powoduje automatyczne odtworzenie animacji po wczytaniu komponentu. Uwaga: poszczególne efekty również mają właściwość Autoodtwarzanie.
Ustaw limit animacji	Po zaznaczeniu tej opcji odtwarzanie animacji zatrzymuje się po określonym czasie trwania w sekundach.

Właściwości poszczególnych efektów

Właściwości poszczególnych efektów znajdziesz w oknie Efekty cząstek. Otwórz okno, klikając dwukrotnie komponent Efekty cząstek na scenie lub klikając Ustawienia... w panelu Właściwości, a następnie wybierz efekt, by zobaczyć jego właściwości.

Gotowe ustawienia

Każde gotowe ustawienie ma domyślny zestaw właściwości, które można przywrócić, klikając prawym przyciskiem myszy menu Gotowe ustawienia i wybierając opcję Resetuj. Jeśli wybierzesz inne gotowe ustawienie, poniższe właściwości zostaną zresetowane do jego ustawień domyślnych.

Google Web Designer oferuje kilka wbudowanych gotowych ustawień. Możesz też zapisać własne gotowe ustawienia, a następnie wyeksportować je i zaimportować do wykorzystania na innych komputerach (zobacz Niestandardowe gotowe ustawienia).

Właściwość	Opis
Identyfikator	Identyfikator efektu (umożliwia odwoływanie się do efektu w zdarzeniach).
Liczba	Całkowita liczba cząstek wygenerowanych, jeśli animacja tego efektu nie zostanie zatrzymana ani zapętlona.
Rozmiar	Zakres początkowego rozmiaru cząstek. Określa minimalną i maksymalną wielkość w pikselach.
Sprite	Kształt cząstek. Kwadrat Okrąg Linia Łza Obraz (obraz wybrany z biblioteki Może być powiązana z danymi dynamicznymi.)
Kolor	Kolor początkowy i końcowy.
Przezroczystość	Minimalny i maksymalny początkowy poziom przezroczystości, gdzie 0 oznacza przezroczysty, a 1 – nieprzezroczysty (wartości dziesiętne umożliwiają uzyskanie efektu półprzezroczystości).
Szybkość	Minimalna i maksymalna prędkość początkowa.
Kierunek	Minimalny i maksymalny kąt obrotu cząstki. Zakres kątów możesz też ustawić za pomocą elementów sterujących na okręgu.
Zaawansowane
Wartość X emisji	Minimalne i maksymalne współrzędne X miejsca generowania cząstek, określone w pikselach lub procentowo. Ustaw opcję Zablokuj różnicę , by zachować szerokość obszaru początkowego cząstek przez automatyczne zastosowanie zmian w obu polach.
Wartość Y emisji	Minimalne i maksymalne współrzędne Y miejsca generowania cząstek, określone w pikselach lub procentowo. Ustaw opcję Zablokuj różnicę , by zachować wysokość obszaru początkowego cząstek przez automatyczne zastosowanie zmian w obu polach.
Prędkość zmiany rozmiaru	Szybkość zmiany rozmiaru określona w pikselach (z możliwością ustawienia wartości dziesiętnych). Wartość ujemna powoduje zmniejszanie się cząstek.
Kolory losowe	Po zaznaczeniu tej opcji jako początkowy kolor cząstek wybierany jest losowy kolor spośród kolorów początkowych i końcowych.
Prędkość zmiany koloru	Szybkość zmiany koloru z początkowego na końcowy. Ta właściwość jest wyłączona, jeśli zaznaczone są kolory losowe.
Prędkość zmiany przezroczystości	Szybkość zmiany przezroczystości. Wartość ujemna powoduje, że cząstki stają się przezroczyste.
Autoodtwarzanie	Po zaznaczeniu tej opcji animacja efektu jest odtwarzana po rozpoczęciu odtwarzania komponentu. W przeciwnym razie możesz aktywować animację zdarzeniem.
Pętla	Zaznaczenie tej opcji powoduje ciągłe odtwarzanie animacji efektu. W przeciwnym razie animacja kończy się po wygenerowaniu określonej liczby cząstek.
Odstęp emisji	Czas, jaki upływa między wygenerowaniem kolejnych cząstek.
Przeskocz do przodu	Uruchamia animację po wygenerowaniu określonego procentu cząstek.
Przyspieszenie	Poziome i pionowe przyspieszenie ruchu cząstek.
Turbulencja
Częstotliwość	Częstotliwość występowania turbulencji wpływających na ruch cząstek. Wyższe wartości powodują częstsze nieregularności na ścieżce każdej cząstki.
Siła	Intensywność turbulencji. 0 oznacza brak turbulencji.
Współczynnik siły	Szybkość zmian siły turbulencji.
Ślad	Długość śladu pozostawionego przez cząsteczki na drodze ich ruchu. 1 oznacza brak śladu.

Turbulencje mogą spowolnić działanie reklamy lub strony, zwłaszcza jeśli ustawisz dłuższy ślad.

Niestandardowe gotowe ustawienia

Możesz zapisać zestaw właściwości jako niestandardowe gotowe ustawienia, by użyć ich ponownie.

Zapisywanie nowych niestandardowych gotowych ustawień

1. Dostosuj właściwości istniejących gotowych ustawień.
2. W panelu Gotowe ustawienia na dole kliknij przycisk Zapisz jako gotowe ustawienia . Możesz też prawym przyciskiem myszy kliknąć efekt na scenie lub menu Gotowe ustawienia w panelu Właściwości.
3. Wpisz niepowtarzalną nazwę nowych gotowych ustawień i naciśnij Enter lub kliknij OK.

Gotowe ustawienia znajdziesz na liście w panelu Właściwości i w panelu Gotowe ustawienia. Będą oznaczone ikoną niestandardowych gotowych ustawień .

Zmiana nazwy niestandardowych gotowych ustawień

1. Kliknij prawym przyciskiem myszy gotowe ustawienia w panelu Gotowe ustawienia i wybierz Zmień nazwę.
2. Wpisz nową nazwę i naciśnij Enter lub kliknij OK.

Usuwanie niestandardowych gotowych ustawień

1. Kliknij prawym przyciskiem myszy gotowe ustawienia w panelu Gotowe ustawienia i wybierz Usuń.
2. Kliknij OK, by potwierdzić usunięcie.

Eksportowanie niestandardowych gotowych ustawień

Możesz eksportować niestandardowe gotowe ustawienia, by udostępnić je innym użytkownikom Google Web Designera.

1. Kliknij prawym przyciskiem myszy gotowe ustawienia w panelu Gotowe ustawienia i wybierz Eksportuj.
2. Wybierz folder docelowy dla pliku eksportu.

Wyeksportowany plik ZIP ma taką samą nazwę jak gotowe ustawienia.

Importowanie niestandardowych gotowych ustawień

Jeśli masz plik eksportu niestandardowych gotowych ustawień, możesz go zaimportować do swojego Google Web Designera.

1. Skopiuj wyeksportowany plik ZIP na komputer, na który chcesz zaimportować gotowe ustawienia.
2. Otwórz okno Efekty cząstek w aplikacji Google Web Designer na tym komputerze.
3. W panelu Gotowe ustawienia na dole kliknij przycisk Zaimportuj gotowe ustawienia .
4. Wybierz plik ZIP z wyeksportowanymi niestandardowymi gotowymi ustawieniami.

Zaimportowane gotowe ustawienia pojawią się na liście w panelu Właściwości i w panelu Gotowe ustawienia.

Zdarzenia i działania

Zdarzenia wysyłane przez komponent Efekty cząstek

Na podstawie tych zdarzeń komponentu Efekty cząstek możesz wywołać inne działania:

Zdarzenie	Opis
Osiągnięto limit czasowy	Wysyłane, gdy animacja była odtwarzana do osiągnięcia limitu czasu.

Działania wykonywane przez komponent Efekty cząstek i przez poszczególne efekty

W odpowiedzi na zdarzenia komponent Efekty cząstek może uaktywniać te działania:

• Odtwórz
• Wstrzymaj
• Zatrzymaj

Gdy w oknie Zdarzenie wybierzesz jedno z tych działań, ustaw komponent Efekty cząstek lub konkretny efekt jako odbiornik.

Dowiedz się, jak konfigurować zdarzenia.

Podgląd

Podczas pracy w oknie Efekty cząstek na karcie Projekt jest wyświetlana statyczna migawka prezentująca możliwy wygląd komponentu.

Aby obejrzeć animację z bieżącymi ustawieniami, wejdź na kartę Podgląd. Podczas odtwarzania podglądu możesz zmieniać właściwości, by od razu zobaczyć ich wpływ na animację.

Możesz też wyświetlić podgląd dokumentu w wybranej przeglądarce, klikając Zapisz u dołu okna, a potem klikając przycisk Podgląd.