Jag ska lära dig hur du använder varje blandningsläge i Flash. Enkelt uttryckt används blandningslägen för att ändra färgvärden eller transparens i bilder. Precis som namnet antyder används blandningslägen för att blanda bilder tillsammans. Blandningslägen används ofta för speciella effekter eller kompositioner i spel, filmer och bildredigerare. Från explosioner, skärmövergångar, maskering och belysning har blandningslägen många applikationer i flashprojekt.
Ändra blandningsläget med användargränssnittet i det övre hörnet och dra bilderna runt för att skapa olika effekter?
Blandningslägen gör en sammansatt bild och skapar intressanta effekter genom att blanda pixlar i överlappande bilder eller filmklipp. Blandningslägen påverkar pixelfärgen och genomskinligheten. Du kan använda blandningslägen för att betona höjdpunkter eller skuggor, eller för att ändra färger i en bild.
Du kanske märker att vissa blandningslägen är lite lika, men de är inte samma. Vissa blandningslägen är direkta motsatser till varandra, men du behöver veta vilken som ska användas i en given situation.
Blandningslägen använder ett bakgrundslag och ett blandningsskikt ovanpå för att ge dig ett slutligt modifierat lager. Varje pixel från bakgrunden ses på och modifieras av blandningsbilden ovanpå, vilket ger dig den sammansatta bilden. Färger och transparens tas in i ekvationen när pixlarna behandlas. Alla visningsobjekt - inklusive Sprites, Bitmaps och MovieClips - har en blendMode-egenskap som du kan ändra för att få en effekt du letar efter. Du kan ställa in egenskapen blendMode till de konstanter som definieras i klassen flash.display.BlendMode, eller du kan använda de aktuella strängvärdena i citat istället.
Blandningslägen ändrar ofta färgerna på det lag som du bifogar blandningsläget till, så du måste experimentera med olika färger och blandningslägen för att se hur resultaten ser ut. Experimentera med olika blandningslägen kan ge dig en uppfattning om hur de fungerar. Du bör notera att olika färger ofta spelas in med olika blandningslägen, och du kanske inte får samma resultat beroende på dina bakgrundsbilder och de blandade bilderna som används. Du bör också vara medveten om den ordning du tillämpar dina blandningslager, eftersom olika order ger olika resultat.
displayObject.blendMode = BlendMode.ADD;
eller
displayObject.blendMode = 'add';
Det är upp till dig! Men för det första alternativet, se till att du importerar flash.display.BlendMode
.
Många kommer bara att glida genom varje blandningsläge tills de får en effekt som ser bra ut, men jag vill förklara för dig hur varje blandningsläge fungerar, och visa några exempel eller scenarier där blandningslägen kan vara användbara. Som spelutvecklare använder jag exempel på blandningslägen i en spelkontext. Generellt använder jag blandningslägen för saker som dimma, explosioner, partiklar och belysning, men blandningslägen har oändliga användningsområden och funktioner som du måste komma på med!
Jag ska prata om dessa blandningslägen i par eller grupper. De flesta blandningslägena kommer med en liknande eller direkt motsatt partner. Idag täcker jag blandningslägena som anges nedan.
Beskrivning och exempel på användning
NORMAL applicerar färg normalt, utan interaktion med basfärgerna.
Det första blandningsläget som jag behöver prata om är NORMAL-blandningsläget. Det är i grunden standardblandningsläget som inte tillämpar någon blandning på bakgrundsbilden.
När du experimenterar med olika blandningslägen använder du NORMAL-blandningsläget för jämförelse.
Användning av NORMAL-blandningsläget är detsamma som att du inte använder ett blandningsläge alls. Att veta att blandningslägen kräver bearbetning och ofta påverkar resultatet av ditt Flash-projekt, bör du försöka begränsa blandningsläge om du kan.
50 objekt med NORMAL blandning är mycket snabbare än 50 objekt med OVERLAY eller HARDLIGHT blandningslägen.
Teknisk beskrivning
Visningsobjektet visas som normalt ovanpå bakgrunden. Inga färgvärden eller växelkursändringar ändras.
Exempel:
displayObject.blendMode = BlendMode.NORMAL;
eller
displayObject.blendMode = 'normal';
Beskrivning och exempel på användning
LAYER-blandningsläget liknar NORMAL-blandningsläget, eftersom det inte ändrar färger. LAYER-blandningsläget tvingar dock skapandet av en transparensgrupp eller en alfakanal. Det ställer väsentligen lagrets opacitet till 100%.
NOTERA: Detta krävs för att komposera med ALPHA eller ERASE blandningslägen, som jag kommer att prata om nästa.
Teknisk beskrivning
Gjorde på samma sätt som NORMAL-blandningsläget med 100% opacitet. Skapandet av alfakanalen tillåter att lagret modifieras av andra blandningslägen som påverkar genomskinlighet, som ALPHA eller ERASE.
Exempel:
displayObject.blendMode = BlendMode.LAYER;
eller
displayObject.blendMode = 'lager';
Beskrivning och exempel på användning
ALPHA-blandningsläget ändrar transparensen i bakgrundsskiktet, vilket gör det genomskinligt om olika områden, beroende på blandningsskiktets genomskinlighet.
Teknisk beskrivning
ALPHA-blandningsläge applicerar en alfaskarm där de transparenta bildpunkterna i blandningsskiktet påverkar bakgrundsskiktets transparens. Vanligtvis använder du ett andra bakgrundslag med detta blandningsläge, som visas genom den första bakgrunden när den görs transparent.
LAYER-blandningsläge måste tillämpas på det överordnade visningsobjektet, vilket fungerar som den första bakgrunden som ska göras transparent.
Exempel:
displayObject.blendMode = BlendMode.ALPHA;
eller
displayObject.blendMode = 'alfa';
Beskrivning och exempel på användning
ERASE-blandningsläget är motsatsen till ALPHA-blandningsläget, men ändrar ändå övergångsvalet för bakgrundsskiktet, vilket gör det genomskådligt om olika områden beroende på blandningsskiktets genomskinlighet.
Teknisk beskrivning
ERASE-blandningsläget fungerar som ALPHA-blandningsläge, men applicerar en inverterad alfaskerm, där de opaka pixlarna i blandningsskiktet påverkar bakgrundsskiktets transparens, vilket gör de pixlarna transparenta. Vanligtvis använder du ett andra bakgrundslag med detta blandningsläge, som visas genom den första bakgrunden när den görs transparent.
LAYER-blandningsläge måste tillämpas på det överordnade visningsobjektet, vilket fungerar som den första bakgrunden som ska göras transparent.
Exempel:
displayObject.blendMode = BlendMode.ERASE;
eller
displayObject.blendMode = 'radera';
Beskrivning och exempel på användning
ADD-blandningsläget används för att stärka vita och lätta överlappande färger. Färgerna i blandningsskiktet ovanför mittområdet lätta bakgrundsskiktet, medan mörkare färger är transparenta, vilket gör att bakgrundsskiktet är orört.
Teknisk beskrivning
ADD-blandningsläge lägger bokstavligen till hexfärgvärdena för blandningsskiktet till bakgrundsskiktet. Det kan inte gå högre än vitt.
Exempel:
displayObject.blendMode = BlendMode.ADD;
eller
displayObject.blendMode = 'add';
Beskrivning och exempel på användning
SUBTRACT-blandningsläget mörker bakgrundsskiktet och kan betraktas som motsatsen till ADD-blandningsläget. Vita områdena i blandningsskiktet gör bakgrundsskiktet svart, medan svarta områden i blandningsbilden inte påverkar bakgrundsskiktet.
SUBTRACT-blandningsläget används för att stärka svarta och mörkare överlappande färger. Färgerna på blandningsbilden över mittområdet är mörkare, medan ljusare färger är transparenta, vilket gör att bakgrundsskiktet är orört.
Teknisk beskrivning
SUBTRACT-blandningsläget subtraherar hex-färgvärdena för blandningsskiktet till bakgrundsskiktet. Den kan inte gå lägre än svart.
Exempel:
displayObject.blendMode = BlendMode.SUBTRACT;
eller
displayObject.blendMode = 'subtrahera';
Beskrivning och exempel på användning
LIGHTEN använder de ljusare färgade pixlarna från varje lager. På samma sätt som ADD-blandningsläget används den för att stärka lättare områden i de överlappande skikten. Varje pixel från varje lager ses och ljuset på de två pixelvärdena hålls.
Teknisk beskrivning
LIGHTEN ersätter bakgrundspixlar som är mörkare än pixlarna för blandningsskiktet. Bakgrundspixlar lättare än pixlarna för blandningsskiktet ändras inte.
Exempel:
displayObject.blendMode = BlendMode.LIGHTEN;
eller
displayObject.blendMode = 'lighten';
Beskrivning och exempel på användning
DARKEN använder de mörkare färgade pixlarna från varje lager. Det är motsatsen till LIGHTEN-blandningsläget och används för att stärka mörkare områden i de överlappande skikten. Varje pixel från varje lager tittas på och den mörkare av de två pixelvärdena hålls. Detta kan användas för att lägga till olika textureffekter till vårt bakgrundsskikt.
Teknisk beskrivning
DARKEN ersätter bakgrundspixlar som är ljusare än pixlarna för blandningsskiktet. Bakgrundspixlar som är mörkare än pixlarna för blandningsskiktet ändras inte.
Exempel:
displayObject.blendMode = BlendMode.DARKEN;
eller
displayObject.blendMode = 'darken';
Den andra delen av denna handledning (kommer snart) kommer att täcka de återstående blandningslägena:
Håll dig igång!