I really can only answer a small part of your question but;
There are really two types of state implementations in Spark.
1. Custom component implementation of getCurrentSkinState()
2. <s:states> tag implementation in MXML
One allows you to create components that can notify there skins that their state has change and the skin then has he ability to update it's ui.
Two allows you to add view states in your application or skin implementation. This one actually is where your create transitions, effects and anything else that has to do with changing the user interface.
If you defined;
in you Application's tag, you could call currentState = "hidden" and it could hide a Panel or something. The key to this working is since you have defined states on the Application, you need to tie them to copisite components IE the Panel kie;
The above will set the visible property of the Panel to false when the currentState of the Application changes to "hidden".
And the difference with SkinnableComponents is they set the currentState automatically for their skins using the getCurrentSkinState() call triggered by a invalidateSkinState() call in the component's heirarchy.
Thanks, that was helpful
I found an article with more info on the getCurrentSkinState() call triggered by a invalidateSkinState() part which now makes this part very clear to me and the rest you said I understand too.
I have a few more questions but before asking about all of them I need to run some tests first so I will stop on a thing I tested for now. So here it is:
We have the main application and its skin. In the skin we add a button to click and a second button to test with. We set the second button an ID of "testBtnId" and make the button on click to removeElement(testBtnId); It works perfectly.
But what if I want to do the same thing on an element that is located in the main app. I found 2 ways:
1) Lets take the same test button there and the code line on the button click handler should look like this:
But this won't work since we have the testBtnId in the skin undefined. If I set a name to the button of "testBtnName" and then try this:
The only way I could target and then remove the element was like this:
testBtnId:Button = Button(this.hostComponent.contentGroup.getChildByName("testBtnName"));
With the getElementAt method I have to explicitly define the index at which the button is and that could change... so I don't find it that good...
2) define a variable in the main application for the button like this:
public var testBtnId:spark.components.Button;
This way istead of getChildByName() you can select the instance of that button directly and remove it
So the question I have on this part is are these the only 2 ways of accessing a component defined in the main application/higher level component ?
Also I kind of got confused is the button component a child or an element. Since I find it as a child but I can't remove it as a child and I need to remove it as an element... Can anyone explain me what's this about and what are the differences between element and child... when I use one when the other, are they connected or are the same thing... I really don't understand much... so anything would be good to hear from you guys
Looking forward to see this fog dispersed
As far as children verses elements;
Flex 4 introduced a new API for element access so they could use graphical elements and UIComponents together in the same display list. The original UIComponent implementation used the DisplayObjectContainer's child list API IE getChildByName().
The Flex 4 Spark IVisualElementContainer API introduced a way to manage IVisualElement instances. This API uses getElementByName(). Anytime you work with a component/container/skin in the spark.* namespaces, you will use the element API.
The above will correctly access the button instance named "myButton".
Check out the API docs for GroupBase and SkinnableContainer.
Hi Mike, thanks again for the reply, but I can't find what you say:
I also have the docs downloaded and when I search for getElementByName I find nothing... Also in Flash builder 4 I see only getElementIndex and getElementAt functions and That's it. So where did u find that API?
My fault, I keep forgetting that is the one method of the IChildList they didn't pass over. Sorry for the confusion.
It's a shame they didn't include that since Spark relies so heavily on id's in the skin.
Yeah it's really strange they didn't add methods that return all children/elements or as you said getElementByName...
I have another question. As I read the docs watched videos and so on, I've seen that for skin parts and states u declare them in the component and then you declare them in the skin. Ok but I've tested not adding the states I've set to the skin on the component and It still works just fine. So I don't get what's the point decalring them in the component.. is there anywhere I will need that to do something else ?
Same applies for the skin parts, If I can get it by digging (this.skin.getChildByName("elementName")), is declaring the skin part just like making a shortcut to that element or there's something more ?
Declaring a SkinState meta tag in the component's class allows the compiler to give you an error when you are creating a skin and setting it's HostComponent if the states do not exist in the skin's MXML <s:states> code.
It also allows ASDoc to document the skin states in your documentation. I think another one is when you create a skin based off of a HostComponent (in the New -> Skin option), Flash Builder will automatically add the states MXML declaration for you.
The SkinPart is important for Spark components. Declaring a SkinPart meta data on the component allows you to require parts, thus if one is omited on the skin, the compiler will complain. SkinnableComponent also will set a reference on itself when the skin is created and added. This means you already get a ref to the skin part on your component that's public without digging into the skin reference.
And finally, in your component you get partAdded() and partRemoved() notifications when you override these methods.
So overall, the meta tags are important if you are trying to build a decent component.
The call is not recursive, it would only search the first level of the skin's display list. What if you had elementName in a Group? You would have to id the group as well. This is the purpose of SkinPart.
Thanks a lot Mike, your explanations were very helpful and I am very grateful