Voorbeeld van het filteren van weergaveobjecten: Filter Workbench

De toepassing Filter Workbench is ontworpen om u te helpen experimenteren met diverse filtereffecten en het genereren van de relevante ActionScript-code voor die effecten. U kunt kiezen uit drie verschillende bestanden met zichtbare inhoud (inclusief bitmapafbeeldingen en een animatie die met Flash is gemaakt) en u kunt acht verschillende ActionScript-filters toepassen op de geselecteerde afbeelding, zowel afzonderlijk als in combinatie met andere filters. De toepassing bevat de volgende filters:

• Schuine-kantfilter (flash.filters.BevelFilter)

• Vervagend filter (flash.filters.BlurFilter)

• Kleurenmatrixfilter (flash.filters.ColorMatrixFilter)

• Convolutiefilter (flash.filters.ConvolutionFilter)

• Slagschaduwfilter (flash.filters.DropShadowFilter)

• Gloedfilter (flash.filters.GlowFilter)

• Verlopende schuine-kantfilter (flash.filters.GradientBevelFilter)

• Verlopende-gloedfilter (flash.filters.GradientGlowFilter)

Zodra een gebruiker een afbeelding heeft geselecteerd en een filter op die afbeelding heeft toegepast, wordt een deelvenster met besturingselementen weergegeven voor het instellen van de specifieke eigenschappen van het geselecteerde filter. De volgende afbeelding toont bijvoorbeeld de toepassing met een geselecteerd schuine-kantfilter:

Afbeelding groot weergeven

Terwijl de gebruiker de filtereigenschappen aanpast, wordt de voorvertoning realtime bijgewerkt. De gebruiker kan ook meerdere filters toepassen door een filter aan te passen, te klikken op de knop Toepassen, een volgend filter aan te passen, nogmaals op de knop Toepassen te klikken enzovoort.

De filterdeelvensters van de toepassing bevatten een aantal functies en beperkingen:

• Het kleurenmatrixfilter bevat een set besturingselementen voor het rechtstreeks manipuleren van algemene afbeeldingseigenschappen, zoals helderheid, contrast, verzadiging en kleurtoon. Bovendien kunnen aangepaste kleurenmatrixwaarden worden opgegeven.

• Het convolutiefilter, dat alleen beschikbaar is in ActionScript, bevat een set veelgebruikte convolutiematrixwaarden, maar er kunnen ook aangepaste waarden worden opgegeven. De klasse ConvolutionFilter accepteert een matrix met willekeurige grootte, maar de toepassing Filter Workbench gebruikt standaard een matrix van 3 x 3, de meestgebruikte filtergrootte.

• Het verschuivingskaartfilter en het arceringsfilter, alleen beschikbaar in ActionScript, zijn niet beschikbaar in de toepassing Filter Workbench.

De toepassing Filter Workbench bevat een set klassen, één voor elk van de beschikbare filters, die worden gebruikt door de afzonderlijke deelvensters om de filters te maken. Wanneer een gebruiker een filter selecteert, maakt de ActionScript-code die is gekoppeld aan het filterdeelvenster een instantie van de juiste filterfabrieksklasse. (Deze klassen staan bekend als fabrieksklassen omdat zij instanties van andere objecten maken, zoals een fabriek afzonderlijke producten maakt.)

Op het moment dat de gebruiker een eigenschapwaarde in het deelvenster wijzigt, wordt aan de hand van de code van het deelvenster de juiste methode in de fabrieksklasse aangeroepen. Elke fabrieksklasse bevat specifieke methoden die het deelvenster gebruikt om de juiste filterinstantie te maken. Wanneer de gebruiker bijvoorbeeld het vervagende filter selecteert, maakt de toepassing een instantie van BlurFactory. De klasse BlurFactory bevat een methode modifyFilter() die drie parameters accepteert: blurX, blurY en quality, die tezamen worden gebruikt om de gewenste instantie BlurFilter te maken:

private var _filter:BlurFilter; 
 
public function modifyFilter(blurX:Number = 4, blurY:Number = 4, quality:int = 1):void 
{ 
    _filter = new BlurFilter(blurX, blurY, quality); 
    dispatchEvent(new Event(Event.CHANGE)); 
}

Wanneer de gebruiker daarentegen het convolutiefilter selecteert, heeft de gebruiker meer flexibiliteit ter beschikking en dus een grotere set eigenschappen om te beheren. In de klasse ConvolutionFactory wordt de volgende code aangeroepen wanneer de gebruiker een andere waarde in het filterdeelvenster selecteert:

private var _filter:ConvolutionFilter; 
 
public function modifyFilter(matrixX:Number = 0,  
                                                matrixY:Number = 0,  
                                                matrix:Array = null,  
                                                divisor:Number = 1.0,  
                                                bias:Number = 0.0,  
                                                preserveAlpha:Boolean = true,  
                                                clamp:Boolean = true,  
                                                color:uint = 0,  
                                                alpha:Number = 0.0):void 
{ 
    _filter = new ConvolutionFilter(matrixX, matrixY, matrix, divisor, bias, preserveAlpha, clamp, color, alpha); 
    dispatchEvent(new Event(Event.CHANGE)); 
}

Telkens wanneer de filterwaarden worden gewijzigd, verzendt het fabrieksobject een gebeurtenis Event.CHANGE om aan listeners te melden dat de waarden van het filter zijn gewijzigd. De klasse FilterWorkbenchController, die de filters werkelijk op de gefilterde inhoud toepast, luistert naar die gebeurtenis om te bepalen wanneer deze een nieuwe kopie van het filter moet ophalen en opnieuw op de gefilterde inhoud moet toepassen.

De klasse FilterWorkbenchController hoeft geen specifieke details van elke filterfabrieksklasse te weten, maar moet wel weten dat het filter is gewijzigd en moet een kopie van het filter kunnen benaderen. Hiertoe bevat de toepassing een interface, IFilterFactory, die het gedrag definieert dat een filterfabrieksklasse moet bieden zodat de instantie FilterWorkbenchController van de toepassing correct kan functioneren. IFilterFactory definieert de methode getFilter() die wordt gebruikt in de klasse FilterWorkbenchController:

function getFilter():BitmapFilter;

De interfacemethodedefinitie getFilter() geeft op dat een instantie BitmapFilter moet worden geretourneerd in plaats van een specifiek type filter. De klasse BitmapFilter definieert geen specifiek type filter. In plaats daarvan is BitmapFilter de basisklasse voor alle filterklassen. Elke filterfabrieksklasse definieert een specifieke implementatie van de methode getFilter() waarin een verwijzing wordt geretourneerd naar het filterobject dat is gebouwd. Hier ziet u bijvoorbeeld een verkorte versie van de broncode van de klasse ConvolutionFactory:

public class ConvolutionFactory extends EventDispatcher implements IFilterFactory 
{ 
    // ------- Private vars ------- 
    private var _filter:ConvolutionFilter; 
    ... 
    // ------- IFilterFactory implementation ------- 
    public function getFilter():BitmapFilter 
    { 
        return _filter; 
    } 
    ... 
}

In de implementatie van de klasse ConvolutionFactory van de methode getFilter() wordt een instantie ConvolutionFilter geretourneerd, hoewel elk object dat getFilter() aanroept niet noodzakelijkerwijs hoeft te weten dat (volgens de definitie van de methode getFilter() waarnaar ConvolutionFactory handelt) een instantie BitmapFilter moet worden geretourneerd, waarbij het niet uitmaakt van welke ActionScript-filterklasse deze afkomstig is.

Zoals is beschreven in de vorige sectie, gebruikt de toepassing Filter Workbench een instantie van de klasse FilterWorkbenchController (waarnaar verder wordt verwezen als de ‘bedieningsinstantie’), die de filters daadwerkelijk op het geselecteerde zichtbare object toepast. Voordat de bedieningsinstantie een filter kan toepassen, moet deze eerst weten op welke afbeelding of zichtbare inhoud het filter moet worden toegepast. Wanneer de gebruiker een afbeelding selecteert, roept de toepassing de methode setFilterTarget() in de klasse FilterWorkbenchController aan, waarbij één van de constanten wordt doorgegeven die in de klasse ImageType is gedefinieerd:

public function setFilterTarget(targetType:ImageType):void 
{ 
    ... 
    _loader = new Loader(); 
    ... 
    _loader.contentLoaderInfo.addEventListener(Event.COMPLETE, targetLoadComplete); 
    ... 
}

Met behulp van die informatie laadt de bedieningsinstantie het opgegeven bestand en slaat dit op in een instantievariabele met de naam _currentTarget zodra het is geladen:

private var _currentTarget:DisplayObject; 
 
private function targetLoadComplete(event:Event):void 
{ 
    ... 
    _currentTarget = _loader.content; 
    ... 
}

Wanneer de gebruiker een filter selecteert, roept de toepassing de methode setFilter() van de bedieningsinstantie aan en geeft hierbij een verwijzing aan de bedieningsinstantie door naar het relevante filterfabrieksobject, die het opslaat in een instantievariabele met de naam _filterFactory.

private var _filterFactory:IFilterFactory; 
 
public function setFilter(factory:IFilterFactory):void 
{ 
    ... 
     
    _filterFactory = factory; 
    _filterFactory.addEventListener(Event.CHANGE, filterChange); 
}

Zoals eerder beschreven, weet de bedieningsinstantie niet wat het specifieke gegevenstype is van de filterfabrieksinstantie die eraan wordt gegeven; de instantie weet alleen dat het object de instantie IFilterFactory implementeert, met andere woorden, het heeft een methode getFilter() en verzendt een gebeurtenis change (Event.CHANGE) wanneer het filter wordt gewijzigd.

Wanneer de gebruiker de eigenschappen van een filter wijzigt in het filterdeelvenster, ziet de bedieningsinstantie dat het filter is gewijzigd via de filterfabrieksgebeurtenis change, die de methode filterChange() van de bedieningsinstantie aanroept. Die methode roept vervolgens de methode applyTemporaryFilter() aan:

private function filterChange(event:Event):void 
{ 
    applyTemporaryFilter(); 
} 
 
private function applyTemporaryFilter():void 
{ 
    var currentFilter:BitmapFilter = _filterFactory.getFilter(); 
     
    // Add the current filter to the set temporarily 
    _currentFilters.push(currentFilter); 
     
    // Refresh the filter set of the filter target 
    _currentTarget.filters = _currentFilters; 
     
    // Remove the current filter from the set 
    // (This doesn't remove it from the filter target, since  
    // the target uses a copy of the filters array internally.) 
    _currentFilters.pop(); 
}

Het toepassen van het filter op het weergaveobject gebeurt binnen de methode applyTemporaryFilter(). De bedieningsinstantie haalt eerst een verwijzing op naar het filterobject door de filterfabrieksmethode getFilter() aan te roepen.

var currentFilter:BitmapFilter = _filterFactory.getFilter();

De bedieningsinstantie bevat een instantievariabele Array met de naam _currentFilters, waarin deze alle filters opslaat die op het weergaveobject zijn toegepast. De volgende stap bestaat uit het toevoegen van het recent bijgewerkte filter aan die array:

_currentFilters.push(currentFilter);

Vervolgens wijst de code de array van filters toe aan de eigenschap filters van het weergaveobject, die de filters daadwerkelijk op de afbeelding toepast:

_currentTarget.filters = _currentFilters;

Ten slotte, omdat het laatst toegevoegde filter nog steeds het ‘werkende’ filter is, moet het niet permanent worden toegepast op het weergaveobject, daarom wordt het verwijderd uit de array _currentFilters:

_currentFilters.pop();

Het verwijderen van dit filter uit de array heeft geen effect op het gefilterde weergaveobject, omdat een weergaveobject een kopie maakt van de array filters wanneer deze wordt toegewezen aan de eigenschap filters en het gebruikt die interne array in plaats van de oorspronkelijke array. Daarom hebben wijzigingen in de array van filters geen effect op het weergaveobject totdat de array nogmaals wordt toegewezen aan de eigenschap filters van het weergaveobject.