Titanium JIRA Archive
Appcelerator Community (AC)

[AC-2776] iOS Ti.Platform.displayCaps.platformHeight inconsistency

GitHub Issuen/a
TypeBug
Priorityn/a
StatusClosed
ResolutionCannot Reproduce
Resolution Date2012-07-31T05:22:48.000+0000
Affected Version/sn/a
Fix Version/sn/a
ComponentsStudio
Labels100%, iOS, inconsistency, platformHeight, serviceBar
ReporterK.
AssigneeDavide Cassenti
Created2012-06-30T11:42:25.000+0000
Updated2016-03-08T07:47:41.000+0000

Description

On iOS simulator and device Ti.Platform.displayCaps.platformHeight does not calculate the always present 'service bar' at the top of the screen which becomes an issue when attempting to use more than one view in an absolute layout. My previously working solution, Math.round( ((Ti.Platform.displayCaps.platformHeight - 20)/100) * percentageNumber ), where 20 is the service bar's height on non-retina screens has become unusable when trying to resize a map view, and I would need re-write these allowances for every instance since the service bar height and appearance changes, (retina, non-retina, android) Steps to Replicate: 1. Create a window, (with navBarHidden: false in my case, but should not make a difference) 2. Add 3 views to be split amongst the Ti.Platform.displayCaps.platformHeight customTabBar = createView at bottom:0, height:'10%' scrollableView = createScrollableView at top:0, height:'40%' mapView = Map.createView at top:'40%', height'50%' (add to window map last so that you can see the difference) Result: 100 percent of screen used but map view overlaps view at bottom:0. This becomes more evident when the same customTabBar and scrollableView are placed side by side, splitting the screen at height: '90%, where the result is the map view overlapping and scrollable view much closer to target. since I do not want to continually load the map with every scrollableView change and resize, which occurs with vertical split to horizontal split of the screen, the resizing and movement of multiple views in an absolute layout with a custom tab or nav bar is often necessary. Keeping the map at a lower zIndex makes the map's touch events unreachable. older post, slightly different layout, same issue: http://developer.appcelerator.com/question/137321/platformheight--100-possible-dividing-issue-on-ios

Comments

  1. Davide Cassenti 2012-07-17

    Hello, I tried to replicate the issue, but with the following code I do not see any overlap. Is your code supposed to have anything different?
       var win = Ti.UI.createWindow({
           navBarHidden: true,
           backgroundColor: '#000'
       });
       
       var customTabBar = Ti.UI.createView({
       	bottom: 0,
       	height: '10%',
       	left: 30,
       	backgroundColor: 'yellow'
       });
       win.add(customTabBar);
       
       var scrollableView = Ti.UI.createScrollableView({
       	top: 0,
       	left: 10,
       	height: '40%',
       	backgroundColor: 'blue'
       });
       win.add(scrollableView);
       
       var mapView = Ti.Map.createView({
       	top: '40%',
       	height: '50%',
       	right:50 
       });
       win.add(mapView);
            
       win.open();
       
  2. Davide Cassenti 2012-07-23

    Hello, Did you fix the problem? Is my code different from what you are trying on your side? Thanks
  3. Shak Hossain 2014-01-01

    Closing since we have not heard back from the reporter. A functional sample has been posted as well.

JSON Source