Flex Change image color dynamically? - apache-flex

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.

Related

Qt3D transparency in offscreen renderer

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.

UI Automation - How to distinguish image being displayed

I am very new to UI Automation and using Inspect tool (Inspect.exe Microsoft tool), so please explain.
I have a UWP application showing a list view, each list view item looks like this
The little circle in Image block above is the InteriorColor Image that is a solid color circle (black, gray or brown).
If I use Inspect.exe tool and hover over the little circle InteriorColor Image, it shows AutomationId = InteriorColorIcon which is the name I give it in my XAML:
<Image x:Name="InteriorColorIcon" Source="{Binding InteriorColor, Converter={Static Resource InteriorColorImageConverter}"
Above, bindable property InteriorColor is of string type and I use a converter to convert that string into the image of correct color.
So, if InteriorColor == "black", my converter returns resource image Black.png like:
return new BitmapImage(new Uri("ms-appx:///Black.png"));
I would like to write UI Automation to detect if the little circle InteriorColorIcon image is the image of correct color. If I hover over the image in Inspect.exe tool, it shows its AutomationId = InteriorColorIcon, that is great.
But how do I confirm that the image is Black, or Gray, or Brown?
Is there a way to add somehow a property to the image in XAML that Inspect tool can see and that I can use in my UI test to verify that the image showing is the correct image?
I assume that detecting color would be difficult, but is there a way to add a string property or something along these lines that could be used for this purpose?
Always set the AutomationProperties.Name for an Image. This is necessary for your Image to be read correctly from a screen reader. The Automation Name being "InteriorColorIcon" is an accessibility bug in your app. It should be something more descriptive, such as "Black image" (or whatever a black image indicates). Similarly, you can set the AutomationProperties.AutomationId to something useful to your testing.
See Expose basic accessibility information
<Image x:Name="InteriorColorIcon"
AutomationProperties.Id="{Binding InteriorColor}"
AutomationProperties.Name="{Binding InteriorColor}, Converter={Static Resource InteriorColorDescriptiveNameConverter}"
Source="{Binding InteriorColor, Converter={Static Resource InteriorColorImageConverter}"
If you want to check the actual image then that's more difficult. You'll need to screencapture the Image's location (see UIA_BoundingRectanglePropertyId) and then compare the pixels of the capture with your reference image.

Highlighting text in JavaFx Label

I am trying to set the text background of the JavaFx label text as green using the following CSS
label.setStyle("-fx-background-color:rgba(85, 255, 68,0.7););
And the unhighlight using the following
label.setStyle("-fx-background-color:rgba(0,0,255,0);");
However these does not work most of the times when it has to be done back to back.
Is there any way to set the style without using CSS i.e. using JavaFx API itself. I found label.textFill(Paint p) for text color but nothing for background colour i.e. the color of the label itself.
Is there any way to set the style without using CSS i.e. using JavaFx API itself.
For some styles (such as the text fill) yes. For background colors, background images, borders, etc API methods will not be available until JavaFX 8 is released (see Public API for Region backgrounds and borders in the JavaFX issue tracker for more information - anybody can sign up for access).
these does not work most of the times when it has to be done back to back.
If you just highlight a label and then unhighlight it again without using something like a PauseTransition to give the user some time to see the highlighted label, then, from the user's perspective nothing is going to happen as all the user will see is an unhighlighted label.
Not sure of your use case, but if you only want to highlight part of the text in a label or let the user highlight the text with a mouse, then you can use a TextField with editable set to false.
Possible Workaround
If the Java 8 preview does not work for you and you are experiencing errors due do bugs in the JavaFX CSS processing, then try placing a Pane then a label inside a StackPane. Set the background color of the Pane to label.setStyle("-fx-background-color:rgba(85, 255, 68,0.7);); Bind the Pane's preferred width and height to the Label's width and height and toggle setVisible on the Pane as appropriate.
Finally I found the workarround. I had to give a PauseTransition to give the system some time between unhighlight and highlight. CSS showed effect only after the pausetransaction if the labels were already highlighted. I think it may be a bug. I will file a jira. The duration of paustransition may be as low as 1 milisecond so that there is not lag from the user's point of view.

Finding color on flex page

I want to find some color on flex page exists or not?
For example
if(red color exists on page){
Alert.show("red exixts");
}else{
Alert.show("red does not exists");
}
so before writing this if else block,i need to find the red color(any where on flex page)
Note:- My page do not hav any images.with images i m getting the color.My page has a canvas and hboxes and diff texts with diff colors.
Done with bitmap,bitmap data.....NO LUCK :( Please help me wit this
Draw your page (application?) into bitmap. Then analyze each pixel (may take time). What red do you need? If you accept not only pure red (0xFF0000), define minimum level for red channel and maximum for other channels. As soon as "red" pixel is found, quit checking.
I would suggest that you start iterating over all the children objects of the application, get the colour property, using getStyle("propertyname"), and you will find the colour of all possible objects.This is much better than rendering the whole app, into a bitmap and then testing for each pixel.

how to code NSButton to look just like image

Using code (not the Interface builder) I need to create an NSButton that looks like an image. Specifically I want to use NSImageNameStopProgressFreestandingTemplate and I need it not to look like button but to look like the image. This means:
1. No 'button down' look
2. No border, no any visibility of the button
Thanks.
I know this response is a bit late, but you could try this, given thisButton:
[thisButton setImage:[NSImage imageNamed:NSImageNameStopProgressFreestandingTemplate]];
[thisButton setImagePosition:NSImageOnly];
[thisButton setBordered:NO];
That last line is the key bit: removing the button border effectively strips it of its bezel, leaving only the image to click on. (BTW, I haven't tried the above code specifically, so you may need to throw in a couple of other tweaks, such as setting the imageScaling or buttonType, to get it to work best.)
One final note: If you're using a template image (as you said you would), Cocoa will automatically display it with a slight dark-grey gradient; when the button is clicked, it will momentarily darken to solid black. This is an automatic "'button down' look" you didn't want; however, it is very subtle, and is a good indicator that the button worked. If you don't want this to happen, you could get an instance of the desired image and [stopImage setTemplate:NO]; on it.
Disable isBordered
let button = NSButton(
image: NSImage(named: NSImage.Name("plus"))!,
target: self,
action: #selector(onButtonPress)
)
button.isBordered = false
If you don't want to use a templated but want the push down highlight anyways, you can also use the following setup for an NSButton:
let imageButton = NSButton()
imageButton.image = NSImage(named: "MyImage")!
imageButton.bezelStyle = .shadowlessSquare
imageButton.isBordered = false
imageButton.imagePosition = .imageOnly
The important thing to make the highlight work on any image is to set bezelStyle to shadowlessSquare.
I know this behavior wasn't requested in the question, but it might be useful for others.

Resources