[TIMOB-7836] Android: View - height:'auto' causing view to be placed at the top of its parent rather than centering in the parent
GitHub Issue | n/a |
---|---|
Type | Bug |
Priority | High |
Status | Closed |
Resolution | Fixed |
Resolution Date | 2012-05-02T12:50:23.000+0000 |
Affected Version/s | Release 1.8.1, Release 1.8.2 |
Fix Version/s | Release 2.0.0, Sprint 2012-06 |
Components | Android |
Labels | module_view, parity, qe-testadded |
Reporter | Jon Alter |
Assignee | Allen Yeung |
Created | 2012-02-28T08:12:01.000+0000 |
Updated | 2012-05-02T12:50:23.000+0000 |
Description
Setting the height of a view to 'auto' causes the view to be displayed at the top of parent as if you had set 'view.top = 0;'.
When the height of the view is set to something constant, it is displayed at the center of the parent view as it should be.
Steps to reproduce:
Step 1: run the code below Step 2: notice the the red view is at the top of the window (it should be centered vertically) Step 3: in sectionView change "height: 'auto'" to "height: 50" Step 4: run the app again Step 5: notice that the view is centered vertically in the window
var win = Ti.UI.createWindow({backgroundColor:'white'});
win.open();
var section = createSectionView('TEST');
win.add(section);
function createSectionView(text){
// using 'auto' here causes the view to be displayed at the top instead of
// being centered in the parent
var sectionView = Ti.UI.createView({
height: 'auto',
// height: 50,
layout: 'vertical',
});
// using 'auto' here causes clickView to not be displayed
var sectionHeader = Ti.UI.createView({
height: 'auto',
// height: 30,
backgroundColor:'red',
});
var sectionHeaderLabel = Ti.UI.createLabel({
text: text,
height: 'auto',
top: 2,
bottom: 3,
left: 10,
right: 10,
color: '#FFF',
});
var clickView = Ti.UI.createView({
backgroundColor: 'green',
opacity: 0.5,
});
sectionView.add(sectionHeader);
sectionHeader.add(sectionHeaderLabel);
sectionHeader.add(clickView);
return sectionView;
};
The behavior for this has changed as a result of the new composite layout spec: https://wiki.appcelerator.org/display/guides2/UI+Composite+Layout+Behavior+Spec With the new layout spec you can achieve something similar by the following:
PR to achieve parity with iOS ready here: https://github.com/appcelerator/titanium_mobile/pull/1659
Could that Wiki page be publicly available? I'm getting this message: Page Not Found The page you were trying to reach could not be found. This could be because: The page does not exist. The page exists, but you do not have permission to view it.
That wiki link should be public once we release 2.0
OK, thanks.
Closing bug. Verified fix on: SDK build: 2.0.0.v20120316171745 Runtime: v8, rhino Titanium Studio, build: 2.0.0.201203152033 Device: Nexus S (2.3.6)
Reopening to edit comment.
Open to update label