, skabe skik filtre med pixel bender værktøjskasse,,,,, andel,,,,,,,,,,,,,,, det cyber - mandag envato tuts + kurser vil blive reduceret til $3.- og' t miss.,,, to gange om måneden, kan vi se på nogle af vores læsere favorit stillinger fra hele historien om activetuts +.denne forelæsning blev offentliggjort første gang i september 2009,.,, hej igen, mit navn er andre gange é og i denne forelæsning vil jeg vise, hvordan man skaber skik filtre med pixel - værktøjer, så brug dem med lyn cs4 til produktionen. pbj filer., * denne funktion virker kun i flash spiller 10..,, trin 1: pixel bender værktøjssæt, pixel - toolkit kommer med adobe mester indsamling cs4 pakning, eller du kan downloade på http: //laboratorier. adobe. kom /downloads /pixelbender. html.,, trin 2: det grundlæggende, før vi indfører filter, skal vi forstå de grundlæggende funktioner og typer af sprog.det er anderledes at blinke, og meget enklere.,, input nøgleord: er det input, billede, billede, som vil blive læst og arbejdede på.vi kan få op til 2 inputbilleder, i kodeksen, der arbejder med et billede vil skabe et filter, og arbejder med 2 billeder vil skabe en blanding tilstand.input er altid type "image4", som er et billede på rgba tilstand (røde, grønne, blå og alfa). den produktion, nøgleord: her er produktionen, pixel, i modsætning til input.dette vil ikke produktionen det image, det vil bare produktion den pixel læser i rgba.det er type "pixel4" (og ikke image4 som input).,, parameter nøgleord: parameter, nøgleord, vil fungere som en setter funktion.med den parameter, værdierne af filteret kan ændres, når det er i brug.parameteren må følges op af den type og navn, og kan også have en minimumsværdi, maksimale værdi og standardværdi.eksempel: parameter, int dimension < minvalue: 1; maxvalue: 10, defaultvalue: 1; > eller parameter flyde myfloat < minvalue: 1, 0; maxvalue: 2, 0; defaultvalue: 1 >,.også denne parameter kan være maskin - float2, float3, float3, int1, int2...eksempel: parameter, float2 test < minvalue: float2 (1.0,2.0); maxvalue: float2 (5); defaultvalue: float2 (1.0,2.0). >, også vi har typer planglas, float2, float3, float4, int, int2, int3, int4 og mange andre, som vi ikke vil bruge her.også nogle typer arbejder ikke med flash spiller 10, så jeg vil ikke komme ind på dem nu.jeg vil dog tale lidt om de typer, jeg har nævnt her, og hvordan de virker.,, type planglas, float2, float3 og float4: når man skaber et float4 type, for eksempel, du skaber en række 4 flyde værdier.i pixelbender flyderen værdier er fastsat af dot, men float() fungerer også som en funktion til at omdanne andre antal værdier i flyde.for eksempel "float4 test = float4 (1,2,3,4);".her har vi en genstand med 4 - værdier (type flyde) i "test" variabel.du kan også skabe en float4 genstand fra en værdi for eksempel: "float4 test = float4 (3);".her har vi en genstand med 4 - værdier (rgba) og alle de samme værdier (3,0 flyde).når man laver en svæver værdi, kan man også skabe det med en dot som, "flyde test = 1, 0;".hvis du forsøger at definere det som "flyde test = 1;", det vil kaste en fejl, fordi tallene uden en plet på pixelbender arbejde som int værdier., så flyder altid er defineret af dot.selv med "float()" at skabe flyde værdi vil vende tilbage til en række med en prik.endelig har adgang til flyde værdier med mere end en værdi, kan du bruge syntaks som et system, adgang, "variabel [0] eller variabel [1] eller variabel [2]...".,, type int, int2, int3 og in4 er det samme som at flyde former, men har ingen prikker.du kan også ændre antal værdier ved hjælp af "int" funktioner.,, evaluatepixel(): denne funktion løber over hele billedet, pixel af pixel, og vender tilbage, output - pixel4.i praksis filtre til flash, vi altid bruger denne funktion.,, outcoord(): denne funktion returnerer den nuværende koordinering af pixel bliver læst af evaluatepixel funktion.det vender tilbage til en værdi af type float2, x - og y - værdier, og kan konsulteres af [...] som system eller. x og y som. genstand.for eksempel, var ud = outcoord(); //. x, er den samme for [0] og. y, er den samme for [1],.,, samplenearest (kilde, pixelcoordinate): denne funktion, returnerer den float4 værdi af pixel fra kilden image (image4) på koordinering "pixelcoordinate".vi normalt bruger "outcoord" funktion her. en bemærkning, når der flyder værdier, og du vil tilføje /træk /formere sig eller dele værdier med andre svæver værdi af samme længde, du kan bruge dem som eksempel:, float4 test1 = float4 (3.0,2.0,2.0,3.0); float4 test2 = float4 (1.0,2.0,2.0,1.0); float4 resultat = test1-test2, vil resultatet blive en type float4 med værdier, 2, 0, 0, 0 og 2, 0.også, du kunne bruge:, float4 test1 = float4 (3.0,2.0,2.0,3.0); float4 test2 = float4 (1.0,2.0,2.0,1.0); float4 resultat = test1; resultat [0] = test1 [0] - test2 [0] resultat [2] - = 0, 5; jeg tror, at det er nok at forstå strukturen i pixel - kode, lad os gå videre til det næste skridt, efter at jeg har nævnt, lige en ting mere:, før prøvningen et filter, er det vigtigt at lade mindst ét billede (sag > belastning billede 1 ").at teste filteret, du kan komme til at bygge > løb, hvis filteret er parametre, på den højre side af den ansøgning, du vil se schneider at ændre værdier.de ændrer på runtime og har en levende billede, eftersom hvert tryk på flugt igen.,, trin 3: skabe en ny pixel - filter, dette filter er pixel - værktøjer, men er en af simple filtre til at forklare.for mere om pixel - sprog, der er ramt af f1 - knap i programmet, og hjælp i. pdf - vil åbne., når programmet er åbent, skabe en ny kerne filter (sag > nye kerne filter) programmet vil skabe en misligholdelse struktur for filter:, < languageversion: 1,0; > kernel newfilter < namespace: "din namespace" sælger: "din sælger" version: 1; beskrivelse: "din beskrivelse" > (input image4 src; produktion pixel4 dst; tomrum evaluatepixel() (dst = samplenearest (src, outcoord())}}, i kernen newfilter du skifter navn newfilter for navnet på filteret.namespace, sælger, version og beskrivelse, jeg behøver ikke at forklare det, bare dine strenge som forslagsstiller, version (int) og beskrivelse., inputbilledet bliver billedet fyldt af filter, og produktionen vil være pixel, der genereres af evaluatepixel funktion.resultatet vil være en pixel4 værdi som følge af evaluatepixel funktion, dvs. pixel af pixel af input - image, som jeg har forklaret. på linje ", dst = samplenearest (src, outcoord());" vi bliver værdien af den nuværende pixel, og koordinere outcoord() fra image src (input image), så vi kan ændre de værdier for rgba værdi af dst.for eksempel, hvis vi ønsker at vende farver inputbilledet, kunne vi gøre følgende:, dst = samplenearest (src, outcoord()); dst. rgb = float3 (1) - dst. rgb;, hvad laver vi her?vi siger, at rgb værdi af denne pixel er den vifte af float3 værdi minus den oprindelige værdi af rgb, så den farve skal vendes.du kan bruge den dst.rgb i stedet for at bruge dst [0] dst [1].og for efter - kan være enhver ordre, vil det at læse hvert brev som værdien af den farve.for eksempel, du kan bruge dst. 2 = float3 (1) -dst.gbr.en anden ting, du kan gøre, er at ændre farver billedet.f.eks. ved at anvende kodeksen nedenfor (i evaluatepixel funktion):, dst = samplenearest (src, outcoord()); dst. rgb = dst. grx; denne kodeks vil produktionen et mærkeligt farvet image.,, trin 4: prøvning af en klar adfærdskodeks fra adobe, lad os prøve et filter fra adobe.det er godt for prøvning af opbrydning filter, så gå til at indsende > åben; i den mappe, hvor pixel - er installeret, er der nogle filtre.lad os vælge opbrydning filter.når den er åben, du kan slå "løb" knap til at teste filteret.hvis du ønsker at eksportere, gå til at indsende > eksport kernel filter for flash - spiller.dette vil eksportere filter til brug med lyn, du kan lade et filter med urlloader eller omfatter med omfatter brik fra flex sdk.i denne forelæsning vil jeg vise, hvordan man arbejder med den indbyggede fil, idet filtret vejer kun 4kb til 15kb (det er meget let). de output udvidelse er en. pbj fil.,, løntrin 5: skabe mappen struktur, hvis du har en classpath for flash, brug din classpath, hvis du har ikke et og ønsker at skabe en åben mine tidligere forelæsning, og følg trin 1.hvis du ikke vil have en classpath, anvende den samme mappe din. fia - dokument.lad os antage, at classpath til forelæsning. i din classpath skabe mappen "pixelbender".så i "pixelbender" mappe inde i dit classpath skabe mappen "pbj".en kopi af det. pbj fil (eksempel: opbrydning. pbj) til dette pbj mappe, du har skabt, trin 6: oprettelse af klasse for opbrydning filter, åbne flash cs4 eller flex med ajourførte sdk for fp10.hvis du bruger flash, er det vigtigt at fælde flex sdk for flash.hvis du ikke ved, hvordan man gør det, ramte "ctrl + u" til at åbne de præferencer flash, så vælg "actionscripts" i kategori, "actionsctipt 3,0 omgivelser".i vinduet "actionscript 3,0 avancerede miljøer" klik "+" knap af biblioteket vej og tilføje følgende: $(flexsdk) /rammer /libs /flex. swc.tryk nu knap. nu skabe en ny. som fil, og kodning følgende: først vi pakken og indføre de nødvendige klasser, pakke pixelbender (import flash.display.shader; import flash.filters.shaderfilter; import flash. utils. bytearray; skabe offentlige klasse pixelatefilter forlængelse af shaderfilter.den shaderfilter kan anvendes som en normal filter i filteret vifte af displayobject. offentlige klasse pixelatefilter udvider shaderfilter {, omfatter de pixelate.pbj fil i mappen pbj (vi antager at vi redder. som i opbrydning folder med vores classpath).de omfatter tag er en flex mærke, som inddrager filer i et omvendt i stedet for at laste dem.der er mange former, som de kan integrere, som. flyver, jpg og andre, og som mimetype - anvendelse /oktet stream - sagen vil blive indarbejdet i bytearray.den omfatter et skaber en klasse for indbyggede sag her. jeg er ved hjælp af en klasse, der hedder "filter"., [omfatter (kilde: "pbj /opbrydning. pbj" mimetype - = "anvendelse /oktet stream")] private var filter: klasse; i den pågældende, lad os skabe et tilfælde af vores indbyggede fil, som bytearray.den bytearray er shader entreprenørens parameter, så vil vi også skabe shader instans med filter til "bytearray" som parameter for producenten.da vi er en udvidelse af shaderfilter, vi behøver ikke at skabe et tilfælde af shaderfilter.denne klasse er allerede shaderfilter udvides, så det eneste vi skal gøre er at sætte shader parameter for vores shaderfilter klasse som shader f.eks. offentlige funktion pixelatefilter(): ugyldig (var - filter: bytearray = nye filter() som bytearray; //den indlejrede fil, som bytearray var shader: shader = nye shader (filter); ////////de tilfælde af shader. shader = shader; //om parameter shader i vores klasse}, skaber vi et nyt parameter for vores klasse, og parameter "dimension".denne parameter, vil påvirke "parameter int dimension", der blev oprettet i pixelbender.etteren funktion vil ændre den værdi, og albuer funktion vil blive den aktuelle værdi.den shader data værdier kan læses af "f.eks. data. værdi", der er modtaget.hvis vi havde en parameter "parameter int2 holdning;" i filter for eksempel, ville vi få adgang til det med "f.eks. data. stilling [0]" og "f.eks. data. stilling [1]"., offentlig funktion, der dimension (værdi: antal) ugyldig (shader. data. dimension. værdi [0] = værdi;} offentligheden få dimension(): antal (tilbage shader. data. dimension. værdi [0]}, efter alt det, bare luk pakken og klassen.}}, nu klasse for dette filter er skabt, red. som fil med navnet "pixelatefilter." (det samme navn som klasse) i pixelbender mappe inde i dit classpath (samme navn som dit pakke, og hvor du har også skabt pbj mappe).,, trin 7: prøvning af nye filter, første skridt, skabe en ny. blp as3 dokument, gem det etnywhere du, f.eks. c: /mycustomfilter., fastlægge en klasse for. fia - dokument.luk egenskaber panel af. fia - dokument fra vinduet > egenskaber, i rubrikken "klasse" type "primære", og skabe en ny actionscript fil., kopiere billede til den samme mappe i. fia - dokument, f.eks. jeg har brugt en af stikprøven billeder fra pixel - eksempler; yellowflowers.png, der findes med kilden filer. hvis du ikke har tweenlite klasse endnu, vær venlig at downloade det til http://blog.greensock.com/tweenliteas3/, og tage indholdet af gs mappe inde i gs mappe i din classpath., skabe en ny. som dokument., omfatte de nødvendige klasser til vores classpath:, pakke (import flash.display.sprite; import flash.display.bitmap; import pixelbender.pixelatefilter; //skik filter mellem import - g.lite; //den bedste tweening klasse, skabe de vigtigste klasse af sprite klasse: offentlige klasse vigtigste udvider sprite {, omfatter det billede til prøvning, mimetype - er "image /men heller ikke dér er menneskene sikre", så vi har givet som billede ikke bytearray.navn klassen "img".og vi - en variabel, der hedder "filter" af den type, pixelatefilter, så vi kan bruge den i en funktion senere., [omfatter (kilde: "yellowflowers. men heller ikke dér er menneskene sikre" mimetype - = "image /men heller ikke dér er menneskene sikre")] private var img: klasse; private var filter: pixelatefilter; i den pågældende, vi begynder at skabe vores image, som vil blive berørt af filter, så læg billedet barn på scenen.så skabe tilfælde af pixelatefilter.vi har skabt det variable før, så vi ikke behøver at form igen.der filtreres dimension til 100, så vi kan se den effekt, det bedre, også tilføje filter til filterlist af vores vigtigste klasse. så ved hjælp af tweenlite klasse vi manipulerer filteret parameter.denne dimension parameter vil være animeret fra 100 til 1.mens animation opdateres, funktion "tweenliteupdate" er gennemført, og, når det er færdigt inspirerende "newtween" funktion vil blive henrettet. offentlige funktion main(): ugyldig (var - billede: bitmap = nye img() som bitmap; addchild (billede); - = nye pixelatefilter(); filter. dimension = 100;. filtre = [-] tweenlite. - filter, 3 (dimension: 1, onupdate: tweenliteupdate, oncomplete: newtween})), mens tweenlite opdateres, tweenliteupdate gennemføres, og ajourfører det filter af vores vigtigste klasse.uden denne metode, ville vi ikke se tweenlite ajourføring af filter. privat funktion tweenliteupdate(): ugyldig (. filtre = [-]}, da den første tweening animation, afslutter, vil det være den newtween funktion.den første linje i denne funktion vil kontrollere, hvis filteret dimension værdi er 1.hvis det er tilfældet, vil sætte dim variabel til 100, der sætter den variabel 1.det er det samme med hvis og andre, eller at skifte.den anden linje vil begynde tweening aktivering af filteret igen. privat funktion newtween(): ugyldig (var - dim: antal = (filter. dimension = = 1).100:1; tweenlite. - filter, 3 (dimension, dim onupdate: tweenliteupdate, oncomplete: newtween})}, bare luk pakken og klassen med dobbelt "}".,), redde din fil som "vigtigste." i den samme mappe på din fia - fil. og hvis alle filer og mappe er okay, du kan teste din fil.den informationskampagne vil begynde pixelated, ændrer den normale image og loop kontinuerligt.,, jeg håber, du kan lide det, og jeg håber, at det vil være meget nyttigt.i adobe udveksling, der er mange andre filtre, du kan downloade, nogle af dem er fri og åben kilde.jeg har også nogle andre. pbj og klasser med kilden til at studere.for eksempel, spherizefilter.as: http://cavallari.freehostia.com/spherize/, der driver af placeringen af mus.