extending UIComponent issue

[bmilesp]

I have extended the UIComponent as the following code shows:


package org.fleksray.cardlayout {

import mx.core.UIComponent;

public class CardComponent extends UIComponent{

private var _side:String;

public function CardComponent(){
super();
}

public function set side(value:String):void{
_side = value;
}

public function get side():String{
return _side;
}

}

}



in the same package, i'm just assigning variables in a method as follows:


for(var i:Number=0;i<dataProvider.length;i++){
var card:CardComponent = (dataProvider.getItemAt(i) as CardComponent);
card.side = "left";
card.x = this.x + (offset_x * i);
card.y = this.y + (offset_y * i);
card.z = z_depth;
card.rotationY = l_rotationY;
card.addEventListener(MouseEvent.CLICK, centerCard);
this.addChild(card);
}


when i run it in flex builder 3 i get the following error at card.side = "left" (or card.x = 10, it doesn't matter if it's a super property or my extended property):

1009: Cannot access a property or method of a null object reference


and for the past hour i cannot figure out what i'm overlooking. Any help will be greatly appreciated! -b

[rawmantick]

I wish you check in debug mode what is the value of your var card:CardComponent variable. I bet it's null. Why? I don't know. Probably some problem with your dataProvider. I usualy use dataProvider[i] instead of your way... Maybe that's the reason. All the rest looks like it's ok...

[bmilesp]

Thanks for the reply, i tried your suggestion and it doesn't work. yes, the value of card:CardComponent is null.

One other note i should add is that if i change the type from CardComponent to UIComponent, everything works fine. the value of card:UIComponent is correct.

So then the question is, how do i extend the UIComponent simply to add a custom property?

[Peter Cowling]

Hi,

You asked: So then the question is, how do i extend the UIComponent simply to add a custom property?

The variable _side is a custom property, and you have getter and setter methods for it. However, it is not public, nor does it have an inspectable metadata tag (for code hinting).

[bmilesp]

i've tried your suggestion to make the side var public- no luck. I might be missing something when extending a class. Ok this is troubling, i'm missing something that should be obvious i think.

I've reduced th CardComponent code to this:

package org.fleksray.cardlayout {

import mx.core.UIComponent;

public class CardComponent extends UIComponent{

public function CardComponent(){
super();
}

}

}

and in my other class, i should be able to call it like this:

var card:CardComponent = (dataProvider[i] as CardComponent);

and it will work exactally the same as calling this:

var card:UIComponent = (dataProvider[i] as UIComponent);

correct?

Because when i change the code in my app, the UIComponent works as expected, but the CardComponent throws the error?

[Peter Cowling]

Sorry, but I am lost here.

The comment re. properties was generic; to be honest I did not appreciate you still had a specific problem.

In your first post you say: "I have extended the UIComponent as the following code shows:" and then "in the same package, i'm just assigning variables in a method as follows:"

In your latest post you say: "and in my other class, i should be able to call it like this:"

So I am trying to work out one class or two?

[bmilesp]

Sorry for the confusion. I'm accessing the CardComponent class from within another class. i guess i'm trying to narrow the problem down. Here's my troubleshooting order:

1) I access the UIComponent from within a class. Everything works as expected.

2) I want additional properties on the UIComponent, so i create another class, CardComponent, that extends the UIComponent (see CardComponent code below)

3) Yet when i access the CardComponent, the app throws the error (even if i only extend the UIComponent without additional properties as i posted below)

4) when i change the CardComponent back to the UIComponent, it works as expected again.

This leads me to believe that i'm extending the class incorrectly, and/or i'm overlooking something very obvious to a more experienced user? Thanks for all your help.

[Peter Cowling]

EDIT - after thinking though the problem again:

Can I check, is the background to your situation like this:



<someComponent dataprovider="{dataCollection}" itemrenderer="com.CardComponent" />

[rawmantick]

Code in the first post looks ok. Probably you have UIComponents in your dataProvider instead of CardComponents?

Just try to remember, object can be interpreted as instance of some class (as an interface), if and only if it is an instance of that class (is an instance of the class implementing that interface).

So... Instance of CardComponent is an instance of UICompinent at the same time (according to your class hierarchy). But the instance of UIComponent generally is not an instance of CardComponent.

So if you can cast it to UIComponent - it is an instance of UIComponent. If you cannot cast to CardComponent, it is not instance of CardComponent.

So I think you should check what type your dataProvider element is exactly of.

[bmilesp]

Peter:

the background is like this (in a separate class file):


for(var i:Number=0;i<dataProvider.length;i++){
var card:UIComponent = (dataProvider[i] as UIComponent);
card.x = this.x + (offset_x * i);
card.y = this.y + (offset_y * i);
card.z = z_depth;
card.rotationY = l_rotationY;
card.addEventListener(MouseEvent.CLICK, centerCard);
this.addChild(card);
card.side = "left";
}



i think i will just instantiate the CardComponents here and use XML as the dataprovider. That way i won't have to worry about casting. Thank for your help and i'll let you know the outcome, which i believe will work this time!