In all UIComponent-based components, you can use "styleManager" (small 's')
instead of "StyleManager" (big 'S')
In other places, you should try to get a moduleFactory to use. If you want
to use the top-level SystemManager, just ignore the warning or use
FlexGlobals.topLevelApplication to get a UIComponent
I'll look into that. Meanwhile, in a related problem I can't get an image to appear using Flex 4 when it did appear in Flex 3.
Using CSS I originally had this:
This didn't work in Flex 4 so I changed it to this:
(both as 'background-image' and the above)
The directory structure is:
I tried background-image: "FSCalc/images/DHSLogo.gif"
(and without the FSCalc, with FSCalc/src, with src/...)
In researching it one person said to use skins, but first I want to get the css to work correctly. I've never used skins so I don't want two new things at one time.
Are you getting errors or warnings?
Nope, no errors or warning. Just for the heck of it I did put in wrong stuff just to make sure errors would appear, and they did.
Here is the (incorrect) mxml:
(The style name is bgImage and the above didn't generate any error.)
I just changed the back ground color and it did reflect in the component so it must be "seeing" the CSS.
Here are further tests of the css:
/* background-image: "/src/images/BannerBackground.jpg"; */
/* background-image: "src/images/BannerBackground.jpg"; */
/* background-image: "images/BannerBackground.jpg"; */
/* background-image: "/images/BannerBackground.jpg"; */
/* background-image: "../images/BannerBackground.jpg"; */
/* background-image: "../BannerBackground.jpg"; */
/* background-image: "FSCalc/images/BannerBackground.jpg"; */
/* background-image: url(images/BannerBackground.jpg); */
/* background-image: url("images/BannerBackground.jpg"); */
/* background-image: url("/images/BannerBackground.jpg"); */
/* background-image: url("../images/BannerBackground.jpg"); */
/* background-image: Embed("images/BannerBackground.jpg"); */
/* background-image: Embed("../images/BannerBackground.jpg"); */
None of these actually (in Flex 4) add a background image. I've found many of the stylings that were in the application have disappeared with Flex 4. Do you think it would be better to stick with Flex 3?
Depending on which theme you are using, the background/border class may not
support a backgroundImage.
In Flex 4, more visual things are controlled by custom skinning.
I'm using whatever default theme is out there. I've not specified anything.
Is there a list of controls that CSS won't work with anymore in the new version of Flex?
In Flex 3 it took me two lines of CSS to have a background image. I can't figure out how to do it in Flex 4 using skins, but the default skin file (panel) is about 300 lines long with three overrides and other methods. Oddly enough, I don't find that easier than the original two lines.
I'm reading the Adobe writeup on skins (http://help.adobe.com/en_US/Flex/4.0/UsingSDK/WSC8DB0C28-F7A6-48ff-9899-7957415A0A49.html) and hope you can suggest something else I can read. I'm 90% done with it, but don't see how to do much.
The default changed in Flex 4. You should be getting compile time warning.
Your app should look quite different from Flex 3. You can specify the halo
theme to go back to a set of skins that support more styles.
How do I use Halo and will that get me back the ability to use css?
I guess the substitution for css is skins. There is no skin for canvas so I guess I'll have to change the object. I looked at Panel, but while that has a background property, it contains no items in it according to the lang ref. There is a link to rect, but that only has corner stuff and doesn't list any css or whatever replaces css with Flex 4.
I don't find it an advantage to give up css (two lines to get a background image) over a skin with over 300 lines, several override methods, several other methods, and still no way that I can find to use css. I read the prior link to Adobe's skins write up and it didn't help with specifics. I'm also reading Adobe Flex 4 by Labriola, Tapper and Boles and hope it includes some specifics. So far they only mention button skins so that hasn't helped at all.
While I understand you are not responsible, it has taken a week with no solution in sight to do something that was so easy before. I'm trying to make a case at work to stick with Flex and the current version, but I'm getting cut off at the knees on this.
-theme=Halo.swc (You may have to put it in the lib-path or specify the path
to the swc. It is in the themes folder in the SDK folders).
It sounds like you are one of the lucky developers for whom all visual
changes that they wanted were represented by styles. We heard from many
more folks that they wanted more styles to control more things. One of the
problems with that is each style represents a question that has to be asked
and answered before drawing the skin which is a performance drag, and the
other was that not having styles for everything limited the expressiveness
desired by many of our customers, and made it difficult for designers to
simply draw out what they wanted.
Custom skinning is definitely a different workflow if you haven't used it in
the past, but it is pretty simple: find an existing skin file, copy it, give
it a new name, modify its content, specify it as the skinClass and you're
done. And the advantage of this workflow is that you don't have to know
what or how styles will impact the skin visuals, and it works the same way
for all components. I'm sure you've discovered that not all components
support all styles.
There is a "skin" for Canvas. It is specified as the borderSkin. The
default SparkSkins theme does support styles, so I don't always copy those
files, sometimes I start from the wireframe or other sample themes.
Thanks, Alex, I appreciate the feedback.
I tried using Border and borderSkin as well as Panel and a panelSkin. In both cases I could use CSS to change the background color, but not add an image.
If I change the theme to halo, will CSS work again as it did in Flex 3?
I tried to find a language reference for Flex 4, but coudldn't. Could you point me to it?
Thanks for the link. When I tried to google it that wasn't one of the first three pages.
So if I return to Halo I can get a backgroundImage, but I can't otherwise. I was hoping to talk management into going with Flex 4, but I guess I'd better not bring it up. We do have it (and LiveCycle) for another project, but I was going to push for a more universal usage.
I guess it's time to draw a line under it and move on. Thanks for your time.
The differences between Flex 3 and Flex 4 are significant. I would do new
projects on Flex 4 and leave significant Flex 3 projects on Flex 3 for now
unless you need something Flex 4 provides.
That said, keep in mind that Flex 3 will become less and less of a priority
for Adobe and the amount of knowledge and support available for it will wane
over time, so I would think about upgrading someday. It might be that if an
app won't need upgrades and new features it can just stay on Flex 3
"forever". I was very happy using Outlook 2000 for email at home and only
an upgrade to a new computer and Win7 forced me to move.