Categories
Risorse ActionScript

Scale 9 Bitmap

La Scale9 non funziona con le Bitmap, per questo ho deciso di condividere questa piccola Classe che ho chiamato Scale9Bitmap (con uno sforzo di originalita).

Loading spinner

Tra le caratteristiche più usate dell’ambiente di Flash c’è sicuramente la Scale 9 Grid.

Questo “ridimensionamento intelligente” ci permette di modificare le dimensioni di un MovieClip senza deformarne i contorni. Purtroppo esiste ancora un grosso limite all’utilizzo di questa tecnica: non funziona con le Bitmap.

Chi lavora con Flash da abbastanza tempo ricorderà che prima della versione 8 non esisteva uno Scale9, quindi era necessario dividere fisicamente un MovieClip in nove sezioni e ridimensionarle singolarmente, questa operazione è ancora necessaria quando abbiamo a che fare con delle Bitmap, così ho pensato di semplificare la vita ai miei pochi lettori condividendo una Classe che ho chiamato Scale9Bitmap (con uno sforzo di originalità).

Il filmato seguente mostra due istanze che utilizzano lo stesso file. A sinistra il file caricato è stato instanziato come Scale9Bitmap, a destra lo stesso file è stato instanziato utilizzando la Classe Bitmap (nativa di Flash):

[kml_flashembed publishmethod=”dynamic” fversion=”10.0.0″ useexpressinstall=”true” movie=”/wp-content/uploads/2010/08/testScale9Bitmap.swf” width=”480″ height=”240″ targetclass=”flashmovie”]Get Adobe Flash player

[/kml_flashembed]

Prima di decidere di scrivere questa Classe ho fatto delle ricerche per vedere se esisteva già una cosa simile ed effettivamente ho trovato moltissimi esempi in giro, ma nessuno di questi mi ha soddisfatto: la maggior parte degli esempi che ho reperito utilizzano uno Sprite contenitore con ben 9 elementi al suo interno, io ho pensato che una Bitmap con ridimensionamento intelligente dovesse rimanere Bitmap, con tutti i vantaggi che ne conseguono in termini di risorse impegnate e facilità di utilizzo.

La Classe funziona come una Bitmap, in più ha una sua Proprietà rectangle che definisce la porzione da ritagliare per il ridimensionamento. Visto che questa Classe estende la Classe Bitmap possiamo utilizzare tutti i Metodi e le Proprietà specifiche delle Bitmap, con la sola differenza che al mutare dei valori di width e height viene rigenerata completamente la BitmapData.

Se la proprietà rectangle viene lasciata null un’istanza di Scale9Bitmap si comporta esattamente come un’istanza di Bitmap.

Per ottenere la BitmapData ridimensionata possiamo richiamare la Proprietà Scale9Bitmap.bitmapData (come si fa per tutte le Bitmap).

Per ottenere o modificare la BitmapData originale (quella che viene usata come template) possiamo usare la Proprietà Scale9Bitmap.originalBitmapData.

L’archivio che potete scaricare in fondo all’articolo contiene questi file:

  • assets (cartella)
    • DemoBox.png (l’immagine utilizzata per l’esempio)
  • com (cartella)
    • danielealessandra (cartella)
      • display (cartella)
        • Scale9Bitmap.as (la Classe di cui stiamo parlando)
  • testScale9Bitmap.as (Codice per la Demo che vedete in alto)
  • testScale9Bitmap.fla (Filmato per la Demo che vedete in alto)

Spero che questa Classe possa essere utile a molti, per scaricare il file potete utilizzare il form qui sotto.

Inserisci nome e indirizzo email per iscriverti alla mia newsletter e ricevere il file immediatamente.
In breve: i dati inseriti in questo modulo saranno utilizzati per inviarti il link per scaricare il file che desideri, saranno conservati da un servizio esterno che si chiama MailChimp e in qualsiasi momento potrai cancellare la tua iscrizione al seguente link: https://danielealessandra.us7.list-manage.com/unsubscribe?u=546bebc381e525372d2120083&id=326af7d230.

Puoi leggere l'informativa completa cliccando sul link Privacy Policy che trovi dovunque su questa pagina, e comunque visitando in qualsiasi momento l'indirizzo https://www.danielealessandra.com/privacy-policy/
Ho letto e accetto l’informativa sulla privacy.

Buon ridimensionamento intelligente a tutti.

Loading spinner

3 replies on “Scale 9 Bitmap”

Ciao, volevo sapere se possibile, come fare 4 bordi tipo cornice adattabili con l’on resize, grazie!

Loading spinner

Ciao Emanuele,

se la tua “cornice” è un’immagine puoi utilizzare questa Classe, se invece stai utilizzando delle forme vettoriali va già bene lo Scale9 tradizionale.

In tutti e due i casi puoi inserire una funzione da richiamare all’Evento Resize del contenitore (che sia lo Stage o che sia un altro elemento) che ridimensioni la tua cornice utilizzando le proprietà width e height del target dell’Evento.

Se mi descrivi meglio le tue esigenze sarò lieto di darti una mano.

Loading spinner

Leave a Reply

Your email address will not be published. Required fields are marked *