Skip to main content
Inspiring
March 2, 2011
Question

getPixel of a dynamically loaded image

  • March 2, 2011
  • 3 replies
  • 682 views

Hi all, I'm trying to create a color picker using getPixel. It works wonderfully as long as the image is loaded from a local drive. When I try loading it from the server (a subdirectory on the same server as the SWF), the loaded image doesn't get drawn when I use the draw command. It draws a white rectangle and when I use getPixel, I always get 0xFFFFFF. I also have system.Security.allowDomain("http.//www.mysite.com") in my script, but nothing works. Any ideas?

This topic has been closed for replies.

3 replies

Inspiring
March 3, 2011
import flash.display.BitmapData;
import flash.geom.Point;

var myBitmapData:BitmapData = new BitmapData(100, 80, false, 0x00CCCCCC);

var mc_1:MovieClip = this.createEmptyMovieClip("mc", this.getNextHighestDepth());
mc_1.attachBitmap(myBitmapData, this.getNextHighestDepth());

var mc_2:MovieClip = createRectangle(20, 20, 0xFF0000);

var destPoint:Point = new Point(myBitmapData.rectangle.x, myBitmapData.rectangle.y);
var currPoint:Point = new Point();

mc_1.onEnterFrame = function() {
    currPoint.x = mc_2._x;
    currPoint.y = mc_2._y;
    if(myBitmapData.hitTest(destPoint, 255, currPoint)) {
        trace(">> Collision at x:" + currPoint.x + " and y:" + currPoint.y);
    }
}

mc_2.startDrag(true);

function createRectangle(width:Number, height:Number, color:Number):MovieClip {
    var depth:Number = this.getNextHighestDepth();
    var mc:MovieClip = this.createEmptyMovieClip("mc_" + depth, depth);
    mc.beginFill(color);
    mc.lineTo(0, height);
    mc.lineTo(width, height);
    mc.lineTo(width, 0);
    mc.lineTo(0, 0);
    return mc;
}
tatiana1Author
Inspiring
March 3, 2011

Thank youuuuu!!!! That tells me the coordinates where I hit the palette. How do I get the pixel color value of the x,y position I'm touching?

Inspiring
March 2, 2011

Hi

import flash.display.BitmapData;
System.security.allowDomain("http://www.helpexamples.com/flash/images/image2.jpg");
var mc:MovieClip = this.createEmptyMovieClip("mc", this.getNextHighestDepth());
var listenerObj:Object = new Object();
listenerObj.onLoadInit = function (target_mc:MovieClip):Void
{
    target_mc._x = (Stage.width - target_mc._width) / 2;
    target_mc._y = (Stage.height - target_mc._height) / 2;
    var myBitmapData:BitmapData = new BitmapData(mc._width, mc._height, false, 0xFF0000);
     trace(myBitmapData.getPixel(target_mc._x, target_mc._y).toString(16));
}
var image_mcl:MovieClipLoader = new MovieClipLoader();
image_mcl.addListener(listenerObj);
image_mcl.loadClip("http://www.helpexamples.com/flash/images/image2.jpg", _root.mc);

  First you can get pixel value inside onLoadInit and then try to draw rectangle

Otherwise you can try

hitTest Method


Message was edited by: narmathadevi

tatiana1Author
Inspiring
March 3, 2011

Hi and thanks for your reply. Didn't work and I can't figure out why. Would hitTest tell me the color of the pixel I'm touching? Do you have an example?

Inspiring
March 2, 2011

Hi

  You can create like this BitmapData and you can get

var myBitmapData:BitmapData = new BitmapData(100,100, false, 0xFF0000);

tatiana1Author
Inspiring
March 2, 2011

The solution you suggest doesn't work...This is my code:

import flash.display.BitmapData;


System.security.allowDomain("http://www.mysite.com/");

_root.createEmptyMovieClip("pal", 1);


var mclListener:Object = new Object();

mclListener.onLoadInit = function(mc:MovieClip) {

     var myBitmapData:BitmapData = new BitmapData(mc._width, mc._height);

     myBitmapData.draw(mc);

};

var image_mcl:MovieClipLoader = new MovieClipLoader();

image_mcl.addListener(mclListener);

image_mcl.loadClip("http://www.mysite.com/palette.png", _root.pal);


var mouseListener:Object = new Object();

mouseListener.onMouseMove = function() {

     tece(myBitmapData.getPixel(_root._xmouse, _root._ymouse));

};

Mouse.addListener(mouseListener);

It works if I load an image from my local drive, but not if I load it from the server...