{ "id": "115138", "key": "AC-2627", "fields": { "issuetype": { "id": "1", "description": "A problem which impairs or prevents the functions of the product.", "name": "Bug", "subtask": false }, "project": { "id": "12217", "key": "AC", "name": "Appcelerator - INBOX", "projectCategory": { "id": "10000", "description": "", "name": "Customer Service" } }, "resolution": { "id": "7", "description": "", "name": "Invalid" }, "resolutiondate": "2013-05-30T18:32:43.000+0000", "created": "2013-05-29T20:52:50.000+0000", "labels": [ "android", "titanium.ui" ], "versions": [], "issuelinks": [], "assignee": { "name": "clathrop", "key": "clathrop", "displayName": "Carter Lathrop", "active": true, "timeZone": "America/Los_Angeles" }, "updated": "2016-03-08T07:41:43.000+0000", "status": { "description": "The issue is considered finished, the resolution is correct. Issues which are closed can be reopened.", "name": "Closed", "id": "6", "statusCategory": { "id": 3, "key": "done", "colorName": "green", "name": "Done" } }, "components": [ { "id": "14551", "name": "Studio", "description": "Please enter tickets related to Titanium Studio here." }, { "id": "14548", "name": "Titanium SDK & CLI", "description": "Please enter tickets related to the MobileSDK here." } ], "description": "h2. Problem\r\n\r\nThe 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).\r\n\r\nIf 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.\r\n\r\nh2. Test case\r\n\r\nTitanium Studio, build: 3.1.0.201304151600\r\nAndroid Emulator: 4.0.3 [x86] HVGA (default properties generated by Titanium)\r\nStarting from the: \"Default Project, A default mobile project without a template\"\r\nReplacing the app.js code with the below.\r\n\r\nWith 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.\r\nCommenting out \"var viewLabel = Ti.UI.createView({ });\" and commenting in the same method that sets the height property and the buttonLogin behaves as expected.\r\nAlternatively, 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.\r\n\r\n{code:lang=javascript|title=app.js}\r\n// Main window\r\nvar win = Ti.UI.createWindow({\r\n backgroundColor: \"white\",\r\n fullscreen: \"false\",\r\n exitOnClose: \"true\"\r\n});\r\n \r\n// Login form view and fields\r\nvar viewLogin = Ti.UI.createView({\r\n layout: \"vertical\"\r\n});\r\n \r\nvar inputUsername = Ti.UI.createTextField({\r\n width: 200,\r\n borderStyle: Ti.UI.INPUT_BORDERSTYLE_ROUNDED,\r\n id: \"inputUsername\",\r\n hintText: \"Username\"\r\n});\r\nviewLogin.add(inputUsername);\r\n \r\nvar inputPassword = Ti.UI.createTextField({\r\n width: 200,\r\n borderStyle: Ti.UI.INPUT_BORDERSTYLE_ROUNDED,\r\n id: \"inputPassword\",\r\n hintText: \"Password\",\r\n passwordMask: \"true\"\r\n});\r\nviewLogin.add(inputPassword);\r\n \r\nvar buttonLogin = Ti.UI.createButton({\r\n id: \"buttonLogin\",\r\n title: \"Login\"\r\n});\r\nbuttonLogin.addEventListener(\"click\", function() {\r\n alert('Do Login!');\r\n});\r\nviewLogin.add(buttonLogin);\r\n \r\nwin.add(viewLogin);\r\n \r\n \r\n// The problem label\r\n \r\n// When viewLabel is appended to the win, the login button action does not fire\r\n// unless height: value is passed to the viewLabel createView method\r\n \r\n// When viewLabel is appended to the viewLogin created above (instead of win)\r\n// there is no conflict with the login button action regardless of height being set\r\n \r\n//var viewLabel = Ti.UI.createView({ height: 40 });\r\nvar viewLabel = Ti.UI.createView({ });\r\n \r\nvar label1 = Ti.UI.createLabel({\r\n text: 'A simple label'\r\n});\r\nviewLabel.add(label1);\r\n \r\n//viewLogin.add(viewLabel);\r\nwin.add(viewLabel);\r\n \r\n \r\nwin.open();\r\n{code}\r\n\r\nh2. Logs\r\n\r\nI didn't see anything in the logs.\r\n\r\nh2. Discussions\r\n\r\nhttp://developer.appcelerator.com/question/152887/button-click-fails-on-androidalloy-if-view-has-no-height", "attachment": [], "flagged": false, "summary": "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).", "creator": { "name": "jwebster", "key": "jwebster", "displayName": "Joe Webster", "active": true, "timeZone": "America/Argentina/Buenos_Aires" }, "subtasks": [], "reporter": { "name": "jwebster", "key": "jwebster", "displayName": "Joe Webster", "active": true, "timeZone": "America/Argentina/Buenos_Aires" }, "environment": "Titanium Studio, build: 3.1.0.201304151600\r\nAndroid Emulator: 4.0.3 [x86] HVGA (default properties generated by Titanium)", "comment": { "comments": [ { "id": "254908", "author": { "name": "clathrop", "key": "clathrop", "displayName": "Carter Lathrop", "active": true, "timeZone": "America/Los_Angeles" }, "body": "Joe,\n\nThis 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 \n\nWhen 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. \n\nJust 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.\n\nRegards,\nCarter", "updateAuthor": { "name": "clathrop", "key": "clathrop", "displayName": "Carter Lathrop", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2013-05-30T18:32:30.000+0000", "updated": "2013-05-30T18:32:30.000+0000" }, { "id": "254952", "author": { "name": "jwebster", "key": "jwebster", "displayName": "Joe Webster", "active": true, "timeZone": "America/Argentina/Buenos_Aires" }, "body": "Hi Carter,\n\nYour explanation makes perfect sense.\n\nThere 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.\n\nCheers!", "updateAuthor": { "name": "jwebster", "key": "jwebster", "displayName": "Joe Webster", "active": true, "timeZone": "America/Argentina/Buenos_Aires" }, "created": "2013-05-30T20:04:43.000+0000", "updated": "2013-05-30T20:04:43.000+0000" }, { "id": "254957", "author": { "name": "clathrop", "key": "clathrop", "displayName": "Carter Lathrop", "active": true, "timeZone": "America/Los_Angeles" }, "body": "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. \n\nHere it is: http://docs.appcelerator.com/titanium/latest/\n\nGood luck!\n\nCarter\n", "updateAuthor": { "name": "clathrop", "key": "clathrop", "displayName": "Carter Lathrop", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2013-05-30T20:12:43.000+0000", "updated": "2013-05-30T20:12:43.000+0000" } ], "maxResults": 3, "total": 3, "startAt": 0 } } }