I've got a class that extends EventDispatcher.
What I want to do is to dispatch the click event when the component is clicked. (The class is essentially some text in a textfield that needs to be able to do certain things, and it needs to be able to respond to a click). Sounds easy enough... I want the event dispatched when that portion of the text is clicked. But uh...how? it's not like a button where I can just go
myButton.addEventListener(MouseEvent.CLICK, myClickHandler);
That's clear, because some component is going to be listening for the Click event dispatched when myButton is clicked. It is built into the AS3 framework that a button knows how to listen for a click event.
After the import statements I've got:
[Event(name="click" type="mx.events.Event")]
How do I dispatch the event when the component is clicked, when the component doesn't yet know how to respond to a click event? I've tried adding an event listener in the textfield which contains this custom class of text, but nothing's happening because the Click event hasn't been dispatched.
You can create your own click event and dispatch it. You can do that also to dispatch clicks on objects where no user ever have clicked :D
Try this:
var mEvent:MouseEvent = new MouseEvent(MouseEvent.CLICK, [HERE MORE PARAMS BY YOU]);
yourObject.dispatchEvent(mEvent);
Now, you will recieve Click Events from yourObject.
Let's say your class consists TextField tf. Then public function YourClass():void { //Constructor
{
//intialize Something
//initialize tf
tf.addEventListener(MouseEvent.CLICK, onClick);
...
}
...
private function onClick(e:MouseEvent):void {
this.dispatchEvent(new MouseEvent(MouseEvent.CLICK));
}
OK, I tried this in the constructor:
var mEvent:MouseEvent = new MouseEvent(MouseEvent.CLICK, true, false);
this.dispatchEvent(mEvent);
Then, in the containing textfield, while iterating through these objects (each of which is called cp), I did this:
cp.addEventListener(MouseEvent.CLICK, mouseClickHandler);
Finally the mouseClickHandler:
private function mouseClickHandler(event:MouseEvent):void
{
trace("Clicked!!!!!!!!!!!");
}
Running in debug mode I get nada. Nunca. Niente. Nuttin'. Which is to say: no trace of being clicked. Did I do something wrong?
Related
I'd like to avoid that mouse events triggered by the user don't get dispatched to their target objects, effectively "freezing" the GUI for the user.
In a sample application featuring just a single mx.controls.Button I called addEventListener on the button to get notified of mouse events. In the event handler, I called Event::stopImmediatePropagation on the event, assuming that this would "discard" the event. Clicking the button would call my event handler, but yet the button was "clicked" (it animated and triggered an event).
How could I do this?
button.mouseEnabled = false;
button.mouseChildren = false;
should work
Depending on how advanced your interface is, you could just throw an object (s:Rect in an s:Group would work) on top of everything, set width and height to 100%, and disable mouseChildren
USE removeEventListener()
var b:Button = new Button();
function init():void
{
b.addEventListener(MouseEvent.CLICK, onButtonClick);
}
function onButtonClick(event:MourseEvent):void
{
b.removeEventListener(MouseEvent.CLICK, onButtonClick);
}
I am writing a flex application and I have two Spark TextAreas. I want to create an EventListener so that when the user clicks on a text area, the text inside the TextArea is cleared:
this.addEventListener(FocusEvent.FOCUS_IN, onFocusIn);
private function onFocusIn(ev:FocusEvent):void {
if (this._showsCaption) {
this._showsCaption = false;
super.text = "";
}
}
Currently I can implement this with a Spark TextInput, but when I click on the TextArea, the focusIn event never fires and the onFocusIn() handler is never called.
Any thoughts would be much appreciated.
When you are extending the TextArea (as in your case), you can override the protected "focusInHandler" method. This is the handler that is called when the control gets focus. The same goes for the "focusOutHandler" method.
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/core/UIComponent.html#focusInHandler()
I want to create a custom event and it will be accessible by any other class.
Suppose I have NavigationMenuClass.as which contains some next, prev buttons, and another class For Page.as which should show a particular page at each next or prev button press.
And I need to create a custom event(will write a EVENTClass.as to manage all these kind of events.) called "showPage", and when this event occures the Page.as class member function need be called.
private function nextPress(event:Event) {
//dispatchEvent(new Event("showPage"));
// this will call the Page class Menmber function page:Page = new Page; page.showNextPage();
}
With out passing the object how can I call a particular member function using Event and Event Dispatcher methods.
You seem kind of confused.
So, you have a display hierarchy in which your Page.as display object is the parent of the NavigationMenuClass.as, correct?
Your NavigationMenuClass should dispatch events for 'next' and 'previous'. The Page class should listen to those events and do something.
Your code kind of already does the dispatching part, although it is commented out. I would put this in the click handler of your button and use it to dispatch a next, or previous, event:
private function nextPress(event:Event) {
// dispatchEvent(new Event("showPage"));
// this will call the Page class Menmber function page:Page = new Page; page.showNextPage();
dispatchEvent(new Event("next"));
}
In your Page.as you just add an event listener:
navigationMenuClassInstance.addEventListener('next', onNext);
public function onNext(event:Event):void{
// write code to change content
}
You can use the same approach to implement the previous event. To address a few of your "odd wordings"
I want to create a custom event and it
will be accessible by any other class
I'm not sure what you mean by accessible.
You can create a custom event class that extends Event and any other class can use it, as long as it imports it. My example above doesn't create a custom event class, but uses the default event class.
In terms of dispatching, the event only dispatches itself up to its' parent. IF the event bubbles, it will go to it's parent parent, then the parent's parent, and so on all the way up the the stage.
With out passing the object how can I
call a particular member function
using Event and Event Dispatcher
methods.
I'm not sure what you mean by "passing the object" here. When you dispatch an event, that event class is always available to the event listener as an argument to that event listener method. That is kind of like passing an object.
Also when following Flextras excellent guide, make sure that NavigationMenuClass extends EventDispatcher, otherwise just calling the dispatchEvent() method won't work!
I have a List component that has drop-in CheckBox itemEditor that also serves as the itemRenderer. It displays each item as a simple CheckBox with a label.
However, the itemEditEnd Event does not get triggered until I click on something outside of the List. I want it triggered once the CheckBox is checked or unchecked.
I was thinking of manually dispatching the ListEvent.ITEM_EDIT_END in a CLICK Event handler, but then the itemEditEnd Event would get dispatched twice. There's gotta be a better way to do this.
Any ideas?
Thanks.
Here is the solution I came up with. I changed my List to use the component as an itemRenderer only, not as a itemRenderer and itemEditor. I then added a MouseEvent.CLICK handler to call a function in the List from the itemRenderer to perform the necessary actions:
My List Component:
package
{
import mx.controls.List;
import mx.core.ClassFactory;
public class CustomCheckBoxList extends List
{
public function CustomCheckBoxList()
{
super();
itemRenderer = new ClassFactory(CheckBoxRenderer);
}
public function dispatchSelectionEvent(item:Object, selected:Boolean):void
{
// Take action here...
}
}
}
My ItemRenderer:
package
{
import flash.events.MouseEvent;
import mx.controls.CheckBox;
public class CheckBoxRenderer extends CheckBox
{
public function CheckBoxRenderer()
{
super();
}
override protected function clickHandler(event:MouseEvent):void
{
super.clickHandler(event);
CustomCheckBoxList(listData.owner).dispatchSelectionEvent(data, selected);
}
}
}
I've just run into this. I'm using a custom component rather than the drop-in approach, and this works when using the renderer as the editor.
Note that the Flex folks evidently came up with the notion that users would want to toggle their checkboxes a few times before settling on the state to commit to...at which point they'd hit the Enter key. How obvious!
My solution is to synthesize a keyboard event that is equivalent to hitting Enter. The tricky part is that one must use the callLater() method to dispatch the event because the list control won't have registered its keyboard listener on the editor until after the checkbox's click handler gets called. Here's my click handler for the checkbox in my custom renderer/editor component:
private function onClick(value:Object):void {
newValue = value;
var list:ListBase = ListBase(owner);
list.callLater(dispatchEvent, [new KeyboardEvent(KeyboardEvent.KEY_DOWN, true, false, Keyboard.ENTER, Keyboard.ENTER)]);
}
Please help. I want to add a click event on checkbox that i created dynamically so that i know what checkbox I click.
Heres my code on action script:
var myCheckbox:CheckBox = new CheckBox();
vbox.addChild(myCheckbox);
How to add click event on checkbox?
private function myCheckboxClicked(event:MouseEvent)
{
// doStuff();
}
...
myCheckbox.addEventListener(MouseEvent.CLICK, myCheckboxClicked);
As long as it inherits EventDispatcher, you can attach a listener and it'll send events as normal.