• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

Problem with icon in list when using a xml-file

New Here ,
Jun 24, 2011 Jun 24, 2011

Copy link to clipboard

Copied

Hi all,

I'm trying to build an app using the EmployeeDirectory sample (http://www.adobe.com/devnet/flex/articles/employee-directory-android-flex.html#articlecontentAdobe_n...) as a starting point, which I have modified accordingly.

I've got pretty much everything running the way I want it, except for two things:

I want to display an icon in the list. When testing the app I get an empty space where the icon should be, but no icon is shown...

The second thing is that I would like to have the lableField and the messageField in different styles, but I don't know how to achive that...

As you probably can tell I'm very new at this, and this my first atempt ever to use Flash Builder...

Below is the code I've used in the HomeView...

If anyone could help me figure out how to fix this I would be eternally grateful!

Best Regards from Camilla in Sweden

<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark" title="Emergency Lift Telephones"
        backgroundColor="#000000"
        creationComplete="srv.send()">
    <fx:Script>
        <![CDATA[
            import flashx.textLayout.elements.ListItemElement;
        ]]>
    </fx:Script>
   
    <fx:Declarations>
        <s:HTTPService id="srv" url="assets/employees.xml"/>
    </fx:Declarations>

    <s:navigationContent/>
   
    <fx:Style>
        @namespace s "library://ns.adobe.com/flex/spark";
        .lista {
            color: #FFFFFF;
        }
        .soklista {
            color: #FFFFFF;
            content-background-color: #000000;
            alternatingItemColors: #000000;
            color: #FFFFFF;
            fontSize: 16;
            font-weight: bold;
        }
        .soklista-title {
            color: #FFFFFF;
            content-background-color: #000000;
            alternatingItemColors: #000000;
            color: #FFFFFF;
            fontSize: 16;
        }
       
       
    </fx:Style>
    <s:List id="list" left="0" right="0" top="0" bottom="0"
            change="navigator.pushView(ProductDetails, list.selectedItem)"
            dataProvider="{srv.lastResult.list.employee}" labelField="firstName"
            styleName="soklista">
        <s:itemRenderer>
            <fx:Component>
                <s:IconItemRenderer iconWidth="32" iconHeight="32" iconScaleMode="letterbox" iconField="assets/pics/{data.menybild}"
                                    messageField="title"
                                    messageStyleName="soklista-title">
                </s:IconItemRenderer>
            </fx:Component>
        </s:itemRenderer>

    </s:List>
</s:View>

Views

608

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 25, 2011 Jun 25, 2011

Copy link to clipboard

Copied

Doesn't anyone have any suggestions?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 25, 2011 Jun 25, 2011

Copy link to clipboard

Copied

Okay, so I managed to get the icon working by using this code instead:

    <s:List id="list" left="0" right="0" top="0" bottom="0"
            change="navigator.pushView(ProductDetails, list.selectedItem)"
            dataProvider="{srv.lastResult.list.employee}" styleName="soklista">
        <s:itemRenderer>
            <fx:Component>
                <s:IconItemRenderer paddingTop="2" paddingBottom="2" verticalGap="6"
                                    decorator="assets/icons/{data.icon}"
                                    labelField="firstName" messageField="title"
                                    messageStyleName="soklista"
                                    iconHeight="32" iconWidth="32"/>
            </fx:Component>
        </s:itemRenderer>

    </s:List>

Any suggestions on how to make lableField and the messageField in different styles?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 25, 2011 Jun 25, 2011

Copy link to clipboard

Copied

LATEST

I'm apperently getting better at this, since I got it all working by changing the css class of the s:IconItemRenderer seperately from the s:List css...

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines