Flex/AS3: Detecting whe the Image's source has changed - apache-flex

I have an image which its source depends on a bindable property of another object.
I'd like to know when this source changes, for example, by capturing the bind event or another related event of the Image control.
Thanks in advance.

There's a few ways to do this. One was is to use Bindsetter
private function creationComplete(event:FlexEvent):void{
BindingUtils.bindSetter(changeImage,hostObject,"image"); //assuming hostObject contains the property "image"
}
private function changeImage(imageSource:String){
//Set the image in here... do whatever else you wanted to do.
}

Related

knowing the exact index clicked in a Flex tree event

Please, i have a tree component that dispatches an itemOpen event.
When the black triangle next to the yellow folder is clicked, that folder opens to expose its children.
Is there anyway to know the index of the open folder? there is a rowIndex property in the target property of the openItem event that stores the index but it is not accessible. Does anyone knows or have come across situations like this one?
Thanks
There is a function called itemRendererToIndex(itemRenderer:IListItemRenderer):int
ItemRenderer you can get from the dispatched event.
Adobe Documentation
Code smaple :
protected function tree1_itemOpenHandler(event:TreeEvent):void
{
var index:int = tree.itemRendererToIndex(event.itemRenderer);
trace(index);
}
You can always find the selectedItem using Tree(event.target).selectedItem. Thus, you can get the index of this item in your dataprovider. Hope it helps.

Get Notified of Change in Flex Bitmap or BitmapData?

In Flex, how does one hook into a bitmap or bitmapdata variable so that a function is notified whenever the bitmap's data has changed (pixel has changed, or filter's been added)?
I tried setting up binding but it doesn't work.
There must be a way to do it, because I can bind an mx:Image to a bitmap via the 'source' attribute, and the displayed image updates all the time when a I modify the bitmap. How does flex do it? Does it blindly redraw the bitmap at every frame, or is it smart and only redraws when the bitmap changes? If so, how does it know when the bitmap changes?
This is just sort of a semi-educated guess, with no testing behind it, so take it with some salt.
When Flex binds the source attribute of an Image, the value of .source is of type BitmapAsset.
BitmapAsset has a .bitmapData property, which is a reference to the bitmap in question.
I expect that the binding done by Flex is against that .bitmapData property.
I don't see any reason why you shouldn't be able to do that, too. I think you'd have to do a little circular work, though, as you'd have to create a BitmapAsset instance and populate it with the BitmapData you want to keep tabs on, then bind to the .bitmapData property of the BitmapAsset object.
Assuming a var called 'bitmapData', which is an instance of BitmapData, I think the following should work.
var bitmapAsset:BitmapAsset = new BitmapAsset(bitmapData);
var bitmapDataChangeWatcher:ChangeWatcher = BindingUtils.bindSetter(handleChangeToBitmapData, bitmapAsset, "bitmapData");
private function handleChangeToBitmapData(data:BitmapData):void
{
// Handle change to the bitmap data
}

Custom ListView to show EmptyDataTemplate and InsertItemTemplate at the same time

It is known that the ListView control can't display both an EmptyDataTemplate and a InsertItemTemplate at the same time.
For my design style I need to be able to show both. I want to be able to show that no data exist and at the same time show a form to add new data.
I've already implemented various solutions, such as putting a PlaceHolder in my LayoutTemplate and then manually showing or hiding this PlaceHolder in the code-behind, depending on if there is data or not.
However, I would like a control that has this built-in capability in order to keep my code-behind light.
I believe there are only two ways to achieve what I want:
First way (preferred) is to write that custom control myself. I was thinking of deriving from ListView and overriding the function responsible for disabling the EmptyDataTemplate, but I have no experience with custom controls. And I'm not even sure it will work in the end.
Second way is to use a custom control found or purchased somewhere. I have not been able to find such control that has the same base capabilities as the ListView.
Has anybody any idea how to solve #1 and maybe #2?
Thank you.
Here is what I ended up doing:
public class MyListView : ListView
{
protected override int CreateChildControls(IEnumerable dataSource, bool dataBinding)
{
int itemCount = base.CreateChildControls(dataSource, dataBinding);
if (this.InsertItemPosition != InsertItemPosition.None && itemCount == 0)
{
CreateEmptyDataItem();
}
return itemCount;
}
}
Works great!
I would go for your option 1: Create a custom control
Because you haven't specified a programming language I made one in VB.NET:
Public Class CustomListView
Inherits ListView
Public Sub CheckEmptyData() Handles Me.PreRender
If Me.Items.Count = 0 Then
Dim label As New Label
label.Text = "No data found <br/>"
Me.Controls.AddAt(0, label)
End If
End Sub
End Class
Just tested it and works perfectly, it can just replace an existing ListView.
As you can see it checks if there is any data and if not it inserts a label with the text "No data found". I haven't found an easy way to use the EmptyDataTemplate for this, that would be a better option but this might already work for you.
Another option is to hide the InsertItem (InsertItemPosition.None) if there is no data, and add a Button "Insert" to the EmptyDataTemplate that enables the InsertItemTemplate and therefore hides the EmptyDataTemplate.
I don't understand much of your requirement without a screen shot of what you are actually trying to achieve. Anyway, you may be able to achieve this interface with a combination of ListView+FormView or ListView+ a User Control. If you can provide any more info I may help further.

flex: cant edit item in Datagrid with override set data method

I've a custom itemRenderer for my datagrid. To set the actual data I use the following method:
override public function set data(side:Object):void{
...
}
As soon as I use this function the cell doesn't show up any item Editor anymore. Why is that? When I remove this function the itemEditor is working but with the wrong initialization data...
What's the proper way to handle this?
Thanks,
Markus
Have u called 'Super' on that method ?
Make sure that you also have an itemEditor that is correctly working or that you set the rendererIsEditor property to true and use the renderer as the editor.

flex3:How to override function set label of a button

Flex 3 question:
I trying here to avoid having to bind resources to all my components labels ( ie a button) and find a way to have this automated.
Problem:
It corrupts the layout in design mode to bind directly in the mxml label="{resourceManager.getString('myResources', 'submit')}" and makes the design view useless. but when declaring bindings elsewhere, in actionScript or via a bind tag, it is counter productive and prone to many errors and miss.
Proposition:
I would like to create my own button that automatically invoke resources to localize a button label. So the author puts "Submit" in the mxml description of my button, and when running it would take the value of the label ie "submit" and use resourceManager.getString('myResources', 'submit').
but I can't find the way to override the set label function, Is it possible if yes how? else how can I go about it?
Maybe I am missing an essential process here that would make the use of resources more elegant, as well as how to override such thing as a button's label.
Thanks for your advices.
Create a component called MyButton, extending Button. Then use this:
override public function set label(value:String):void {
super.label = resourceManager.getString('myResources', value) || value;
}
Assuming the resource manager returns "null" or "undefined" this will work, and will only replace the value if it exists in "myResources".
If you don't want to override every component you need to do this with, then you can add a FlexEvent.CREATION_COMPLETE event on every component. Then use a single generic function to do your label localization.

Resources