Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Adobe AIR Development

Reply
Contributor
Posts: 12
Registered: ‎03-25-2011
My Device: 9800
My Carrier: Unknown

Custom List Design - Adobe Flex

 

Hi
Been struggling with a Person Search application in Adobe Flex for the **Blackberry Playbook** over the last few days. Basically I have the following:
Main App with MXML Interface at Bottom
 private var persons:ArrayCollection = new ArrayCollection();
    
    public function init():void{
  var p1:PersonSummary = new PersonSummary("Joe Smith", "9/9/1987", "img1.jpg");
  var p2:PersonSummary = new PersonSummary("Ben Smith", "9/5/1987", "img2.jpg");
       var p3:PersonSummary = new PersonSummary("John Doe", "9/9/1967", "img3.jpg");
       persons.add(p1); 
       persons.add(p2);
       persons.add(p3);
    }
PersonSummary

    class PersonSummary{
    
       private var name:String;
       private var dob:String;
       private var image:String;
       public function PersonSummary(n:String,d:String,i:String){
              this.name = n;
              this.dob = d;
              this.image = i;
       }
    ...
    }
The interface I'm looking for:
look2.jpg
What is the MXML? Ill forever be in the debt of anyone that can solve this problem for me!
Thanks
Phil

 

Developer
Posts: 133
Registered: ‎12-02-2010
My Device: Z10 & Dev Alpha C
My Carrier: T

Re: Custom List Design - Adobe Flex

<s:List id="listName" dataProvider="{persons}" useVirtualLayout="true"  width="100%" height="100%"  itemRenderer="personsItemrender" />

 

 

that would go into your main view... now create a new mxml file called "personsItemrender.mxml" and add the following code below...

 

 

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2010/01/27/creating-a-fancy-spark-list-control-item-renderer-in-flex-4/ -->
<s:ItemRenderer name="CustomListItemRenderer"
                xmlns:fx="http://ns.adobe.com/mxml/2009"
                xmlns:s="library://ns.adobe.com/flex/spark">

    <s:states>
        <sSmiley Frustratedtate name="normal" />
        <sSmiley Frustratedtate name="selected" />
    </s:states>
    <s:Group width="100%">
            
            
<s:HGroup height="100%">
            
        
            <s:VGroup height="100%">
                <s:Image source="{data.image}" />
                <s:Label text="{data.name}" />
                <s:Label text="{data.dob}"             
            </s:VGroup>    
                    
            <s:Line height="100%">
                <s:stroke>
                    <sSmiley FrustratedolidColorStroke color="#4f4f4f" weight="1"/>
                </s:stroke>
            </s:Line>
 </s:HGroup>
   
</s:ItemRenderer>

 

 

 

-----------------------------------------

let me know if u need more help.. I did not test that out.. but it should work

---------------------------------------------------------------------
Developer of Stocks for Blackberry 10