AS3 fullsize background image with pixel pattern

in , , | 6 comments

I have written a small class, which you may be interested.  With this class you can create a fullsize background image which fits to the width of the stage. The height of the image is proportional to the width. So it´s good to use an image with a ratio of 4:3 otherwise empty bars can show up.[loadprettifier]

To round it up I create a pixel pattern overlay so the image quality is acceptable by streching it. Known from other sites…

Download – get the source

Demo – see an example

So thats the way to do it:


// import the class
import com.fullsizeBackgroundImage.fullsizeBackgroundImage;

// create a new object, give the url to the image as string
var backgroundImage:fullsizeBackgroundImage = new fullsizeBackgroundImage("images/background.jpg");

// add the object to stage
stage.addChild(backgroundImage);

If you have any question about the script feel free to leave a comment :)

Comments

  1. «Tom» said on :

    Hi, I’ve used your code to add the image and more importantly the pattern overlay, but it appears on top of everything (I have somethings on layers within my flash file). I’ve tried using addChildAt and setChildIndex to move it to the back but with no result. I’ve also tried assigning the child to an empty movieclip which is ordered to the bottom instead of the stage (emptyMc.addChild(backgroundImage); and that has no effect either….any thoughts? Thanks.

  3. «Michel» said on :

    Hi, great code but how can we add more space between pixel

    Thx

  4. «solemone» said on :

    Hi Michel,
    you can change line #65 in the class:

    from this: patternBitmapData = new BitmapData(2, 2, true, 0×000000);

    maybe to this: patternBitmapData = new BitmapData(4, 4, true, 0×000000);

    To change your width of the bitmap data, which is the repetitive element and not the individual pixels.

  5. «Michel» said on :

    HI solemone,

    it works, really cool but it was easy to figure it out, so newbie i am lol ( i’ll go buy a new brain)

    have a nice day

    thx a lot

  6. «Cesar» said on :

    OMG! Thanks so much! I stay looking for this for a months ago!

    Have a nice day, thanks a lot!!

    From Brazil

Leave a Reply

Please fill all the fields with the red star *