Let's say I have an Image in Flex, and I want to filter it such that only the Green Pixels are visible...
For example this image:
alt text http://www.LiquidFeline.com/Images/Circles.png
Would show up on the screen as:
alt text http://www.LiquidFeline.com/Images/Circles2.png
How can I accomplish this in Actionscript/Flex?
You can do this easily with the threshold method of the BitmapaData class.
Basically, make a copy of the image. Then make every pixel that fails to pass the threshold test fully transparent. The test in this case could be pixel != your shade of green.
Sample code:
var color:uint = 0xff22b14c;
var bmd:BitmapData = new BitmapData(image.width,image.height,true);
bmd.draw(image);
bmd.threshold(bmd,new Rectangle(0,0,image.width,image.height),new Point(0,0),"!=",color,0,0xffffffff);
addChild(new Bitmap(bmd));
With a bit more of work you could isolate ranges of colors, but for a solid color as in your case, this should do it.
You can try applying chromakey effects the Bitmap and BitmapData classes. See a tutorial at http://cnx.org/content/m34463/latest/
Related
I'm using Qt3D with a combination of this offscreen renderer and modified the framegraph to include a background image, like here.
Unfortunately, adding transparency to the objects drawn over the background image using QPhongAlphaMaterial only works unsatisfactorily.
This is th result:
What you can't see here is that the whole circle part is actually transparent, i.e. the renderer wrote the transparency value of the object for the whole pixel instead of adding it transparently on top of the background.
This is what the rendered object looks like wihtout transparency:
And this is the background:
The framegraph has two branches: one for the backgroun image, which is processed first, and one for the objects. I added a QRenderStateSet for the objects that contains a QBlendEquation with the blend function set to add and a QBlendEquationArguments with source RGB and alpha set to 1, and destination RGB and alpha set to 1 minus source alpha.
Any ideas how to fix this problem?
(For anyone wondering, I took the images from the T-Less dataset and wrote a program to create ground-truth data for 6D pose estimation)
Similarly to this question, the format of the texture that is being rendered to needs to be set to RGB8_UNorm and not RGBA8_UNorm, i.e. without the alpha channel.
How do I hide that part of a moving container with Pic2 inside so that it doesn't overlap the container with Pic1? There is a splitter (in white) and it should visually split those moving pictures.
Here is an exmaple: http://cjstest.blg.lt/test.html
You can use the mask property to apply a shape as a clipping path on any DisplayObject.
I ported your example to JSFiddle here: http://jsfiddle.net/lannymcnie/t8dzrunj/
It is important to note that an object's mask is automatically moved to draw at the coordinates of the clip. This means that I had to change the sample so that the rightBG is what is moving (instead of its Container), and then mask the container. Since the container is moved on the x, I had to massage the coordinates of the mask a little, but I got it to work: http://jsfiddle.net/lannymcnie/t8dzrunj/1/
Here is the code to create and apply the mask:
var mask = new createjs.Shape();
mask.graphics.f("#f00").dr(40,0,260,480);
rightSubCont.mask = mask;
Hope this helps!
I have a qt label which by default has a place holder image in it:
self.label.setPixmap(QtGui.QPixmap(_fromUtf8("place_holder.jpg")))
There is a function to update the image contained in the label which is:
def selectFile(self):
image = QtGui.QFileDialog.getOpenFileName(None, 'Select Reference Image', '', '*.jpg')
self.label.setPixmap(QtGui.QPixmap(_fromUtf8(image)))
This works fine (the image is updated), but it is also deformed if the image used to update the label has different size from the place holder image.
Is there any way to fix this? I mean to adapt the image and to keep fix the size of the label?
You can try to set the scaledContents property:
self.label.setScaledContents(True)
self.label.setPixmap(QPixmap("your_image.jpeg"))
It works fine for me.
Beware that this scale the image to fill all available space. It means that the aspect ratio of the image wont be preserved unless the label size and the image have the same aspect ratio. You will have the same problem using the QPixmap.scale method as you can see in the images here.
Scale the image each time you import it. If you already have a size in mind for your label, you can even scale the place holder.
try (c++)
//initial setup
QPixmap pixPlaceHolder = QPixmap(_fromUtf8("place_holder.jpg");
QSize desiredsize = pixPlaceHolder.size(); // or any of the size you want
Each time you select a file:
label.setPixmap(QPixmap(_fromUtf8(image).scaled(desiredsize));
try this, this helped me for scaling the image to fit the label while maintaining the aspect ratio. Will also help to resize the image based on the label size.
pixmap = QPixmap(x)
pixmap = pixmap.scaled(self.label.size().width(),self.ui.label_4.size().height(), Qt.KeepAspectRatio)
self.label.setPixmap(QPixmap(pixmap))
I have a image declared like the following:
[Bindable]
[Embed( source="assets/banana.png" )]
public var iconBANANA : Class;
It is involving into itemRenderer, but I wish to change the color of the image when some event occurs (like clicking above or something).
The rest of the objects used the image shall remain unchanged, only the object on which the event has occurred shall change the color of the image.
But the biggest question is :
How to change the image color mainly - like there is a Blue area on image - to turn it on Green, or Yellow ?
I believe what you're looking for are Filters. What you're explaning (changing one color to another) is not exactly trivial and going into some fairly complex image manipulation but you can get some results using the ColorMatrixFilter.
You're looking for beginBitmapFill.
I have a handful of sprites that I am attempting to group together via addChild().
Here is some pseudo-code demonstrating what I would like to accomplish:
import nav.text.TextSprite;
spr1:Sprite = new Sprite();
spr1.graphics.clear();
spr1.graphics.beginFill(0x000000);
spr1.graphics.drawRect(0,0,100,100);
txt1:TextSprite = new TextSprite;
txt1.text = "hello";
spr1.addChild(txt1);
//this is what isn't working: the sprite is hidden but not the text
spr1.alpha = 0.0;
For some reason I cannot seem to get the TextSprite to draw correctly... All it is is a Sprite with a TextField added to it. I think everything is working there, but I might have something wrong w/r/t making sure all of TextSprites children are grouped correctly.
I should mention that it does position correctly; but the alpha property won't respond in the way I would expect it to. I.E., the sprite that the TextField is attached to will allow it's alpha to be set but the text remains visible.
Any thoughts?
Most likely you just need to embed the font in your textfield. Try changing the x, y of spr1 and see if txt1 moves along with it. If it truly is a child then it will respond to the new position.
You need to embed the font using textfield.embedFonts = true. If your text is disappearing when you do this, how are you going about embedding the font (using the Flex embed meta tag or using the Flash IDE?), check that you are not changing the font weight (setting the text to bold when you have only embedded the normal weight font) and if you are using a text format, be sure to apply the text format AFTER you set the textfield.text property. You can get around this by using textfield.defaultTextFormat.