URGENT: Inconsistent formatting on iPhone device when using dynamic height

[RayKahn]

Hello, I have noticed that when the app is deployed to an iPhone the column and row distance is not always consistent with what is generated on the simulator. Sometimes the distance is correct and at others its way more than what I have declared minimumColumnSpacing and minimumInteritemSpacing in my XML file. Does anyone know why is this happening? Has any one else experienced this issue? What is the best way to debug such an issue?

[RayKahn]

Also, every time I close the app on the device and restart it the formatting (column and item distance) changes (same issue as when the app is deployed to device). I have added shots of the app on the iPhone device when its built and deployed.

Attempt 1 (way off column distance):

Attempt 2 (Incorrect column and item distance):

Note the inconsistent item distances as well in this attempt:

Attempt 3 (correct column distance but inconsistent item distance):

Again incorrect item distance:

[necov]

How did you even get the differences in height in the pictures? My pictures sticks to a sqaure format.

[RayKahn]

@necov Please see my entries, both XML and .tss.

<ListView id="_listView" defaultItemTemplate="offers" module="de.marcelpociot.collectionview" method="createCollectionView" renderDirection="collectionView.DIRECTION_SHORTEST_FIRST" layout="1" columnCount="2" minimumColumnSpacing="10dp" minimumInteritemSpacing="8dp"> <Templates> <ItemTemplate name="offers" class="_offers"> <View class="mainView" layout="vertical" top="0" bindId="mainView" onClick="itemClicked"> <ImageView class="img" bindId="pic"></ImageView> <View class="topView" bindId="_topView" id="topView"> <View class="infoView"> <Label class="infoClass" bindId="info"></Label> </View> <View class="priceView" id="_priceView"> <Label class="priceClass" bindId="price"></Label> </View> </View> <View class="hLine"></View> <View class="lowerView" bindId="_lowerView"> <View class="providerView"> <Label class="providerName" bindId="es_info"></Label> </View> <View class="likeView"> <View class="iconView"> <ImageView class="imgIcon"></ImageView> </View> <Label class="likeCount" bindId="like_count"></Label> </View> </View> </View> </ItemTemplate> </Templates> </ListView>

And .tss:

"#_listView": { top: Alloy.Globals.ListViewTop, left: 5, right: 5, width: Ti.UI.FILL, height: Ti.UI.FILL, },

"._offers": { width: Ti.UI.FILL,
height: Ti.UI.FILL, },

".mainView": { width: Ti.UI.FILL, height: Ti.UI.SIZE, backgroundColor: "#fff", borderRadius: '3dp', },

".topView": { width: Ti.UI.FILL, height: 35, //layout: 'vertical' },

".infoView": { height: 25, width: "65%", wordWrap: true, left: 0, },

".priceView": { height: 25, width: Titanium.UI.SIZE, right: 5, //borderRadius: 1, //borderColor: "#e5e5e5", //borderRadius: 3, }

".priceClass": { width: Titanium.UI.SIZE, height: Titanium.UI.FILL, color: 'gray', font: { fontFamily:'Arial', fontSize: '9.5dp' }, right: 5, left: 5, }

".lowerView": { width: Ti.UI.FILL, height: 35, //layout: 'vertical' },

".img": { top: 5, left: 5, right: 5, borderRadius: '3dp', height: 'auto', width: Ti.UI.FILL, },

".providerView": { height: 25, width: "50%", left: 0, //top: 5, //backgroundColor: 'red' },

".likeView": { layout: 'horizontal', height: 25, top: 5, width: Ti.UI.SIZE, right: 5, backgroundColor: Alloy.Globals.BackgroundColor, opacity: 0.85, borderRadius: 3, },

".hLine": { width: Titanium.UI.FILL, height: 1, backgroundColor: "#cccccc", //top: 5, //bottom: 10, left: 5, right: 5, },

".infoClass": { width: Titanium.UI.FILL, height: Titanium.UI.SIZE, color: 'gray', font: { fontFamily:'Arial', fontSize: '10dp' }, left: 7, right: 5 },

".providerName": { height: Titanium.UI.SIZE, width: Ti.UI.FILL, color: 'gray', font: { fontFamily:'Arial', fontSize: '10dp' }, left: 7, //top: 20, },

".iconView": { height: 15, width: 15, right: 5, top: 5, bottom: 5, left: 5, },

".imgIcon": { height: 15, width: 15, image: "images/Like-White-Filled.png" },

".likeCount": { color: '#fff', font: { fontFamily:'Arial', fontSize: '11dp' }, top: 6, right: 5, }

BTW, do you experience different formatting when you close the app and re-open it? By formatting I mean cell placements, width and height.

[nuno]

Reopen if need, please test with module 2.0, thanks!