I've been working on updating the visuals of our application and one path I took was skinning components. There's a designer in our team that works well with Photoshop and Flash (but not with Flex or programming at all), so I sent him the link of Narciso Jamarillo's article on creating skins for Flex using Adobe Creative Suit.
Although we had few troubles working over the default template for HaloSkin at first, we kinda figured out most of them. But now there's one problem I couldn't find a solution yet. Whenever I apply the skins he made, the components that show text like TextInput and ComboBox start showing text in the wrong position, a little above the center and closer to the borders (sometimes it gives the impression it cuts out characters when I align the text at right).
Here's a picture:
Skinned on the left, not skinned on the right.
So I'd like to know what exactly has influences over text position when I create a skin in flash, or any hint on what is causing this behavior.
Thanks in advance.
it mostly happens due to change in scale 9 slicing configuration . if there is unequal distance between top and bottom gridLine or right and left gridLine so the difference originates in such case where the sliced portion on the left is taking more space then on right and same case for top and bottom.Altough when using custom Skin you will need to do minor tweaking from flash to make your text come in center.
I asked the designer to check in Flash and all grid lines are in proportional distance (4 pixels from edge). I also asked him to create a new skin from template, without any changes, and it displayed the same behavior, so I don't think it's a scale 9 slice configuration problem.
Could you elaborate what kind of "minor tweaking" I could do on Flash? I ask because we just changed the shapes and and the 9 slice scale grid, is there anything else you could setup for a skin?