-----------------------------------
minopharma
Tue Feb 13, 2007 11:27 pm
BeginBitmapFill () method for SWF8 / Fill your stage with cu
-----------------------------------
BeginBitmapFill( ) method for SWF8
Are you tired of trying to make your movie transparent?Or making a custom pattern in HTML, with importing the gif or bitmap tile image to make a cool background?When you use some of this solution above, it's possible to get some errors of your movie components function ( for example:mouse wheel function not working in Flash/Swishmax scrollbars if you use transparency in HTML).
So, forget all of this problems and try with new BeginBitmapFill( ) method for SWF8, now for Swishmax!
1.Open Swishmax build 2005.11.16, and import your tile image(*.bmp,*.gif,*.jpg or *.png) into the stage.Save the file as bg.swi.
2.Now click on the image and goto the transform panel and make this settings: X=0,Y=0 and set the anchor point to TopLeft.
3.Now open the Shape tab, and from the preview window, get the width and height of your image(in my example the dimensions of my image are 4x4).
4.Now, group your image as sprite and add sprite instance name brush0.With brush0 sprite still selected, open transform panel, and make this settings: X=0, Y=0 and set the anchor point to TopLeft.
5.Click on the Scene_1 in the Outline panel (tree), open the Script tab, and add this code:
function setUpStage(){
Stage.align = "TL";
Stage.scaleMode = "noScale";
var a = new Object();
a.onResize = drawBackGround;
Stage.addListener(a);
drawBackGround();
}
function onEnterFrame(){
b.fillRect(b.rectangle);
var li = 0;
while (li <3){
var c = this[clips[li]];
var d = c.transform.matrix;
var e = d.tx % textureWidth;
var f = d.ty % textureHeight;
var g = 0;
while (g < 4){
var h = 0;
while (h < 4){
b.draw(c, d);
h++;
}
g++;
}
li++;
}
}
function drawBackGround(){
with (_level0) {
beginBitmapFill(b);
moveTo(0, 0);
lineTo(Stage.width, 0);
lineTo(Stage.width, Stage.height);
lineTo(0, Stage.height);
lineTo(0, 0);
endFill();
}
}
onFrame (1) {
var textureWidth = 4;
var textureHeight = 4;
var b=new flash.display.BitmapData(textureWidth, textureHeight);
var clips = Array("brush0");
var i = 0;
while (i < clips.length){
this[clips[i]]._visible = false;
i++;
}
setUpStage();
}
5.Make sure that the SWF Export option is set to SWF8, and export your movie as SWF8 as bg.swf in a folder.
6.Now, open Frontpage or Dreamweaver and add this code:
Flash 8 background pattern with bitmap fill
7.Save your file as bg.html in the same folder as your swf file.
8.That's it!Now test your swf file in bg.html browser on different resolutions(right click Desktop/Properties/Settings) and Enjoy! :bigwink:
Note: If you want to use this with different tile image, just follow this steps, get the dimensions of your image (step3) and make changes this in the code in Frame1.
For example: If your new image is 10x10 (width/height), just add this numbers in the beginning of the Frame1 code:
var textureWidth =10;
var textureHeight = 10;
Preview and download link:
Copyright 2006, Pseudohybriddesign
-----------------------------------
calvin
Wed Feb 14, 2007 1:03 am
-----------------------------------
thank minopharma, it seems you have pretty good experience with that tool swishmax, I am just learning it at swish-db.
-----------------------------------
awalsadja
Sun Mar 25, 2007 8:01 am
-----------------------------------
great tutorial
i save your post.
-----------------------------------
killer
Mon Mar 26, 2007 12:00 am
-----------------------------------
thank you minopharma !!!