as3 button getting clicked 50 px below button - actionscript-3

Question

I have an issue. I've narrowed down to my button class where if I click 50-100px below the button sprite area, the mouse.click event listener is triggered.
At one point I thought that a nested issue with sprite children could have caused it, but even adding the button straight to stage has the same effect.
I rewrote the button class from scratch and the same thing is happened.
I'm unsure if this is something that happens because I'm writing pure as3 with the flex framework or something else. Here is the class for the button code:
package org.project.ui
{
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.display.Graphics;
import flash.text.TextField;
import flash.text.TextFormat;
import flash.text.TextFormatAlign;
import flash.display.Shape;
import flash.display.SimpleButton;
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.text.TextField;
import flash.text.TextFormat;
import flash.text.TextFormatAlign;
import org.project.controller.IController;
import flash.utils.getQualifiedClassName;
/**
*
*
*/
public class CustomButton2 extends CustomSprite
{
protected var _button:Sprite;
protected var _buttonFunction:Function = null;
protected var _label:String = "";
protected var _textField:TextField;
protected var _textFormat:TextFormat;
protected var _font:String = "Arial";
protected var _fontSize:int = 12;
protected var _fontColor:uint = 0x000000;
protected var _buttonWidth:int = 110;
protected var _buttonHeight:int = 30;
public function CustomButton2(label:String, id:String, w:int, h:int, buttonFunction:Function = null)
{
super(id, content);
_label = label;
_buttonWidth = w;
_buttonHeight = h;
_button = makeButton(label, w, h, buttonFunction);
addButtonListeners();
addChild(_button);
}
protected function makeButton(label:String, w:int, h:int, buttonFunction:Function = null):Sprite {
_button = new Sprite();
_button = drawButton(_button);
_button.useHandCursor = true;
_button.buttonMode = true;
_button.mouseChildren = false;
_button = addTextField(label, _button);
return _button;
}
protected function addTextField(label:String, button:Sprite):Sprite {
_textFormat = new TextFormat(_font, _fontSize, _fontColor, false, null, null, null, null, TextFormatAlign.CENTER);
_textField = new TextField();
_textField.defaultTextFormat = _textFormat;
_textField.name = "textField_" + id;
_textField.text = _label;
_textField.selectable = false;
button.addChild(_textField);
return button;
}
protected function addButtonListeners():void {
_button.addEventListener(MouseEvent.CLICK, mouseClick);
_button.addEventListener(MouseEvent.ROLL_OVER, mouseRollover);
_button.addEventListener(MouseEvent.ROLL_OUT, mouseRollOut);
}
protected function mouseClick(e:MouseEvent) {
e.stopPropagation();
if (_buttonFunction) {
_buttonFunction();
}
changeButtonDisplay();
trace("click");
}
protected function mouseRollover(e:MouseEvent) {
changeButtonDisplay(0xFF0000);
}
protected function mouseRollOut(e:MouseEvent) {
changeButtonDisplay(0xFFCC00);
}
protected function changeButtonDisplay(u:uint = 0xFF0000, w:int = 110, h:int = 30):void {
_button = drawButton(_button, w, h, u);
}
protected function drawButton(button:Sprite, w:int = 110, h:int = 30, u:uint = 0xFFCC00):Sprite{
button.graphics.beginFill(u);
button.graphics.lineStyle(1);
button.graphics.drawRoundRect(0, 0, w, h, 20);
button.graphics.endFill();
button = addTextField(_label, button);
return button;
}
}
}
Any suggestions would greatly be appreciated.

Answer 1

Most likely your TextField is extending past the rest of your button.
It doesn't appear as though your setting the text field's bounds, so it will be the default (usually a 100x100 square).
I suggest explicitly setting the text field's width and height to match your button.
_textField.width = _buttonWidth;
_textField.height = _buttonHeight;
Or instead, if you want all the text visible no matter what, you could use the autoSize property to make the text field bounds match the actual text.
_textField.autoSize = TextFieldAutoSize.LEFT;