Com canviar la mida de letapa danimació dAdobe Edge

L'escenari és on col·locaràs els teus elements, com ara imatges, text i objectes dibuixats. L'escenari és una finestra HTML en directe, el que significa que el que veus a la pantalla és el que veu el teu públic quan veu i interactua amb la teva composició. Podeu dimensionar l'escenari de dues maneres diferents:

• Píxels: Adobe Edge Animate CC us permet configurar l'escenari perquè es mantingui una mida específica sense importar la mida de la finestra del navegador.

• Percentatge: per a aquells que prefereixen un disseny web més responsive.

• Prova del disseny web responsiu: és possible que vulgueu canviar el color de fons de l'escenari per provar la capacitat de resposta del vostre disseny.

Mida de l'escenari per valors de píxels

El més probable és que un dels primers passos que voldreu fer és dimensionar correctament el vostre Stage. Si teniu previst inserir la vostra animació en una pàgina web existent, primer determineu la quantitat d'espai que voleu que ocupi la vostra animació en aquesta pàgina i, a continuació, dimensioneu l'escenari en conseqüència.

Per canviar la mida de l'escenari, feu clic als números taronja de la secció Etapa del tauler Propietats, a la columna de l'extrem esquerre a prop de la part superior de la pantalla, tal com es mostra. Si feu clic als números d'amplada o d'alçada, podeu escriure les dimensions exactes (en píxels) que voleu que tingui el vostre Stage.

Si no voleu escriure els números, Edge Animate us ofereix un mètode alternatiu per canviar la mida de l'escenari: simplement col·loqueu el cursor sobre un dels números taronges. Quan el cursor es converteix en una fletxa doble (com es mostra), podeu fer clic i arrossegar per augmentar o reduir la mida de l'escenari.

Mida de l'escenari segons el percentatge de la mida de la pantalla

Si voleu crear una animació que no s'hagi d'ajustar a cap dimensió específica, hauríeu de canviar de píxels (px) a percentatge (%) fent clic al commutador (vegeu aquesta figura). Aquest és un pas per crear un disseny web responsive. Quan dimensioneu l'escenari per percentatge de pantalla en lloc de per valors de píxels, l'escenari es dimensiona segons la mida de l'element principal.

Un exemple d'element principal pot ser la mateixa finestra del navegador, si l'animació és una pàgina web autònoma. Tanmateix, si l'animació és una part d'una pàgina web, l'element pare pot ser un element div dins del qual s'imbrica l'animació.

Perquè el vostre Stage ompli tota la finestra del navegador, configureu l'amplada i l'alçada Stage al 100%, tal com es mostra en aquesta figura. Perquè el vostre Stage ompli la meitat de la finestra del navegador, configureu l'Stage al 50%; i així successivament, depenent de la part de la finestra del navegador que vulgueu que ocupi la vostra animació.

Per defecte, el fons de l'escenari és blanc. Per tant, no veureu cap diferència a l'etapa quan canvieu entre px i %.

Per provar la diferència entre utilitzar px i % per a la mida de l'escenari, canvieu el color de fons de l'escenari a una altra cosa que no sigui blanc, com ara el vermell. A continuació, experimenteu amb diferents percentatges i dimensions px per veure els diferents efectes.

Per canviar el color de fons de l'escenari (com es mostra), feu clic al quadrat blanc per obrir un selector de colors.

Podeu indicar a Edge Animate que mantingui les proporcions d'amplada i alçada iguals fent clic a la icona Amplada i alçada de l'enllaç (ressaltat en aquesta figura). Per defecte, la icona Amplada i Alçada de l'enllaç està desactivada; amb aquest valor predeterminat en efecte, Edge Animate no mantindrà l'amplada (o l'alçada) en la mateixa proporció quan canvieu la mida.