我一直在制作mxml itemRenderers,但是从我在adobe听到的内容来看,对于Flex Mobile项目,他们一直说“只用actionscript3制作你的项目渲染器,没有mxml”
所以...我有这个列表,我试图在动作脚本中重新制作itemRenderer,这是我能猜到的最佳方式。如果我做错了,有人可以告诉我吗?也许我应该在一个完全不同的文件中这样做..我不知道这是我第一次制作一个所有的动作脚本IR。
出现文本,但现在我的scollToBottom()函数现在不再有效了。我和我的mxml itemrenderer一起使用它并且工作正常。所以我想也许我在这里做错了...所以这是我的主要问题,我假设我在做itemrenderer时出了什么问题,这就是为什么滚动到底部的功能不再适用了。
//my scroll to bottom function that i run after i put something in the list. since its a chat, this way it auto scrolls down for the user to read the latest message.
protected function scrollToBottom():void {
// update the verticalScrollPosition to the end of the List
// virtual layout may require us to validate a few times
var delta:Number = 0;
var count:int = 0;
while (count++ < 10){
chat_list.validateNow();
delta = chat_list.layout.getVerticalScrollPositionDelta(NavigationUnit.END);
chat_list.layout.verticalScrollPosition += delta;
if (delta == 0)
break;
}
}
<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" width="100%" height="100%" autoDrawBackground="false" contentBackgroundAlpha=".3" creationComplete="itemrenderer1_creationCompleteHandler(event)">
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
@font-face {
src: url("assets/fonts/mpb.ttf");
fontFamily: "myFont";
embedAsCFF: true;
advancedAntiAliasing: true;
}
</fx:Style>
<fx:Script>
<![CDATA[
import mx.core.FlexGlobals;
import mx.core.UIComponent;
import mx.events.FlexEvent;
import spark.components.Label;
import spark.components.VGroup;
private var msgTxt:Label = new Label();
private var nameLabel:Label = new Label();
private var mainContainer:VGroup = new VGroup();
protected function itemrenderer1_creationCompleteHandler(event:FlexEvent):void
{
maxWidth=this.width;
mainContainer.paddingBottom=10;
mainContainer.paddingTop=10;
mainContainer.verticalAlign="bottom";
mainContainer.explicitWidth=this.width;
this.addElement(mainContainer);
msgTxt.setStyle("fontFamily","myFont");
msgTxt.setStyle("color","#000000");
msgTxt.setStyle("fontSize","35");
msgTxt.setStyle("paddingRight","15");
msgTxt.setStyle("paddingTop","10");
msgTxt.setStyle("paddingLeft","15");
msgTxt.explicitWidth=this.width;
mainContainer.addElement(msgTxt);
nameLabel.setStyle("fontFamily","myFont");
nameLabel.setStyle("color","#666666");
nameLabel.setStyle("paddingLeft","5");
nameLabel.setStyle("fontSize","24");
nameLabel.explicitWidth=this.width;
mainContainer.addElement(nameLabel);
}
override public function set data(value:Object):void {
super.data = value;
if (data == null)
return;
if(data.systemMsg)
{
}
if(data.name)
{
nameLabel.text=data.name;
if(data.name == "You: ")
{
nameLabel.setStyle("textAlign","right");
msgTxt.setStyle("textAlign","right");
nameLabel.setStyle("paddingRight","5");
}
else if(data.name == "Them: ")
{
nameLabel.setStyle("textAlign","left");
msgTxt.setStyle("textAlign","left");
}
else
{
nameLabel.setStyle("textAlign","left");
msgTxt.setStyle("textAlign","left");
}
}
if(data.icon)
{
}
if(data.msg)
{
msgTxt.text=data.msg;
}
}
]]>
</fx:Script>
</s:ItemRenderer>
答案 0 :(得分:1)
您缺少的是需要覆盖的一些函数调用,以便在工作流程的正确位置正确测量项目的大小和位置。以下是默认Flex模板中代码的复制/粘贴。
此外,从外观上看,您似乎试图将as3代码放入Flex ItemRenderer中,但这并不能帮助您提高性能。您将需要一个纯粹的AS3类来扩展Class,例如LabelItemRenderer
/**
* @private
*
* Override this setter to respond to data changes
*/
override public function set data(value:Object):void
{
super.data = value;
// the data has changed. push these changes down in to the
// subcomponents here
}
/**
* @private
*
* Override this method to create children for your item renderer
*/
override protected function createChildren():void
{
super.createChildren();
// create any additional children for your item renderer here
}
/**
* @private
*
* Override this method to change how the item renderer
* sizes itself. For performance reasons, do not call
* super.measure() unless you need to.
*/
override protected function measure():void
{
super.measure();
// measure all the subcomponents here and set measuredWidth, measuredHeight,
// measuredMinWidth, and measuredMinHeight
}
/**
* @private
*
* Override this method to change how the background is drawn for
* item renderer. For performance reasons, do not call
* super.drawBackground() if you do not need to.
*/
override protected function drawBackground(unscaledWidth:Number,
unscaledHeight:Number):void
{
super.drawBackground(unscaledWidth, unscaledHeight);
// do any drawing for the background of the item renderer here
}
/**
* @private
*
* Override this method to change how the background is drawn for this
* item renderer. For performance reasons, do not call
* super.layoutContents() if you do not need to.
*/
override protected function layoutContents(unscaledWidth:Number,
unscaledHeight:Number):void
{
super.layoutContents(unscaledWidth, unscaledHeight);
// layout all the subcomponents here
}