Merten P. created FLEX-33383:
--------------------------------
Summary: List is Flickering on mobile when different number of
lines in message
Key: FLEX-33383
URL: https://issues.apache.org/jira/browse/FLEX-33383
Project: Apache Flex
Issue Type: Bug
Components: Mobile: List
Affects Versions: Apache Flex 4.9.0
Reporter: Merten P.
On a List with an IconItemRenderer in it. When beginning to scroll on mobile,
the list is flickering on the first time (gets white for one frame). This only
happens when the messageField/messageFunction is set and there is a different
number of lines in the message areas.
Sample Code:
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009";
xmlns:s="library://ns.adobe.com/flex/spark" title="HomeView">
<s:actionContent>
<s:Button label="Set List" click="btn_click(event)"/>
</s:actionContent>
<s:List width="100%" height="100%" id="list">
<s:itemRenderer>
<fx:Component>
<s:IconItemRenderer messageField="text"/>
</fx:Component>
</s:itemRenderer>
</s:List>
<fx:Script>
<![CDATA[
import mx.collections.ArrayList;
protected function btn_click(event:MouseEvent):void
{
var al:ArrayList = new ArrayList;
var obj:Object;
var str:String =
"blablablablablablablablablablablablablablablablablablablablabblablablablablablablablablablablablablablablablablablablablabblablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablabla";
for(var i:int = 0; i < 20; i++) {
obj = new Object;
obj.text = str.substr(0, Math.random()*str.length);
al.addItem(obj);
}
list.dataProvider = al;
}
]]>
</fx:Script>
</s:View>
Solution:
Either in the list component:
<s:List xmlns:s="library://ns.adobe.com/flex/spark"
initialize="initializeHandler(event)" horizontalScrollPolicy="off">
<fx:Script>
<![CDATA[
import spark.layouts.HorizontalAlign;
import spark.layouts.VerticalLayout;
//init
protected override function initializeHandler(e:FlexEvent):void
{
(dataGroup.layout as VerticalLayout).horizontalAlign =
HorizontalAlign.CONTENT_JUSTIFY;
}
]]>
</fx:Script>
</s:List>
Or via Skinning:
package skins
{
import spark.layouts.HorizontalAlign;
import spark.layouts.VerticalLayout;
import spark.skins.mobile.ListSkin;
public class MyListSkin extends ListSkin
{
public function MyListSkin()
{
super();
}
//create children
override protected function createChildren():void
{
super.createChildren();
//change align on vertical layout
if(dataGroup && dataGroup.layout && dataGroup.layout is
VerticalLayout)
{
var layout:VerticalLayout = dataGroup.layout as VerticalLayout;
layout.horizontalAlign = HorizontalAlign.CONTENT_JUSTIFY;
}
}
}
}
with CSS:
s|List
{
skinClass: ClassReference("skins.MyListSkin");
horizontalScrollPolicy: off;
}
See:
http://stackoverflow.com/questions/10490117/flex-mobile-list-flickers/14714690
for more info
--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators
For more information on JIRA, see: http://www.atlassian.com/software/jira
