Podręcznik użytkownika Anuluj

Korzystanie z kamery w programie Animate

Szukaj

Ostatnia aktualizacja 25 maj 2023

W tym artykule wyjaśniono sposób pracy z kamerą w programie Animate.

Funkcje kamery w programie Animate pozwalają animatorom na wprowadzenie efektu ruchu symulującego prawdziwą kamerę.Do tej pory symulowanie ruchu kamery wymagało używania zewnętrznych rozszerzeń o różnej jakości lub modyfikowania samej animacji. Twórcy animacji mogą korzystać z następujących funkcji ważnych dla każdego filmu:

Panoramowanie względem obiektu w klatce
Powiększanie w celu podkreślenia obiektu i uzyskania dramatyzmu
Oddalanie klatki w celu przypomnienia widzom całego obszaru akcji
Zmienianie punktu skupienia w celu przeniesienia uwagi widzów między obiektami
Obracanie kamery
Używanie tinty lub filtrów w celu wprowadzenia efektów kolorystycznych

Gdy w kompozycji jest ustawiony widok kamery, warstwy są widoczne w taki sposób, jakby były filmowane rzeczywistą kamerą. Na warstwie kamery można również dodawać animacje lub klatki kluczowe.

Jest dostępne narzędzie Kamera dla wszystkich wbudowanych typów dokumentów programu Animate: HTML Canvas, WebGL i ActionScript.

Włączanie i wyłączanie kamery

Do korzystania z narzędzia Kamera służą następujące opcje:

W panelu Narzędzia kliknij ikonę Kamera.
Na osi czasu kliknij przycisk Dodaj/usuń kamerę.

Po włączeniu kamery pojawi się obramowanie stołu montażowego w takim samym kolorze, jaki ma warstwa kamery.

A. Kontur stołu montażowego B. Ikona kamery C. Właściwości kamery D. Efekty kolorystyczne kamery E. Narzędzie Kamera F. Ikona kamery G. Warstwa kamery

Stół montażowy działa teraz jako kamera dla dokumentu. W panelu Oś czasu dodano nową warstwę kamery z obiektem kamery. Po wybraniu narzędzia do edycji kamery w inspektorze Właściwości jest włączona ikona kamery.

Skutki włączenia kamery:

Bieżący dokument jest w trybie kamery
Stół montażowy jest obrócony zgodnie z kamerą.
Na obramowaniu stołu montażowego jest widoczna ramka kamery.
Jest wybrana warstwa kamery.

Powiększanie, obracanie i panoramowanie kamerą

Powiększanie obrazu w kamerze

Aby zmienić ustawienie powiększenia, można użyć opcji ekranowych lub wpisać nowe wartości w panelu właściwości Kamera.

Powiększanie i obracanie
Aby powiększyć obraz na scenie, wprowadź wyższą wartość powiększenia lub przesuń suwak u dołu stołu montażowego.
Aby powiększyć zawartość, przesuń suwak w kierunku ikony +. Aby zmniejszyć, przesuń w kierunku ikony –.
Aby włączyć nieograniczone zmniejszenie lub powiększenie, zwolnij suwak w celu przyciągnięcia go do pozycji środkowej.

Obracanie kamery

Aby obrócić obiekt, można użyć opcji ekranowych powiększania lub ustawić nowe wartości w panelu właściwości Kamera.
Można zmienić wartości obrotu, aby dostosować ten efekt dla poszczególnych warstw, lub modyfikować obrót przy użyciu suwaków.
Aby włączyć nieograniczone ustawianie obrotu z dowolnej strony, zwolnij suwak w celu przyciągnięcia go do pozycji środkowej. Liczba na środku oznacza wprowadzony w tej chwili kąt obrotu.

Przesuwanie kamery

Kliknij i przeciągnij obwiednię kamery w dowolnym miejscu w zakresie warstwy kamery na stole montażowym.
Aby przesunąć wybrany obiekt, przewiń w górę i w dół. Aby uniknąć pochylenia przy przesuwaniu, naciśnij i przytrzymaj klawisz Shift.
Gdy narzędzie kamery jest aktywne, każde przeciąganie jest przesunięciem w ramach obwiedni kamery.

Korzystanie z opcji panoramowania kamery

Aby precyzyjnie panoramować kamerą, można użyć współrzędnych X i Y w panelu Właściwości kamery.

Aby panoramować obiekty w poziomie, wskaż współrzędną X i przeciągnij suwak wartości X w prawo lub w lewo.

Aby panoramować obiekty w pionie, wskaż współrzędną Y i przeciągnij suwak wartości Y w prawo lub w lewo.

Zerowanie opcji efektów kamery

W każdej chwili można wyzerować modyfikacje kamery dotyczące efektów panoramowania, powiększania, obracania i kolorystycznych, aby przywrócić pierwotne ustawienia. Aby przywrócić poprzednie wartości właściwości, kliknij ikonę zerowania obok tej właściwości.

Wprowadzanie tinty na warstwie kamery

Wybierz opcję Kamera > Właściwości, aby wyświetlić panel. Zaznacz lub wyczyść pole wyboru Tinta, aby włączyć lub wyłączyć efekt tinty.

Efekty kolorystyczne kamery
Zmień wartości tinty (procentowe) i jej kolor RGB dla bieżącej klatki.

Ta funkcja jest obsługiwana w dokumentach typów AS3 i WebGL.

Dostosowywanie filtrów kolorów na warstwie kamery

Aby włączyć lub wyłączyć efekt filtra, w panelu Właściwości kamery zaznacz pole wyboru Ustaw kolor.
Zmień ustawienia jasności, kontrastu, nasycenia i barwy dla bieżącej klatki. Dopuszczalny zakres wartości jasności, kontrastu i nasycenia wynosi od –100 do 100%, a barwy— od –180 do 180 stopni.

Ta funkcja jest obsługiwana tylko w dokumentach typu AS3.

Tworzenie efektu paralaksy przy użyciu głębi kamery i warstw

Twórcy gier i programiści chcą uzyskać atrakcyjną oprawę materiałów. Używając różnych obiektów gry na warstwach pierwszego planu i tła, można sterować prędkością i położeniem tych obiektów. Kiedy kamera zachowuje określony punkt ogniskowej, można przesuwać obiekty z różnymi prędkościami, aby uzyskać efekt przypominający grafikę trójwymiarową. Podczas pracy z animacjami 2D w programie Animate można uzyskać ten efekt dzięki kamerze i funkcji głębi warstw. Zmieniając głębokość warstw w panelu Głębia warstwy, można uzyskać efekt paralaksy. Aby użyć głębokości warstwy, kliknij opcję Okno > Głębia warstwy.

Kliknij tutaj, aby dowiedzieć się więcej o głębi warstwy.

Utwórz kilka obiektów na różnych warstwach w programie Animate.
Dodaj różne głębokości poszczególnych warstw.
Dodaj warstwę kamery, klikając narzędzie Kamera.

Warstwa kamery w kontekście głębi warstw

Ten efekt pozwala uwidocznić głębokość i perspektywę w przypadku obiektów.

Obiekty znajdujące się bliżej kamery poruszają się szybciej niż obiekty bardziej od niej oddalone.
Kiedy warstwa kamery ma wartość 0, obiekty bliżej kamery mają niższą liczbę dodatnią. Obiekty oddalone od kamery mają wyższą wartość dodatnią. Warstwy znajdujące się za kamerą mają wartości ujemne.

Wideo efektu paralaksy i głębokości z kamery

Ten materiał wideo pozwala zapoznać się z efektem paralaksy i powiększenia kamerą.

Blokowanie warstwy na kamerze

Twórcy animacji i projektanci gier chcą, aby niektóre obiekty były nieruchome względem widoku, jaki generuje kamera. Będą to na przykład przycisk operacji, element interfejsu czasomierza w grze lub pistolet. W takich przypadkach zasób musi być zablokowany — podążać za ruchem kamery. Program Animate zawiera funkcję Przyłącz do kamery, która pozwala uzyskać taki efekt.

Przyłączenie warstwy do kamery powoduje, że znajdujące się na tej warstwie obiekty zostają przypięte do kamery i zawsze poruszają się razem z nią. W ten sposób ruchy kamery nie wpływają na te obiekty.

Aby przyłączyć pojedynczą warstwę do kamery, kliknij kropkę w kolumnie przyłączania ikony kamery. Jeśli warstwa jest przyłączona do kamery, obok nazwy tej warstwy widnieje stosowna ikona.

Poniższe ilustracje dotyczą zachowania warstw przed przyłączeniem do kamery i po tej zmianie:

Ilustracja animacji w przypadku, kiedy warstwa nie jest przyłączona do kamery:

Ilustracja animacji w przypadku, kiedy warstwa jest przyłączona do kamery:

Można również przyłączyć lub odłączyć wszystkie warstwy względem kamery, klikając ikonę przyłączenia kamery na osi czasu.

Przyłączanie wszystkich warstw do kamery — Ilustracja wszystkich warstw po przyłączeniu ich do kamery

Korzystanie z kamery w czasie wykonywania

Interfejsy API kamery do dokumentów AS3, WebGL i HTML Canvas pozwalają dodawać kamerę w czasie wykonywania oraz korzystać z niej i zarządzać nią. Interfejsy API czasu wykonywania do obsługi kamery w dokumentach AS3, WebGL i HTML Canvas:

Typ	Klasa	Przykład	Opis
AS3	VirtualCamera	import fl.VirtualCamera; var obiektKamery = VirtualCamera.getCamera(root);	Pobierz obiekt kamery. Umożliwia pobieranie i ustawianie właściwości kamery w czasie wykonywania.
HTML Canvas	VirtualCamera	var obiektKamery = AdobeAn.VirtualCamera.getCamera(exportRoot);	Pobierz obiekt kamery. Podczas tworzenia zawartości należy upewnić się, że kamera jest włączona.
WebGL	VirtualCamera	var obiektKamery = flwebgl.VirtualCamera.getCamera(stage.getPlayer());	Pobierz obiekt kamery. Podczas tworzenia zawartości należy upewnić się, że kamera jest włączona.

Wszystkie te metody mają zastosowanie do dokumentów typu AS3. Niektóre z tych metod nie są dostępne w przypadku dokumentów WebGL i HTML Canvas. W ostatnich dwóch kolumnach poniższej tabeli oznaczono, czy poszczególne metody mają zastosowanie w przypadku formatów WebGL i HTML Canvas czy nie.

Wirtualne metody kamery

Nr seryjny	Metoda	Prototyp	Przykład	Opis	HTML Canvas	WebGL
1	getPosition	getPosition():Object	trace(obiektKamery.getPosition().x, obiektKamery.getPosition().y, obiektKamery.getPosition().z);	Zwraca obiekt z właściwościami x, y i z, które wskazują bieżące położenie kamery.	Tak	Tak
2	setPosition	setPosition(posX:Number,posY:Number, posZ:Number=0):void	obiektKamery.setPosition(100,100,100);	Przesuwa kamerę do położenia bezwzględnego ustalonego przez parametry wejściowe. Wartość domyślna wynosi 0.	Tak	Tak
3	moveBy	moveBy(tx:Number,ty:Number,tz:Number=0): void	obiektKamery.moveBy(100,100,100);	Przesuwa kamerę względem bieżącego położenia o wektor (tx, ty, tz). Uwaga: Właściwość „tz” ma znaczenie tylko w przypadku, gdy włączono głębokość warstwy. Domyślnie ma wartość 0.	Tak	Tak
4	resetPosition	resetPosition():void	obiektKamery.resetPosition();	Zeruje położenie kamery — przesuwa ją do początku układu współrzędnych (0,0,0).	Tak	Tak
5	getZoom	getZoom():Number	trace(obiektKamery.getZoom());	Zwraca bieżącą wartość powiększenia kamery. Domyślnie 100%.	Tak	Tak
6	setZoom	setZoom(zoom:Number):void	obiektKamery.setZoom(120);	Powiększa kamerę do wartości bezwzględnej (procentowej) ustalonej przez parametr wejściowy.	Tak	Tak
7	zoomBy	zoomBy(zoom:Number):void	obiektKamery.zoomBy(100);	Powiększa kamerę względem bieżącej wartości powiększenia (do uzyskania zadanej wartości procentowej).	Tak	Tak
8	resetZoom	resetZoom():void	obiektKamery.resetZoom();	Zeruje powiększenie kamery do wartości domyślnej 100%.	Tak	Tak
9	getRotation	getRotation():Number	trace(obiektKamery.getRotation());	Zwraca bieżący kąt kamery.	Tak	Tak
10	setRotation	setRotation(kąt:Number):void	obiektKamery.setRotation(45);	Obraca kamerę o kąt bezwzględny podany jako parametr wejściowy.	Tak	Tak
11	rotateBy	rotateBy(kąt:Number):void	obiektKamery.rotateBy(60);	Obraca kamerę względem bieżącego położenia o kąt podany w parametrze wejściowym.	Tak	Tak
12	resetRotation	resetRotation():void	obiektKamery.resetRotation();	Zeruje kąt kamery — ustawia wartość 0.	Tak	Tak
13	setTint	setTint(kolorTinty:uint,procentTinty:Number):void	obiektKamery.setTint(0x56FFFF, 68);	Ustawia tintę kamery przy użyciu koloru (RGB) i wartości procentowej tinty.	Nie	Tak
14	setTintRGB	setTintRGB(czerwony:uint,zielony:uint,niebieski:uint,protentTinty:Number):void	obiektKamery.setTintRGB(0xff, 0, 0, 50);	Ustawia tintę kamery przy użyciu wartości koloru po dekompozycji (R, G, B i procentTinty).	Nie	Tak
15	getTint()	getTint():Object	var tinta=obiektKamery.getTint(); trace("kolor:",tinta.color, "odsetek:",tinta.percent);	Zwraca obiekt z dwiema właściwościami: procent i kolor.	Nie	Tak
16	getTintRGB	getTintRGB():Object	var tinta = obiektKamery.getTintRGB(); trace("kolor tinty czerwony:", tinta.red,"zielony:",tinta.green,"niebieski:",tinta.blue,”procent tinty: ",tinta.percent);	Zwraca obiekt z czterema właściwościami: procent, czerwony, zielony, niebieski.	Nie	Tak
17	resetTint	resetTint()	obiektKamery.resetTint();	Usuwa tintę z kamery.	Nie	Tak
18	setColorFilter	setColorFilter(jasność:Number, kontrast:Number, nasycenie:Number, barwa:Number):void	obiektKamery.setColorFilter(100,-50, 50,-100);	Ustawia filtr koloru kamery przy użyciu wartości koloru po dekompozycji (jasność, kontrast, nasycenie, barwa).	Nie	Nie
19	resetColorFilter	resetColorFilter()	cameraObj.resetColorFilter();	Usuwa filtr koloru.	Nie	Nie
20	reset	reset()	obiektKamery.reset();	Zeruje wszystkie właściwości kamery (przywraca domyślne).	Tak	Tak
21	setZDepth	setZDepth(głębokośćZ:Number):void	obiektKamery.setZDepth(200);	Ustawia wartość głębokości Z kamery.	Tak	Nie
22	getZDepth	getZDepth():Number	trace(obiektKamery.getZDepth());	Zwraca wartość głębokości Z kamery.	Tak	Nie
23	pinCameraToObject	pinCameraToObject(obiekt:DisplayObject, przesunięcieX:Number=0, przesunięcieY:Number=0, przesunięcieZ=0)	obiektKamery.pinCameraToObject (getChildByName("NazwaWystąpienia"), 200, 50);	Kamera śledzi w czasie wykonywania obiekt podany jako parametr wejściowy. Jeśli są podane wartości przesunięcieX, przesunięcieY i przesunięcieZ, kamera śledzi obiekt, pozostając w położeniu (x+przesunięcieX, y+przesunięcieY, z+przesunięcieZ).	Tak	Tak
24	setPinOffset	setPinOffset(przesunięcieX:Number, przesunięcieY:Number, przesunięcieZ:Number)	obiektKamery.setPinOffset(-60,0);	Zmienia wartości przesunięcieX i przesunięcieY dotyczące przypięcia kamery do obiektu. W czasie wykonywania kamera śledzi obiekt z przesunięciem (x+przesunięcieX, y+przesunięcieY, głębokośćZ+z).	Tak	Tak
25	unpinCamera	unpinCamera()	obiektKamery.unpinCamera();	Odpina kamerę od obiektu.	Tak	Tak
26	setCameraMask	setCameraMask(maskaObiektu:DisplayObject)	obiektKamery.setCameraMask(maskaObiektu);	Ustawia maskę obiektu jako maskę na kamerze.	Nie	Nie
27	removeCameraMask	removeCameraMask()	obiektKamery.removeCameraMask();	Usuwa maskę z kamery.	Nie	Nie

Dostęp do kamery jako obiektu klipu filmowego

Typ	Metoda	Prototyp	Przykład
AS3	getCameraAsMovieClip	getCameraAsMovieClip(kontener:DisplayObject):MovieClip	var obiektKamery=fl.VirtualCamera.getCameraAsMovieClip(root);
HTML Canvas	getCameraAsMovieClip	getCameraAsMovieClip(kontener:DisplayObject):MovieClip	var obiektKamery=AdobeAn.VirtualCamera.getCamera(exportRoot);
WebGL	getCameraAsMovieClip	getCameraAsMovieClip(kontener:DisplayObject):MovieClip	var obiektKamery=flwebgl.VirtualCamera.getCameraAsMovieClip(this);

Maskowanie obiektów w czasie wykonywania (w dokumencie ActionScript 3)

Następujący kod interfejsu API kamery pozwala maskować obiekty w czasie wykonywania:

import fl.VirtualCamera;
fl.VirtualCamera.getCamera(nadrzedna).setCameraMask(latarka);

Przykładowy zrzut ekranu animacji, w której użyto maski o owalnym kształcie:

Tworzenie interaktywnych animacji kamery przy użyciu Kreatora kodu operacji

Na poniższym schemacie przedstawiono poszczególne kroki tworzenia animacji przy użyciu kamery interaktywnej. Kreatora kodu operacji można używać w dokumentach HTML Canvas.

Poniższe przykładowe wideo ilustruje sposób użycia kamery interaktywnej. Widać na nim, że w czasie wykonywania można na przemian skupiać kamerę na spadochronie, plecaku rakietowym i krajobrazie miejskim.

Wideo ilustrujące używanie kamery w czasie wykonywania

Przykładowe wideo ilustrujące używanie kamery w czasie wykonywania

Kadrowanie obiektów na stole montażowym

Program Adobe XD umożliwia tworzenie stosu lub nakładek zawartości na innym obszarze kompozycji w celu symulowania interaktywnych efektów slajdów. Dotyczy to na przykład list rozwijanych, klawiatur wysuwanych czy efektów podświetlenia. Korzystając z nakładek, można też użyć obszaru kompozycji wiele razy bez potrzeby powielania jej zawartości w innych obszarach kompozycji.

Aby wykadrować zawartość wychodzącą poza stół montażowy, kliknij przycisk Przytnij zawartość poza stołem montażowym.Połączenie kamery i widoku stołu montażowego pozwala wyświetlać zawartość w zasięgu kamery.

Więcej materiałów tego typu

Pomoc dostępna szybciej i łatwiej

Nowy użytkownik?