Titanium JIRA Archive
Appcelerator Community (AC)

[AC-2627] The click event/button action fails to execute within a view, when a 2nd view containing a label is attached to the same window (if a height is not specified for the 2nd view).

GitHub Issuen/a
TypeBug
Priorityn/a
StatusClosed
ResolutionInvalid
Resolution Date2013-05-30T18:32:43.000+0000
Affected Version/sn/a
Fix Version/sn/a
ComponentsStudio, Titanium SDK & CLI
Labelsandroid, titanium.ui
ReporterJoe Webster
AssigneeCarter Lathrop
Created2013-05-29T20:52:50.000+0000
Updated2016-03-08T07:41:43.000+0000

Description

Problem

The click event/button action fails to execute within a view, when a 2nd view containing a label is attached to the same window (if a height is not specified for the 2nd view). If the 2nd view is attached to the 1st view instead of the window, the click event executes correctly. If the 2nd view is attached to the window but the height is set, it executes.

Test case

Titanium Studio, build: 3.1.0.201304151600 Android Emulator: 4.0.3 [x86] HVGA (default properties generated by Titanium) Starting from the: "Default Project, A default mobile project without a template" Replacing the app.js code with the below. With the below code, the click event on buttonLogin will not fire - the style doesn't change to reflect the click and the alert doesn't fire. Commenting out "var viewLabel = Ti.UI.createView({ });" and commenting in the same method that sets the height property and the buttonLogin behaves as expected. Alternatively, leave "var viewLabel = Ti.UI.createView({ });" as it is, and instead comment out "win.add(viewLabel);" and comment in "//viewLogin.add(viewLabel);" which also ensures buttonLogin behaves as expected.
// Main window
var win = Ti.UI.createWindow({
    backgroundColor: "white",
    fullscreen: "false",
    exitOnClose: "true"
});
 
// Login form view and fields
var viewLogin = Ti.UI.createView({
    layout: "vertical"
});
 
var inputUsername = Ti.UI.createTextField({
    width: 200,
    borderStyle: Ti.UI.INPUT_BORDERSTYLE_ROUNDED,
    id: "inputUsername",
    hintText: "Username"
});
viewLogin.add(inputUsername);
 
var inputPassword = Ti.UI.createTextField({
    width: 200,
    borderStyle: Ti.UI.INPUT_BORDERSTYLE_ROUNDED,
    id: "inputPassword",
    hintText: "Password",
    passwordMask: "true"
});
viewLogin.add(inputPassword);
 
var buttonLogin = Ti.UI.createButton({
    id: "buttonLogin",
    title: "Login"
});
buttonLogin.addEventListener("click", function() {
    alert('Do Login!');
});
viewLogin.add(buttonLogin);
 
win.add(viewLogin);
 
 
// The problem label
 
// When viewLabel is appended to the win, the login button action does not fire
// unless height: value is passed to the viewLabel createView method
 
// When viewLabel is appended to the viewLogin created above (instead of win)
// there is no conflict with the login button action regardless of height being set
 
//var viewLabel = Ti.UI.createView({ height: 40 });
var viewLabel = Ti.UI.createView({ });
 
var label1 = Ti.UI.createLabel({
  text: 'A simple label'
});
viewLabel.add(label1);
 
//viewLogin.add(viewLabel);
win.add(viewLabel);
 
 
win.open();

Logs

I didn't see anything in the logs.

Discussions

http://developer.appcelerator.com/question/152887/button-click-fails-on-androidalloy-if-view-has-no-height

Comments

  1. Carter Lathrop 2013-05-30

    Joe, This does not appear to be a bug to me, rather the view hierarchy seems to be working as expected. Please see here: http://docs.appcelerator.com/titanium/3.0/#!/api/Titanium.UI.View-property-height When you do not declare a height for a view it defaults to Ti.UI.FILL which means that its height will be the full height of its parent, in this case the window that you added it to. Since you added this view last to the window it is the top most view on the window and when you click anywhere on the screen since it is now filling up the entire window you will be clicking on the labelView and it will not register click events to those views below it. Just curious, why would you not set a height to your view in the first place? This also seems like bad practice to me, heights and widths should always be set if inside a parent of which you do not want to fill to its edges. I am marking as invalid for now but please let me know if I am missing anything here. Regards, Carter
  2. Joe Webster 2013-05-30

    Hi Carter, Your explanation makes perfect sense. There was no reason I wasn't setting the height on the View. I'm new to the platform so I have been using only properties I wanted to specifically control. I guess I was assuming (coming from a html div approach to layout) that the View would automatically limit itself to the height of any child elements. Cheers!
  3. Carter Lathrop 2013-05-30

    No worries, if you have any more issues or questions, I recommend referencing the docs which has a lot of good information on how to use simple mobile components as well as a lot of good guides on how certain functions work. Here it is: http://docs.appcelerator.com/titanium/latest/ Good luck! Carter

JSON Source