I want to be notified when a FLex Panel gets or loses focus. I've overridden the focusInHandler() and the focusOutHandler(), but they don't get called when I click on the panel.
The panels style changes indicating that it has the focus, but the handler doesn't get called.
What am I missing?
Containers (and implicitly panels) aren't really focusable. Meaning that simply clicking on an empty container won't give it focus, and in consequence, won't trigger the event handler for "focusIn". In order for a container to "gain" focus, a child of that container, that implements IFocusManagerComponent interface, has to gain focus.
So if you want your panel to trigger the "focusIn" event when clicking on it, you should focus a focusable child of that panel on mouse click.
Have you tried to explicitly listen for that event:
myPanel.addEventListener(FocusEvent.FOCUS_IN, myEventHandler);
and made sure that it was getting called?
Related
Can anyone explain me what the difference between focus, focusleave and focusenter on button method with extjs, I'm lost because it seems to be the same when I add event listener. Thanks
kind regards
difference between focus, focusleave and focusenter on button method
with extjs
Method? I guess you mean the events right? Cos:
The focus method will focus your button when you call it.
As you can see on the picture the middle button has focus, you can change the focus on the webpage usually by using TAB key. ExtJS supports full control over your app using keyboard.
The focus, focusenter, focusleave events. If you are not sure what to use - just use "focus"
The focus event should be clear - it's simply fired when the button has focus.
The focusenter is fired when the component get's focus but as the docs states it's also fired in the whole component hirearchy. That means that if the button is in panel which is in view and you focus the button - the focusenter will be fired on the view, panel, button.
main -> panel -> button
Events
The focusleave is the same as focus enter. Fired when focus is lost on the component - again fired in the whole hirearchy. So if the focus went completly away form the page you would see focus leave on the button -> panel -> view
I've doubt when we create custom event in flex.
Why do we use 'type:String, bubbles:Boolean=false, cancelable:Boolean=false' these parameter in flex events.
Bubbling causes a dispatched event to continue to be dispatched up the display tree until it reaches the stage. This is useful in various scenarios.
For example: Imagine you have several buttons inside a parent DisplayObject. You could add listeners to each button, and remember to remove them afterwards, or you could just add one listener to the parent. This works because MouseEvents have bubbling enabled.
buttonParent.addEventListener(MouseEvent.CLICK,handleButtonClick);
function handleButtonClick(event:MouseEvent):void
{
trace("The button clicked was " + event.target.name);
}
The benefit of this is that you can now add and remove buttons freely, without having to worry about attaching listeners to them. The target property of the event object will be a reference to the button that was clicked, and currentTarget will be a reference to the parent.
Cancelable is a flag that sets whether or not you are permitted to stop the default action of an event by calling the preventDefault() method.
I have placed a few buttons in a Qgraphicsscene, but I don’t know how to navigate to the button from a keyboard.
How would I set the focus to a button from the keyboard?
I assume that you used QGraphicsScene::addWidget() to add the button to the scene? It gives you a proxy object back, QGraphicsProxyWidget *, which inherits QGraphicsItem::setFocus(). But remember that it needs to have set the ItemIsFocusable flag and needs to be visible and active as well.
Additionally (from the setFocus() documentation):
As a result of calling this function, this item will receive a focus in event with focusReason. If another item already has focus, that item will first receive a focus out event indicating that it has lost input focus.
I have a VBox, I assigned a handler to click, and inside the VBox I have components such as images and texts with no handler assigned for click. Would the click function be called when I click on the text and image? If not how can I make it so without assigning handlers individually, but on the container level?
Thanks
Click events "bubble" in Flex. When you click on an images, it bubbles up to its parent, then that parent's parent and so on until there are no more parents left.
If any of these have click listeners they will trigger when they are reached in the bubbling process.
Also in the event the currentTarget will refer to the object that has the listener, and the target will be what was actually clicked.
So in your case if they click the image, the event will bubble up to the container triggering the event, in your listener function the clicked image will be the event.target and the container will be the event.currentTarget.
Also in the bubbling process, it actually starts from the root parent down, this is called the capture phase, then bubbles back up. Your event will trigger when it bubbles back up unless you specify useCapturePhase = true in the event listener. This is how you can stop an event from going to its children. If you use the capture phase then call event.stopPropagation() inside the event listener then the container will receive the event but the child image will not.
It's taken an hour for an answer to this question... it probably would have been faster to just try it. :)
But yes, click events bubble up to parent containers. Adding the handler to the VBox should be fine.
I was pretty sure that containers, such as VBox do not dispatch click events; unless they are bubbled up from the children.
However, clicking on items in your container should trigger the listener on your container, as the Click event bubbles.
I am using a box element to add a transparent overlay to a column of buttons. I want to add a click event to the buttons. However, when you click a button the click event is only triggered on the overlaying box. Is there anyway to pass the event to the underlying button or perhaps a better way to display an overlay without blocking the click event?
If you want a DisplayObject (which nearly all visual things subclass in Flex) to be treated as "transparent" to the mouse (i.e. it won't intercept click events), set that object's mouseEnabled property to false.
e.g.
transparentBox.mouseEnabled = false;