Last updated on: 2009-02-18
Version: 1.0

AS3 Scale9 Bitmap


General:

AS3 Scale9 Bitmap is helper class that lets you create scale9 sprites with bitmap data fill - originally this was not possible in Flash 9. The helper class creates a "fake" scale 9 sprite containing 9 shapes that scale according to user-defined scaling matrix. Extremely useful for user interface work (creating buttons, scalable UI elements etc.).

Contents:

  • Scale9SimpleStateButton - class for creating resizing 1, 3 or 3 state buttons from bitmap data (skins);
  • Scale9SimpleBitmapSprite - class for creating static resizing UI elements from bitmap data (skins);
  • Example code (Flex Builder 3 project);

Requirements:

Actionscript 3

Demonstration 1:

Scale9SimpleStateButton (top left), Scale9SimpleBitmapSprite (top right) and original skin files (bottom row)


Demonstration 2:

UI elements created from a stylesheet using AS3 Scale9 Bitmap class, see this blog post for details.


Example Syntax:

Actionscript:
  1. var scale9_example:Rectangle = new Rectangle(6,6,105,20);
  2.            
  3. /* Initialize the button with all 3 states (normal, hover, down) using 3 different bitmaps */   
  4. var button_example:Scale9SimpleStateButton = new Scale9SimpleStateButton(
  5.     scale9_example,
  6.     button_skin_normal.bitmapData,
  7.     button_skin_hover.bitmapData,
  8.     button_skin_down.bitmapData
  9. );
  10.  
  11. /*
  12.   * Scale the button using "width" and "scaleY" properties
  13.   * (in general you can use "width", "height", "scaleY", "scaleX" properties for scaling)
  14.   */
  15.                 
  16. button_example.width = 300;
  17. button_example.scaleY = 2;

Latest version
Download link (48Kb)

11 Responses to “AS3 Scale9 Bitmap”

  1. Uza’s Blog & More » Blog Archive » AS3 Scale9 Bitmap - New In Codex Says:

    [...] Documentation Download AS3 Scale9 Bitmap [...]

  2. Actionscript Classes » AS3 Scale9 Bitmap Says:

    [...] http://www.uza.lt/codex/as3-scale9-bitmap/ [...]

  3. AS3 Scale9 Bitmap | 达达's Blog Says:

    [...] 翻译自:http://www.uza.lt/codex/as3-scale9-bitmap/ [...]

  4. Uza’s Blog & More » Blog Archive » MTV Stylesheet + Scale9 Bitmap Says:

    [...] know yesterday I released one of the new UI helper classes that we are using in this project - AS3 Scale9 Bitmap letting you create scalable, state aware UI elements from bitmap data. Today I will show you a very [...]

  5. ActionScript.lt » Archyvas » Lengvas būdas kurti rastrinius grafinės sąsajos elementus Says:

    [...] programuotojas Paulius Uza pristatė AS3 biblioteką, palengvinančią grafinės sąsajos elementų kūrimą naudojant rastrinius paveiksliukus. [...]

  6. Martijn Says:

    Seems very usefull, but as a newbie I cant get it to work. Getting the error :

    TypeError: Error #1007: Instantiation attempted on a non-constructor.
    at AS3Scale9Bitmap()

    Is it posible to provide a working fla file?

    Martijn

  7. 8 Classical ActionScript Classes About BitMap - Ntt.cc Says:

    [...] AS3 Scale9 Bitmap [...]

  8. RIACOOL'BLOG | 8款bitmap操作类 Says:

    [...] AS3 Scale9 Bitmap 一个创建9宫的类。 [...]

  9. AS程序员实用工具类 « Deepin 3000 Says:

    [...] AS3 Scale9 Bitmap 一个创建9宫的类。 [...]

  10. AS程序员实用工具类 - Ase7en’Blog Says:

    [...] AS3 Scale9 Bitmap 一个创建9宫的类。 [...]

  11. 8款bitmap操作类 « echo "RenYuan's Blog" Says:

    [...] AS3 Scale9 Bitmap 一个创建9宫的类。 [...]

Leave a Reply