Vi presenterer blandingsmodus i Flash

Jeg skal lære deg hvordan du bruker hver blandingstilstand i Flash. Enkelt sagt, blandingsmoduser brukes til å endre fargeverdier eller gjennomsiktighet i bilder. På samme måte som navnet antyder, brukes blandingsmoduser til å blande bilder sammen. Blendmodusene brukes ofte til spesielle effekter eller komposisjoner i spill, filmer og bildeditorer. Fra eksplosjoner, skjermoverganger, maskering og belysning har blandingsmodus mange applikasjoner i flash-prosjekter.


Rask forhåndsvisning

Endre blandingstilstanden ved hjelp av brukergrensesnittet i øverste hjørne og dra bildene rundt for å skape forskjellige effekter?


Se på Screencast?


? eller Les Tut

Blendmodusene gjør et sammensatt bilde og skaper interessante effekter ved å blande piksler i overlappende bilder eller filmklipp. Blendmodusene påvirker pikselfarge og gjennomsiktighet. Du kan bruke blandemodus til å understreke høydepunkter eller skygger, eller for å endre farger i et bilde.

Du kan legge merke til at noen blandemoduser er litt like, men de er ikke det samme. Noen blandemoduser er direkte motsetninger til hverandre, men du må vite hvilken en skal bruke i en gitt situasjon.


Hvordan fungerer de?

Blandemodi bruker et bakgrunnslag og et blandingslag på toppen for å gi deg et endelig endret lag. Hver piksel fra bakgrunnen blir sett på og modifisert av det blandede bildet på toppen, og gir deg det sammensatte bildet. Farger og gjennomsiktighet tas i ligningen når pikslene behandles. Alle visningsobjekter - inkludert Sprites, Bitmaps og MovieClips - har en blendMode-egenskap som du kan endre for å få en effekt du leter etter. Du kan angi egenskapen blendMode til konstantene som er definert i flash.display.BlendMode-klassen, eller du kan bruke de faktiske strengverdiene i sitater i stedet.

Blendmodus endrer ofte fargene på laget du knytter til blandemodus til, så du må eksperimentere med forskjellige farger og blandemoduser for å se hvordan resultatene ser ut. Eksperimentering med ulike blandingstilstander kan gi deg en ide om hvordan de fungerer. Du bør være oppmerksom på at forskjellige farger ofte kommer inn i spill med forskjellige blandingstilstander, og du kan ikke få de samme resultatene avhengig av bakgrunnsbildene dine og de blandede bildene som brukes. Du bør også være oppmerksom på rekkefølgen du bruker blandingslagene dine, da forskjellige ordrer gir forskjellige resultater.


Hurtigeksempel:

displayObject.blendMode = BlendMode.ADD;

eller

displayObject.blendMode = 'add';

Det er opp til deg! For det første alternativet må du imidlertid forsikre deg om at du importerer flash.display.BlendMode.

Mange mennesker vil bare skyve gjennom hver av blandemodusene til de får en effekt som ser bra ut, men jeg vil forklare hvordan hver blandingstilstand fungerer, og vise deg noen eksempler eller scenarier der blandingsmoduser kan være nyttige. Som spillutvikler vil jeg bruke eksempler på blandemodus i en spillekontekst. Vanligvis bruker jeg blandingsmoduser for ting som tåke, eksplosjoner, partikler og belysning, men blandingsmodusene har uendelige bruksområder og funksjoner som du må komme opp med!

Jeg skal snakke om disse blandemodusene i par eller grupper. De fleste blandingstilstandene kommer med en lignende eller direkte motsatt partner. I dag skal jeg dekke blandingsmodiene som er oppført nedenfor.

  • NORMAL
  • LAG
  • ALPHA
  • VISKE UT
  • LEGG TIL
  • TREKKE FRA
  • lysere
  • mørkere

Blandingsmodus: NORMAL

Beskrivelse og eksempler på bruk

NORMAL gjelder farge normalt, uten interaksjon med basisfargene.

Den første blandingsmodusen som jeg trenger å snakke om, er NORMAL blandingsmodus. Det er i utgangspunktet standard blandingsmodus som ikke passer til blanding av bakgrunnsbilde.

Når du eksperimenterer med forskjellige blandingstilstander, vil du bruke NORMAL-blandingsmodusen til sammenligning.
Bruke NORMAL-blandingsmodusen er den samme som ikke bruker en blandingstilstand i det hele tatt. Å vite at blandingsmodi krever behandling og ofte har en innvirkning på ytelsen til ditt Flash-prosjekt, bør du prøve å begrense bruksmodusbruk hvis du kan.

50 gjenstander med NORMAL blanding er mye raskere enn 50 gjenstander med OVERLAY eller HARDLIGHT blanding modus.

Teknisk beskrivelse

Skjermobjektet vises som normalt øverst på bakgrunnen. Ingen fargeverdier eller omregning endres.

Eksempel:

displayObject.blendMode = BlendMode.NORMAL;

eller

displayObject.blendMode = 'normal';

Blendmodus: LAYER

Beskrivelse og eksempler på bruk

LAYER-blandingstilstanden ligner på NORMAL-blandingstilstanden, fordi den ikke endrer farger. LAGER-blendmodusen krever imidlertid opprettelse av en gjennomsiktighetsgruppe eller en alfakanal. Det setter i hovedsak lagets opasitet til 100%.

MERK: Dette kreves for å kompositt med ALPHA eller ERASE blandingsmodusene, som jeg snakker om neste.

Teknisk beskrivelse

Gjorde på samme måte som NORMAL-blandingstilstanden med 100% opasitet. Opprettelse av alfakanalen tillater laget å bli modifisert av andre blandemoduser som påvirker gjennomsiktighet, som ALPHA eller ERASE.

Eksempel:

displayObject.blendMode = BlendMode.LAYER;

eller

displayObject.blendMode = 'layer';

Blandingsmodus: ALPHA

Beskrivelse og eksempler på bruk

ALPHA-blandingsmodusen endrer gjennomsiktigheten til bakgrunnslaget, noe som gjør det gjennomsiktig hvis forskjellige områder, avhengig av blandingslagets gjennomsiktighet.

Teknisk beskrivelse

ALPHA-blandingsmodusen gjelder en alfaskjerm, hvor de gjennomsiktige piksler av blandingslaget påvirker gjennomsiktigheten av bakgrunnslaget. Vanligvis bruker du et andre bakgrunnslag med denne blandemodusen, som skal vises gjennom den første bakgrunnen når den blir gjennomsiktig.

LAYER-blandingsmodusen må brukes på det overordnede displayobjektet, som fungerer som den første bakgrunnen som skal gjøres gjennomsiktig.

Eksempel:

displayObject.blendMode = BlendMode.ALPHA;

eller

displayObject.blendMode = 'alfa';

Blandingsmodus: ERASE

Beskrivelse og eksempler på bruk

ERASE-blandingsmodusen er motsatt av ALPHA-blandingsmodusen, men endrer endringen av bakgrunnslaget til bakgrunnslaget, noe som gjør det gjennomsiktige hvis forskjellige områder, avhengig av blandingslagets gjennomsiktighet.

Teknisk beskrivelse

ERASE-blandingsmodus fungerer som ALPHA-blandingsmodus, men bruker en omvendt alfaskjerm, hvor de ugjennomsiktige piksler av blandingslaget påvirker gjennomsiktigheten av bakgrunnslaget, slik at disse pikslene er gjennomsiktige. Vanligvis bruker du et andre bakgrunnslag med denne blandemodusen, som skal vises gjennom den første bakgrunnen når den blir gjennomsiktig.

LAYER-blandingsmodusen må brukes på det overordnede displayobjektet, som fungerer som den første bakgrunnen som skal gjøres gjennomsiktig.

Eksempel:

displayObject.blendMode = BlendMode.ERASE;

eller

displayObject.blendMode = 'slette';

Blandingsmodus: ADD

Beskrivelse og eksempler på bruk

ADD-blandingsmodusen brukes til å styrke hvite og lette overlappende farger. Farger i blandingslaget over midtområdet lyser bakgrunnslaget, mens mørkere farger er gjennomsiktige, slik at bakgrunnslaget blir uberørt.

Teknisk beskrivelse

ADD-blandingsmodusen legger bokstavelig talt heksefargeverdiene til blandingslaget til bakgrunnslaget. Det kan ikke gå høyere enn hvitt.

Eksempel:

displayObject.blendMode = BlendMode.ADD;

eller

displayObject.blendMode = 'add';

Blandingsmodus: SUBTRACT

Beskrivelse og eksempler på bruk

SUBTRACT-blandingsmoduset mørker bakgrunnslaget, og kan betraktes som det motsatte av ADD-blandingsmodus. Hvite områder i blandingslaget slår bakgrunnslaget svart, mens svarte områder av blandingsbildet ikke påvirker bakgrunnslaget.

SUBTRACT-blandingsmodusen brukes til å styrke svarte og mørkere overlappende farger. Farger på blandingsbildet over midtområdet er mørkere, mens lettere farger er gjennomsiktige, og lar bakgrunnslaget stå uberørt.

Teknisk beskrivelse

SubTRACT-blandingsmodus trekker heksefargeverdiene til blandingslaget til bakgrunnslaget. Den kan ikke gå lavere enn svart.

Eksempel:

displayObject.blendMode = BlendMode.SUBTRACT;

eller

displayObject.blendMode = 'trekke fra';

Blandingsmodus: LYS

Beskrivelse og eksempler på bruk

LIGHTEN bruker de lettere fargede pikslene fra hvert lag. I likhet med ADD-blandingsmodusen, brukes den til å styrke lettere områder av de overlappende lagene. Hver piksel fra hvert lag er sett på, og lyseren av de to pikselverdiene holdes.

Teknisk beskrivelse

LIGHTEN erstatter bakgrunnspiksler som er mørkere enn blandingslagspikselene. Bakgrunnspiksler lettere enn blandingslagspikselene blir ikke endret.

Eksempel:

displayObject.blendMode = BlendMode.LIGHTEN;

eller

displayObject.blendMode = 'lighten';

Blandingsmodus: DARKEN

Beskrivelse og eksempler på bruk

DARKEN bruker mørkere fargede piksler fra hvert lag. Det er motsatt av LIGHTEN-blandingsmodusen, og brukes til å styrke mørkere områder av de overlappende lagene. Hver piksel fra hvert lag blir sett på, og den mørkere av de to pikselverdiene holdes. Dette kan brukes til å legge til forskjellige tekstur-effekter i vårt bakgrunnslag.

Teknisk beskrivelse

DARKEN erstatter bakgrunnspiksler som er lettere enn blandingslagspikselene. Bakgrunnspiksler mørkere enn pikslagspikslene endres ikke.

Eksempel:

displayObject.blendMode = BlendMode.DARKEN;

eller

displayObject.blendMode = 'mørkere';

Det neste steget

Den andre delen av denne opplæringen (kommer snart) vil dekke de gjenværende blandingstilstandene:

  • MULTIPLISERE
  • FORSKJELL
  • INVERT
  • SKJERM
  • OVER
  • HARDT LYS

Følg med!