{
	"id": "121269",
	"key": "TIMOB-15501",
	"fields": {
		"issuetype": {
			"id": "1",
			"description": "A problem which impairs or prevents the functions of the product.",
			"name": "Bug",
			"subtask": false
		},
		"project": {
			"id": "10153",
			"key": "TIMOB",
			"name": "Titanium SDK/CLI",
			"projectCategory": {
				"id": "10100",
				"description": "Titanium and related SDKs used in application development",
				"name": "Client"
			}
		},
		"fixVersions": [
			{
				"id": "15922",
				"description": "2014 Sprint 03",
				"name": "2014 Sprint 03",
				"archived": true,
				"released": true,
				"releaseDate": "2014-02-14"
			},
			{
				"id": "15923",
				"description": "2014 Sprint 03 API",
				"name": "2014 Sprint 03 API",
				"archived": true,
				"released": true,
				"releaseDate": "2014-02-14"
			}
		],
		"resolution": {
			"id": "2",
			"description": "The problem described is an issue which will never be fixed.",
			"name": "Won't Fix"
		},
		"resolutiondate": "2014-02-03T23:55:47.000+0000",
		"created": "2013-10-16T09:55:17.000+0000",
		"priority": {
			"name": "Medium",
			"id": "3"
		},
		"labels": [
			"supportTeam",
			"triage"
		],
		"versions": [
			{
				"id": "15479",
				"description": "Release 3.1.2",
				"name": "Release 3.1.2",
				"archived": true,
				"released": true,
				"releaseDate": "2013-07-31"
			},
			{
				"id": "15593",
				"description": "Release 3.1.3",
				"name": "Release 3.1.3",
				"archived": true,
				"released": true,
				"releaseDate": "2013-09-18"
			}
		],
		"issuelinks": [],
		"assignee": {
			"name": "vduggal",
			"key": "vduggal",
			"displayName": "Vishal Duggal",
			"active": false,
			"timeZone": "America/Los_Angeles"
		},
		"updated": "2017-03-22T18:27:02.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": "10206",
				"name": "iOS",
				"description": "iOS Platform"
			}
		],
		"description": "When using multiple views with scrollable view, flickering effect if observed in iOS7 with 3.1.3.GA.\r\n\r\nSteps to reproduce:\r\n\r\n1: Use the sample code1 to reproduce the issue.\r\n2: Use the code in app.js of a newly created project.\r\n3: Build the project for iOS7 device (Simulator does not reproduce it).\r\n4: check the effect while changing the orientation.\r\n\r\nNote: sample code 2, does not reproduce the issue. Having less views in container view.\r\n**Sample code1 - can reproduce issue**\r\n\r\n{code}\r\nvar headerView = Ti.UI.createView({\r\n\r\n\tbackgroundColor : '#DB2027',\r\n\theight : '40dp'\r\n});\r\n\r\nvar headerTitle = Ti.UI.createLabel({\r\n\r\n\ttext : \"Main Window\",\r\n\tfont : {\r\n\t\tfontSize : '20dp',\r\n\t\tfontWeight : 'bold'\r\n\t},\r\n\ttextAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,\r\n\tcolor : '#FFFFFF'\r\n\r\n});\r\n\r\nheaderView.add(headerTitle);\r\n\r\n// btn\r\n\r\nvar leftBtnSetting = Ti.UI.createButton({\r\n\tsettingsOpen : false,\r\n\tleft : '5dp',\r\n\theight : '15dp',\r\n\tstyle : Ti.UI.iPhone.SystemButtonStyle.PLAIN,\r\n\ttitle : \"Ashish\"\r\n});\r\n\r\nheaderView.add(leftBtnSetting);\r\n\r\nvar rtBtn = Ti.UI.createButton({\r\n\ttitle : \"right\",\r\n\t//color: 'white',\r\n\tfont : {\r\n\t\tfontSize : '15dp',\r\n\t},\r\n\tright : '5dp'\r\n});\r\n\r\nheaderView.add(rtBtn);\r\n\r\n// btn end\r\n\r\nvar win = Ti.UI.createWindow({\r\n\ttop : 20,\r\n\tbackgroundColor : \"black\",\r\n\torientationModes : [Ti.UI.PORTRAIT, Ti.UI.LANDSCAPE_LEFT, Ti.UI.LANDSCAPE_RIGHT]\r\n});\r\n\r\nvar containerView = Ti.UI.createView({\r\n\tbackgroundColor : \"gray\",\r\n\ttop : 0,\r\n\tlayout : \"vertical\"\r\n});\r\n\r\ncontainerView.add(headerView);\r\n\r\n//view 1\r\n\r\nvar surveyView = Ti.UI.createView({\r\n\tbackgroundColor : '#d0d0d0',\r\n\tlayout : 'vertical'\r\n});\r\n\r\nvar surveyNames = ['Check1', 'Check2', 'Check3', 'Check4', 'Check5'];\r\nvar surveyUnits = ['(feet)', '(degrees)', '(degrees)', '(feet)', '(deg/100 ft)'];\r\n\r\nfunction createColumnHeader (names, units){\r\n    \r\n    \r\n    var viewWidth = (100/names.length).toString() + '%';\r\n    \r\n    var headerView = Ti.UI.createView({\r\n        height : '60dp',\r\n        layout : 'horizontal',\r\n        backgroundColor : '#CCCCCC'\r\n    });\r\n    \r\n    \r\n    names.forEach(function(e, i){\r\n        \r\n        var view = Ti.UI.createView({\r\n        width : viewWidth,\r\n        height : headerView.height,\r\n        left : '0dp',\r\n        borderWidth : 0.3,\r\n        borderColor : '#444444',\r\n        layout: 'vertical'\r\n        });\r\n    \r\n        var label = Ti.UI.createLabel({\r\n            text : e,\r\n            top : '10dp',\r\n            color : '#333333',\r\n            textAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,\r\n            font : {\r\n                fontSize : '12dp',\r\n                fontWeight : 'bold'\r\n            }\r\n            \r\n        });\r\n        \r\n        label.setHeight(Ti.UI.SIZE);\r\n        \r\n        view.add(label);\r\n        \r\n        if(units)\r\n        {\r\n            var unitLabel = Ti.UI.createLabel({\r\n                text : units[i],\r\n                textAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,\r\n                font : {\r\n                    fontSize : '10dp'\r\n                }\r\n            \r\n            });\r\n            view.add(unitLabel);\r\n        }\r\n        \r\n        //view.setHeight(Ti.UI.SIZE);\r\n    \r\n        headerView.add(view);\r\n    });\r\n    \r\n    //headerView.setHeight(Ti.UI.SIZE);\r\n    return headerView;\r\n    \r\n};\r\n\r\nvar surveyHeaderView = createColumnHeader(surveyNames, surveyUnits);\r\n\r\nsurveyView.add(surveyHeaderView);\r\n\r\nvar rows = [];\r\n\r\nvar values = [3000, 4000, 5000, 6000, 7000];\r\n\r\nfunction createSurveyPageRow (values){\r\n    \r\n    \r\n    var viewWidth = (100/values.length).toString() + '%';\r\n    \r\n    var tableRow = Ti.UI.createTableViewRow({\r\n        height : '40dp',\r\n        className : 'surveyRow',\r\n        backgroundColor : '#EEEEEE'\r\n    });\r\n    \r\n    var rowView = Ti.UI.createView({\r\n        height : '40dp',\r\n        layout : 'horizontal'\r\n    });\r\n    \r\n    \r\n    values.forEach(function(e){\r\n        \r\n        var view = Ti.UI.createView({\r\n            width : viewWidth,\r\n            height : rowView.height,\r\n            left : '0dp',\r\n            layout: 'vertical'\r\n        });\r\n    \r\n        var label = Ti.UI.createLabel({\r\n            text : e,\r\n            top : '10dp',\r\n            textAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,\r\n            font : {\r\n                fontSize : '12dp'\r\n            }\r\n            \r\n        });\r\n        \r\n        view.add(label);\r\n        \r\n        rowView.add(view);\r\n    });\r\n    \r\n    tableRow.add(rowView);\r\n    return tableRow;\r\n    \r\n};\r\n\r\nfor ( i = 0; i < 5; i++) {\r\n\trows.push(createSurveyPageRow(values));\r\n}\r\n\r\nvar tableView = Ti.UI.createTableView({\r\n\tdata : rows,\r\n});\r\n\r\nsurveyView.add(tableView);\r\n\r\n//view end\r\n\r\n// var view1 = Ti.UI.createView({\r\n\t// width : Ti.UI.FILL,\r\n\t// height : Ti.UI.FILL,\r\n\t// backgroundColor : \"red\"\r\n// });\r\n\r\n// var view2 = Ti.UI.createView({\r\n\t// width : Ti.UI.FILL,\r\n\t// height : Ti.UI.FILL,\r\n\t// backgroundColor : \"yellow\"\r\n// });\r\n\r\ncreateLithologyPageRow = function(data){\r\n    \r\n    //var key = Object.keys(data);\r\n    \r\n    //alert(key.length);\r\n    \r\n    var keys = Object.keys(data); // Get an array of property names for object o\r\n    var values = []; // Store matching property values in this array \r\n    for(var i = 0; i < keys.length; i++) { // For each index in the array\r\n        var key = keys[i]; // Get the key at that index\r\n        values[i] = data[key]; // Store the value in the values array \r\n    }\r\n    \r\n    var viewWidth = (100/keys.length).toString() + '%';\r\n    \r\n    \r\n    var tableRow = Ti.UI.createTableViewRow({\r\n        backgroundColor : '#666666',\r\n        className : 'lithologyRow'\r\n    });\r\n    \r\n    var rowView = Ti.UI.createView({\r\n        top : '0dp',\r\n        bottom : '0dp',\r\n        layout : 'horizontal'\r\n    });\r\n    \r\n    \r\n    //keys.forEach(function(e, index){\r\n    for(index=0; index<keys.length ; index++){  \r\n        var view = Ti.UI.createView({\r\n            width : viewWidth,\r\n            top : '0dp',\r\n            left : '0dp',\r\n            bottom : '0dp',\r\n            layout: 'vertical'\r\n        });\r\n    \r\n        var val_obj = values[index];\r\n        var val_obj_keys = Object.keys(values[index]);\r\n        var val = [];\r\n        \r\n        for(var i = 0; i < val_obj_keys.length; i++) { // For each index in the array\r\n            var key = val_obj_keys[i]; // Get the key at that index\r\n            val[i] = val_obj[key]; // Store the value in the values array \r\n        }\r\n        \r\n        \r\n        for(i=0; i<val.length ; i++)\r\n        {\r\n            var label = Ti.UI.createLabel({\r\n                text : val[i],\r\n                top : '0dp',\r\n                textAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,\r\n                font : {\r\n                    fontSize : '14dp'\r\n                }\r\n                \r\n            });\r\n            \r\n            view.add(label);\r\n        }\r\n        view.setHeight(Ti.UI.SIZE); \r\n        rowView.add(view);\r\n    };\r\n    \r\n    rowView.setHeight(Ti.UI.SIZE);\r\n    tableRow.add(rowView);\r\n    \r\n    //tableRow.setHeight(Ti.UI.SIZE);\r\n    \r\n    return tableRow;\r\n    \r\n};\r\n\r\n\r\n\r\nvar lithologyView = Ti.UI.createView({\r\n\t\tbackgroundColor : '#e3e3e3',\r\n\t\tlayout : 'vertical'\r\n\t});\r\n\r\n\tvar lithologyNames = ['Check1', 'Check2', '%', 'REMARKS'];\r\n\r\n\tvar lithologyHeaderView = createColumnHeader(lithologyNames);\r\n\r\n\tlithologyView.add(lithologyHeaderView);\r\n\r\n\tvar rows = [];\r\n\r\n\tvar value_row1 = {\r\n\r\n\t\t'Check1' : {\r\n\t\t\t1 : '3000'\r\n\t\t},\r\n\t\t'Check2' : {\r\n\t\t\t0 : 'Check2A',\r\n\t\t\t1 : 'Check2B',\r\n\t\t\t2 : 'Check2C',\r\n\t\t\t3 : 'Check2D'\r\n\t\t},\r\n\t\t'Check3' : {\r\n\t\t\t1 : '25%',\r\n\t\t\t2 : '25%',\r\n\t\t\t3 : '25%',\r\n\t\t\t4 : '25%'\r\n\t\t},\r\n\t\t'Remarks' : {\r\n\t\t\t1 : 'YES'\r\n\t\t}\r\n\t};\r\n\r\n\tvar value_row2 = {\r\n\r\n\t\t'Check1' : {\r\n\t\t\t1 : '3000'\r\n\t\t},\r\n\t\t'Check2' : {\r\n\t\t\t0 : 'Check2A',\r\n\t\t\t1 : 'Check2B',\r\n\t\t\t2 : 'Check2C',\r\n\t\t\t3 : 'Check2D'\r\n\t\t},\r\n\t\t'Check3' : {\r\n\t\t\t1 : '25%',\r\n\t\t\t2 : '25%',\r\n\t\t\t3 : '25%',\r\n\t\t\t4 : '25%'\r\n\t\t},\r\n\t\t'Remarks' : {\r\n\t\t\t1 : 'YES'\r\n\t\t}\r\n\t};\r\n\r\n\tvar value_row3 = {\r\n\r\n\t\t'Check1' : {\r\n\t\t\t1 : '3000'\r\n\t\t},\r\n\t\t'Check2' : {\r\n\t\t\t0 : 'Check2A',\r\n\t\t\t1 : 'Check2B',\r\n\t\t\t2 : 'Check2C',\r\n\t\t\t3 : 'Check2D'\r\n\t\t},\r\n\t\t'Check3' : {\r\n\t\t\t1 : '25%',\r\n\t\t\t2 : '25%',\r\n\t\t\t3 : '25%',\r\n\t\t\t4 : '25%'\r\n\t\t},\r\n\t\t'Remarks' : {\r\n\t\t\t1 : 'YES'\r\n\t\t}\r\n\t};\r\n\t\r\n\t\r\n    rows.push(createLithologyPageRow(value_row1));\r\n    rows.push(createLithologyPageRow(value_row2));\r\n    rows.push(createLithologyPageRow(value_row3));\r\n\r\n    var tableView = Ti.UI.createTableView({\r\n        data : rows,\r\n    });\r\n    rows[0].addEventListener('click', function(e) {\r\n\r\n        var win = Titanium.UI.createWindow({\r\n            url : 'ui/handheld/lithology_detail.js',\r\n            backgroundColor : '#FFFFFF',\r\n            top:iOS7 ? 20 : 0,\r\n            statusBarStyle : osStatusBarStyle,\r\n            layout : 'vertical',\r\n            fullscreen : false\r\n         });\r\n        win.open(leftNavAnimation);\r\n\r\n    });\r\n    tableView.setHeight(Ti.UI.SIZE);\r\n    \r\n    lithologyView.add(tableView);\r\n    \r\n    var monitorSettingsBtn = Ti.UI.createButton({\r\n        title : 'Monitor Settings',\r\n        //bottom : 10,\r\n        //left : '40%',\r\n    });\r\n\r\n    lithologyView.add(monitorSettingsBtn);\r\n    \r\n    monitorSettingsBtn.addEventListener('click', function(e) {\r\n        \r\n        var win = Titanium.UI.createWindow({\r\n            url : 'ui/handheld/monitorSettings.js',\r\n            backgroundColor : '#FFFFFF',\r\n            top:iOS7 ? 20 : 0,\r\n            statusBarStyle : osStatusBarStyle,\r\n            layout : 'vertical',\r\n            fullscreen : false\r\n        });\r\n        win.open(leftNavAnimation);\r\n        \r\n    });\r\n\r\nvar slableView = Ti.UI.createScrollableView({\r\n\tviews : [surveyView, lithologyView],\r\n\tshowPagingControl : true\r\n});\r\n\r\ncontainerView.add(slableView);\r\n\r\nwin.add(containerView);\r\n\r\nwin.open();\r\n\r\n{code}\r\n\r\n**sample code2 - does not reproduce issue**\r\n\r\n{code}\r\nvar headerView = Ti.UI.createView({\r\n\r\n\tbackgroundColor : '#DB2027',\r\n\theight : '40dp'\r\n});\r\n\r\nvar headerTitle = Ti.UI.createLabel({\r\n\r\n\ttext : \"Main Window\",\r\n\tfont : {\r\n\t\tfontSize : '20dp',\r\n\t\tfontWeight : 'bold'\r\n\t},\r\n\ttextAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,\r\n\tcolor : '#FFFFFF'\r\n\r\n});\r\n\r\nheaderView.add(headerTitle);\r\n\r\n// btn\r\n\r\nvar leftBtnSetting = Ti.UI.createButton({\r\n\tsettingsOpen : false,\r\n\tleft : '5dp',\r\n\theight : '15dp',\r\n\tstyle : Ti.UI.iPhone.SystemButtonStyle.PLAIN,\r\n\ttitle:\"Ashish\"\r\n});\r\n\r\nheaderView.add(leftBtnSetting);\r\n\r\nvar rtBtn = Ti.UI.createButton({\r\n\ttitle : \"right\",\r\n\t//color: 'white',\r\n\tfont : {\r\n\t\tfontSize : '15dp',\r\n\t},\r\n\tright : '5dp'\r\n});\r\n\r\nheaderView.add(rtBtn);\r\n\r\n// btn end\r\n\r\nvar win = Ti.UI.createWindow({\r\n\ttop : 20,\r\n\tbackgroundColor : \"black\",\r\n\torientationModes : [Ti.UI.PORTRAIT, Ti.UI.LANDSCAPE_LEFT, Ti.UI.LANDSCAPE_RIGHT]\r\n});\r\n\r\nvar containerView = Ti.UI.createView({\r\n\tbackgroundColor : \"gray\",\r\n\ttop : 0,\r\n\tlayout : \"vertical\"\r\n});\r\n\r\ncontainerView.add(headerView);\r\n\r\nvar view1 = Ti.UI.createView({\r\n\twidth : Ti.UI.FILL,\r\n\theight : Ti.UI.FILL,\r\n\tbackgroundColor : \"red\"\r\n});\r\n\r\nvar view2 = Ti.UI.createView({\r\n\twidth : Ti.UI.FILL,\r\n\theight : Ti.UI.FILL,\r\n\tbackgroundColor : \"yellow\"\r\n});\r\n\r\nvar slableView = Ti.UI.createScrollableView({\r\n\tviews : [view1, view2],\r\n\tshowPagingControl : true\r\n});\r\n\r\ncontainerView.add(slableView);\r\n\r\nwin.add(containerView);\r\n\r\nwin.open();\r\n\r\n{code}",
		"attachment": [],
		"flagged": false,
		"summary": "iOS: ScrollableView with many child views flicker when changing orientation",
		"creator": {
			"name": "anigam",
			"key": "anigam",
			"displayName": "Ashish Nigam",
			"active": true,
			"timeZone": "Asia/Kolkata"
		},
		"subtasks": [],
		"reporter": {
			"name": "anigam",
			"key": "anigam",
			"displayName": "Ashish Nigam",
			"active": true,
			"timeZone": "Asia/Kolkata"
		},
		"environment": "Titanium Mobile SDK 3.1.3GA, 3.1.2GA\r\niOS7",
		"comment": {
			"comments": [
				{
					"id": "275262",
					"author": {
						"name": "anigam",
						"key": "anigam",
						"displayName": "Ashish Nigam",
						"active": true,
						"timeZone": "Asia/Kolkata"
					},
					"body": "Sample code2 does not reproduce the issue, as it does not contain many views attached to a single view of scrollable view.",
					"updateAuthor": {
						"name": "anigam",
						"key": "anigam",
						"displayName": "Ashish Nigam",
						"active": true,
						"timeZone": "Asia/Kolkata"
					},
					"created": "2013-10-16T10:04:01.000+0000",
					"updated": "2013-10-16T10:04:01.000+0000"
				},
				{
					"id": "291021",
					"author": {
						"name": "vduggal",
						"key": "vduggal",
						"displayName": "Vishal Duggal",
						"active": false,
						"timeZone": "America/Los_Angeles"
					},
					"body": "This is not exactly a ScrollableView problem but a symptom of our layout system limitation that the ScrollableView exacerbates (since it has to manage and update the internal page cache on rotation)\r\n\r\nThe way this UI is set up, you have nested vertical layouts in horizontal layouts within vertical layouts. While the horizontal and vertical layouts are nice to have they are inherently slower than the absolute layout system since the layout engine has to measure every view before starting a layout pass. The more constraints the layout engine has to resolve the slower the layout is going to be\r\n\r\nA second problem is with the Ti.UI.TEXT_ALIGNMENT_CENTER property of the Label. This property is only useful if you have multiple lines of text or the width of the Label is more than that of the text. Setting this property of single lines of text with width set to SIZE only causes UI glitches (the flickering effect) since the actual label drawing happens outside the animated layout loop.\r\n\r\nThis particular screen can easily be modified to an absolute layout. Please see sample code below which modifies the container view and the first page of the Scrollable view to an absolute layout. Further improvements can be gained by incorporating the table header views into the table view itself (as a row so it lays out along with the other rows). The second screen can also be set up similarly.\r\n\r\n{code}\r\n\r\nvar headerView = Ti.UI.createView({\r\n    top:'0dp', \r\n    backgroundColor : '#DB2027',\r\n    height : '40dp'\r\n});\r\n \r\nvar headerTitle = Ti.UI.createLabel({\r\n \r\n    text : \"Main Window\",\r\n    font : {\r\n        fontSize : '20dp',\r\n        fontWeight : 'bold'\r\n    },\r\n    //textAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,\r\n    color : '#FFFFFF'\r\n \r\n});\r\n \r\nheaderView.add(headerTitle);\r\n \r\n// btn\r\n \r\nvar leftBtnSetting = Ti.UI.createButton({\r\n    settingsOpen : false,\r\n    left : '5dp',\r\n    height : '15dp',\r\n    style : Ti.UI.iPhone.SystemButtonStyle.PLAIN,\r\n    title : \"Ashish\"\r\n});\r\n \r\nheaderView.add(leftBtnSetting);\r\n \r\nvar rtBtn = Ti.UI.createButton({\r\n    title : \"right\",\r\n    //color: 'white',\r\n    font : {\r\n        fontSize : '15dp',\r\n    },\r\n    right : '5dp'\r\n});\r\n \r\nheaderView.add(rtBtn);\r\n \r\n// btn end\r\n \r\nvar win = Ti.UI.createWindow({\r\n    top : 20,\r\n    backgroundColor : \"black\",\r\n    orientationModes : [Ti.UI.PORTRAIT, Ti.UI.LANDSCAPE_LEFT, Ti.UI.LANDSCAPE_RIGHT]\r\n});\r\n \r\nvar containerView = Ti.UI.createView({\r\n    backgroundColor : \"gray\"\r\n});\r\n \r\ncontainerView.add(headerView);\r\n \r\n//view 1\r\n \r\nvar surveyView = Ti.UI.createView({\r\n    backgroundColor : '#d0d0d0'\r\n});\r\n \r\nvar surveyNames = ['Check1', 'Check2', 'Check3', 'Check4', 'Check5'];\r\nvar surveyUnits = ['(feet)', '(degrees)', '(degrees)', '(feet)', '(deg/100 ft)'];\r\n \r\nfunction createColumnHeader (names, units){\r\n     \r\n    \r\n    var offset = (100/names.length); \r\n    var viewWidth = offset.toString() + '%';\r\n     \r\n    var headerView = Ti.UI.createView({\r\n        height : '60dp',\r\n        backgroundColor : '#CCCCCC',\r\n        top:'0dp'\r\n    });\r\n     \r\n    var counter = 0; \r\n    names.forEach(function(e, i){\r\n         \r\n        var view = Ti.UI.createView({\r\n            width : viewWidth,\r\n            height : headerView.height,\r\n            left : (counter*offset).toString() + '%',\r\n            borderWidth : 0.3,\r\n            borderColor : '#444444'\r\n        });\r\n     \r\n        var label = Ti.UI.createLabel({\r\n            text : e,\r\n            top : '10dp',\r\n            color : '#333333',\r\n            //textAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,\r\n            font : {\r\n                fontSize : '12dp',\r\n                fontWeight : 'bold'\r\n            }\r\n             \r\n        });\r\n         \r\n        view.add(label);\r\n         \r\n        if(units)\r\n        {\r\n            var unitLabel = Ti.UI.createLabel({\r\n                text : units[i],\r\n                //textAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,\r\n                font : {\r\n                    fontSize : '10dp'\r\n                },\r\n                top: '30dp'\r\n             \r\n            });\r\n            view.add(unitLabel);\r\n        }\r\n         \r\n        //view.setHeight(Ti.UI.SIZE);\r\n        counter ++;\r\n        headerView.add(view);\r\n    });\r\n     \r\n    //headerView.setHeight(Ti.UI.SIZE);\r\n    return headerView;\r\n     \r\n};\r\n \r\nvar surveyHeaderView = createColumnHeader(surveyNames, surveyUnits);\r\n \r\nsurveyView.add(surveyHeaderView);\r\n \r\nvar rows = [];\r\n \r\nvar values = [3000, 4000, 5000, 6000, 7000];\r\n \r\nfunction createSurveyPageRow (values){\r\n     \r\n     \r\n    var offset = (100/values.length); \r\n    var viewWidth = offset.toString() + '%';\r\n     \r\n    var tableRow = Ti.UI.createTableViewRow({\r\n        height : '40dp',\r\n        className : 'surveyRow',\r\n        backgroundColor : '#EEEEEE'\r\n    });\r\n     \r\n    var rowView = Ti.UI.createView({\r\n        height : '40dp',\r\n    });\r\n     \r\n    var counter=0; \r\n    values.forEach(function(e){\r\n         \r\n        var view = Ti.UI.createView({\r\n            width : viewWidth,\r\n            height : rowView.height,\r\n            left : (counter*offset).toString() + '%',\r\n            layout: 'vertical'\r\n        });\r\n     \r\n        var label = Ti.UI.createLabel({\r\n            text : e,\r\n            top : '10dp',\r\n            font : {\r\n                fontSize : '12dp'\r\n            }\r\n             \r\n        });\r\n         \r\n        view.add(label);\r\n        counter ++; \r\n        rowView.add(view);\r\n    });\r\n     \r\n    tableRow.add(rowView);\r\n    return tableRow;\r\n     \r\n};\r\n \r\nfor ( i = 0; i < 5; i++) {\r\n    rows.push(createSurveyPageRow(values));\r\n}\r\n \r\nvar tableView = Ti.UI.createTableView({\r\n    data : rows,\r\n    top: '60 dp'\r\n});\r\n \r\nsurveyView.add(tableView);\r\n \r\n//view end\r\n \r\n// var view1 = Ti.UI.createView({\r\n    // width : Ti.UI.FILL,\r\n    // height : Ti.UI.FILL,\r\n    // backgroundColor : \"red\"\r\n// });\r\n \r\n// var view2 = Ti.UI.createView({\r\n    // width : Ti.UI.FILL,\r\n    // height : Ti.UI.FILL,\r\n    // backgroundColor : \"yellow\"\r\n// });\r\n \r\ncreateLithologyPageRow = function(data){\r\n     \r\n    //var key = Object.keys(data);\r\n     \r\n    //alert(key.length);\r\n     \r\n    var keys = Object.keys(data); // Get an array of property names for object o\r\n    var values = []; // Store matching property values in this array \r\n    for(var i = 0; i < keys.length; i++) { // For each index in the array\r\n        var key = keys[i]; // Get the key at that index\r\n        values[i] = data[key]; // Store the value in the values array \r\n    }\r\n     \r\n    var viewWidth = (100/keys.length).toString() + '%';\r\n     \r\n     \r\n    var tableRow = Ti.UI.createTableViewRow({\r\n        backgroundColor : '#666666',\r\n        className : 'lithologyRow'\r\n    });\r\n     \r\n    var rowView = Ti.UI.createView({\r\n        top : '0dp',\r\n        bottom : '0dp',\r\n        layout : 'horizontal'\r\n    });\r\n     \r\n     \r\n    //keys.forEach(function(e, index){\r\n    for(index=0; index<keys.length ; index++){  \r\n        var view = Ti.UI.createView({\r\n            width : viewWidth,\r\n            top : '0dp',\r\n            left : '0dp',\r\n            bottom : '0dp',\r\n            layout: 'vertical'\r\n        });\r\n     \r\n        var val_obj = values[index];\r\n        var val_obj_keys = Object.keys(values[index]);\r\n        var val = [];\r\n         \r\n        for(var i = 0; i < val_obj_keys.length; i++) { // For each index in the array\r\n            var key = val_obj_keys[i]; // Get the key at that index\r\n            val[i] = val_obj[key]; // Store the value in the values array \r\n        }\r\n         \r\n         \r\n        for(i=0; i<val.length ; i++)\r\n        {\r\n            var label = Ti.UI.createLabel({\r\n                text : val[i],\r\n                top : '0dp',\r\n                textAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,\r\n                font : {\r\n                    fontSize : '14dp'\r\n                }\r\n                 \r\n            });\r\n             \r\n            view.add(label);\r\n        }\r\n        view.setHeight(Ti.UI.SIZE); \r\n        rowView.add(view);\r\n    };\r\n     \r\n    rowView.setHeight(Ti.UI.SIZE);\r\n    tableRow.add(rowView);\r\n     \r\n    //tableRow.setHeight(Ti.UI.SIZE);\r\n     \r\n    return tableRow;\r\n     \r\n};\r\n \r\n \r\n \r\nvar lithologyView = Ti.UI.createView({\r\n        backgroundColor : '#e3e3e3',\r\n        layout : 'vertical'\r\n    });\r\n \r\nvar lithologyNames = ['Check1', 'Check2', '%', 'REMARKS'];\r\n\r\nvar lithologyHeaderView = createColumnHeader(lithologyNames);\r\n\r\nlithologyView.add(lithologyHeaderView);\r\n\r\nvar rows = [];\r\n\r\nvar value_row1 = {\r\n\r\n    'Check1' : {\r\n        1 : '3000'\r\n    },\r\n    'Check2' : {\r\n        0 : 'Check2A',\r\n        1 : 'Check2B',\r\n        2 : 'Check2C',\r\n        3 : 'Check2D'\r\n    },\r\n    'Check3' : {\r\n        1 : '25%',\r\n        2 : '25%',\r\n        3 : '25%',\r\n        4 : '25%'\r\n    },\r\n    'Remarks' : {\r\n        1 : 'YES'\r\n    }\r\n};\r\n\r\nvar value_row2 = {\r\n\r\n    'Check1' : {\r\n        1 : '3000'\r\n    },\r\n    'Check2' : {\r\n        0 : 'Check2A',\r\n        1 : 'Check2B',\r\n        2 : 'Check2C',\r\n        3 : 'Check2D'\r\n    },\r\n    'Check3' : {\r\n        1 : '25%',\r\n        2 : '25%',\r\n        3 : '25%',\r\n        4 : '25%'\r\n    },\r\n    'Remarks' : {\r\n        1 : 'YES'\r\n    }\r\n};\r\n\r\nvar value_row3 = {\r\n\r\n    'Check1' : {\r\n        1 : '3000'\r\n    },\r\n    'Check2' : {\r\n        0 : 'Check2A',\r\n        1 : 'Check2B',\r\n        2 : 'Check2C',\r\n        3 : 'Check2D'\r\n    },\r\n    'Check3' : {\r\n        1 : '25%',\r\n        2 : '25%',\r\n        3 : '25%',\r\n        4 : '25%'\r\n    },\r\n    'Remarks' : {\r\n        1 : 'YES'\r\n    }\r\n};\r\n \r\n \r\nrows.push(createLithologyPageRow(value_row1));\r\nrows.push(createLithologyPageRow(value_row2));\r\nrows.push(createLithologyPageRow(value_row3));\r\n\r\nvar tableView = Ti.UI.createTableView({\r\n    data : rows,\r\n});\r\ntableView.setHeight(Ti.UI.SIZE);\r\n \r\nlithologyView.add(tableView);\r\n \r\nvar monitorSettingsBtn = Ti.UI.createButton({\r\n    title : 'Monitor Settings',\r\n    //bottom : 10,\r\n    //left : '40%',\r\n});\r\n\r\nlithologyView.add(monitorSettingsBtn);\r\n     \r\n \r\nvar slableView = Ti.UI.createScrollableView({\r\n    views : [surveyView, lithologyView],\r\n    showPagingControl : true,\r\n    top:'40dp'\r\n});\r\n \r\ncontainerView.add(slableView);\r\n \r\nwin.add(containerView);\r\n \r\nwin.open();\r\n{code}",
					"updateAuthor": {
						"name": "vduggal",
						"key": "vduggal",
						"displayName": "Vishal Duggal",
						"active": false,
						"timeZone": "America/Los_Angeles"
					},
					"created": "2014-02-03T23:51:25.000+0000",
					"updated": "2014-02-03T23:54:05.000+0000"
				},
				{
					"id": "414865",
					"author": {
						"name": "lmorris",
						"key": "lmorris",
						"displayName": "Lee Morris",
						"active": false,
						"timeZone": "America/Los_Angeles"
					},
					"body": "Closing ticket as the issue will not fix and with reference to the above comments. ",
					"updateAuthor": {
						"name": "lmorris",
						"key": "lmorris",
						"displayName": "Lee Morris",
						"active": false,
						"timeZone": "America/Los_Angeles"
					},
					"created": "2017-03-22T18:27:02.000+0000",
					"updated": "2017-03-22T18:27:02.000+0000"
				}
			],
			"maxResults": 5,
			"total": 5,
			"startAt": 0
		}
	}
}