Question

好吧，简单的项目渲染，或者我认为......我有一些数据加载到列表中，其中一个字段是project_Type。这是一个字符串，或者说“住宅”或“商业”。基于该字符串，我只想显示一个小房子，或者一个小办公楼作为图标。所以，我把我的项目拼凑在一起如下：

    <?xml version="1.0" encoding="utf-8"?>
<s:IconItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                    xmlns:s="library://ns.adobe.com/flex/spark" 
                    labelField="dateAdded" 
                    messageField="builder_Name" 
                    iconFunction="myiconfunction"
                    iconWidth="48" iconHeight="48"
                    decorator="@Embed('assets/Right-48x48.png')" >

    <fx:Script>
        <![CDATA[

    //  iconFunction="myiconfunction"
    //  iconWidth="32" iconHeight="32" -->

            private function myiconfunction(data:Object):String{

                var type:String; 

                var projectType:String = (data != null) ? data.project_Type : "QUESTION";

                if (projectType == "RESIDENTIAL") { 
                    type = "assets/House-48x48.png";
                } 
                else if (projectType == "COMMERCIAL") { 
                    type = "assets/Commercial-48x48.png";
                } 

                else if (projectType == "QUESTION") {
                    type = "assets/Question-48x48.png";
                }

                return type;

            }  

        ]]>
    </fx:Script>

</s:IconItemRenderer>

所以，那里非常直接......但是知道自定义图标......但是没有错误。我做错了什么人？

的更新 的

所以，我将项目渲染器更改为以下内容，但仍然没有图标...我已经仔细检查了数据，并且RESIDENTIAL和COMMERCIAL都被传递了......

<?xml version="1.0" encoding="utf-8"?>
<s:IconItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                    xmlns:s="library://ns.adobe.com/flex/spark" 
                    labelField="dateAdded" 
                    messageField="builder_Name" 
                    iconFunction="myiconfunction"
                    iconWidth="48" iconHeight="48"
                    decorator="@Embed('assets/Right-48x48.png')" >

    <fx:Script>
        <![CDATA[

            [Embed(source="assets/House-48x48.png")]
            public var residentialClass:Class;

            [Embed(source="assets/Commercial-48x48.png")]
            public var commercialClass:Class;

            [Embed(source="assets/Question-48x48.png")]
            public var questionClass:Class;

            private function myiconfunction(data:Object):Object
            {

            var projectType:String = (data != null) ? data.project_Type : "QUESTION";

            if (projectType == "RESIDENTIAL") { 
                return residentialClass;
            } 
            else if (projectType == "COMMERCIAL") { 
                return commercialClass;
            } 

            return questionClass;

            }  

        ]]>
    </fx:Script>

</s:IconItemRenderer>

但唉，没什么......

Answer 1

你确定你的图标被调用了吗？您确定图标的路径是否正确？您确定图标资产是否已嵌入已编译的应用程序中？

我可能会返回一个类对象，而不是字符串值，而不是从函数返回对象的路径。半个伪代码，类似这样的东西，它将在渲染器中：

<fx:Script>
[Embed(source="assets/House-48x48.png")]
public resientialClass : Class;

[Embed(source="assets/Commercial-48x48.png")]
public commercialClass : Class;

[Embed(source="assets/Question-48x48.png")]
public questionClass : Class;

            private function myiconfunction(data:Object):Object

                var type:String; 

                var projectType:String = (data != null) ? data.project_Type : "QUESTION";

                if (projectType == "RESIDENTIAL") { 
                    return residentialClass;
                } 
                else if (projectType == "COMMERCIAL") { 
                    return commercialClass;
                } 

                    return questionClass;

            }  

</fx:Script>

以与原始代码相同的方式指定渲染器功能。

Answer 2

扩展IconItemRenderer类

package {
import spark.components.IconItemRenderer;   
 public class CustomIconListItemRenderer extends IconItemRenderer
{   
[Embed(source="assets/House-48x48.png")]
public resientialClass : Class;

[Embed(source="assets/Commercial-48x48.png")]
public commercialClass : Class;

[Embed(source="assets/Question-48x48.png")]
public questionClass : Class;

public function CustomIconListItemRenderer()
    {
        super();
        iconFunction      = iconFunc;
             }
 private function iconFunc(data:Object):Object

            var type:String; 

            var projectType:String = (data != null) ? data.project_Type : "QUESTION";

            if (projectType == "RESIDENTIAL") { 
                return residentialClass;
            } 
            else if (projectType == "COMMERCIAL") { 
                return commercialClass;
            } 

                return questionClass;

        }  
}
}

然后在您的列表中，您可以将其指定为itemRenderer =“renderers.CustomIconListItemRenderer”

Answer 3

这些Mod通常对我有用。

<?xml version="1.0" encoding="utf-8"?>
<s:IconItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                labelField="dateAdded" 
                messageField="builder_Name" 
                iconFunction="myiconfunction"
                iconWidth="48" iconHeight="48"
                decorator="@Embed('assets/Right-48x48.png')" >

<fx:Script>
    <![CDATA[


        private function myiconfunction(data:Object):String
        {
          var s:String = data.project_Type; //capture data for case match

          switch (s.toUpperCase()) {
                 case "RESIDENTIAL":
                      return 'assets/House-48x48.png';
                      break;
                 case "COMMERCIAL":
                      return 'assets/Commercial-48x48.png';
                      break;
                 default:
                      return 'assets/Question-48x48.png';
                      break;
            }
       }

    ]]>
</fx:Script>

</s:IconItemRenderer>

带有动态调用图标的Flex 4.5.1中的IconItemRender

3 个答案: