Visual skinning for spark components

Hi. I am a newbie doing the flex in a week course. It is so easy to set up datagrids but they look awful. This is incredibly important for my company. Skins must look good BUT I just read the flash catalyst is discontinued. What software can I use now to skin my components. I would love to be able to achieve the folowing look you can see here: http://www.desire2learn.com/products/learning-environment/features/measure-guide/
Half way down you can see the type of datagrid I am looking for. Nothing fancy really.
Cheers in advance
edit: I just had an idea.
You can use any design software to lay out a mock up then just use the x and y properites and colours and shove them in you mxml file fot the skinning. voilá.
Is that a good workflow?
edit: Just read that people are using fireworks to design and to export to css.
Could somebody confirm this as a great workflow?
Thanks

Similar Messages

[svn:fx-trunk] 5170: Round 2 of bug fixes for the Spark skins for Halo components.

Revision: 5170
Author: [email protected]
Date: 2009-03-04 17:50:32 -0800 (Wed, 04 Mar 2009)
Log Message:
Round 2 of bug fixes for the Spark skins for Halo components. Thanks to Alex for help with the data grid issues.
Bugs fixed:
SDK-19655 - Setting rowCount property on DataGrid causes extra blank row to be displayed
SDK-19652 - Items in a DataGrid do not line up after scrolling.
SDK-19605 - disabled Halo ColorPicker with Gumbo skin draws too dark
SDK-19596 - When you have a single button on an Alert, the left edge looks flatter than the right
SDK-19585 - Menus compiled with the halo theme in Flex 4 have a different backgroundColor than in Flex 3
SDK-19665 - Halo List with Gumbo skin doesnt draw the alternating item color all the way to the right edge of the control if VScrollBar is present
SDK-19651 - odd header rendering issue on Halo DataGrid with Gumbo skin
QA Notes: The alert layout code was positioning the buttons/text on sub-pixel boundaries if the width or height of the alert was an odd number of pixels. We always snap to pixel boundaries now, but this may cause bitmap compare issues with Alert.
Ticket Links:
http://bugs.adobe.com/jira/browse/SDK-19655
http://bugs.adobe.com/jira/browse/SDK-19652
http://bugs.adobe.com/jira/browse/SDK-19605
http://bugs.adobe.com/jira/browse/SDK-19596
http://bugs.adobe.com/jira/browse/SDK-19585
http://bugs.adobe.com/jira/browse/SDK-19665
http://bugs.adobe.com/jira/browse/SDK-19651
Modified Paths:
flex/sdk/trunk/frameworks/projects/framework/src/mx/controls/DataGrid.as
flex/sdk/trunk/frameworks/projects/framework/src/mx/controls/alertClasses/AlertForm.as
flex/sdk/trunk/frameworks/projects/framework/src/mx/core/ScrollControlBase.as
flex/sdk/trunk/frameworks/projects/halo/defaults.css
flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/ColorPickerSkin.mxml

[svn:fx-trunk] 5152: First pass of bug fixes for the Spark skins for Halo components.

Revision: 5152
Author: [email protected]
Date: 2009-03-03 13:18:45 -0800 (Tue, 03 Mar 2009)
Log Message:
First pass of bug fixes for the Spark skins for Halo components.
Bugs:
SDK-19963 - themeColor should not affect rollOverColor or selectionColor in flex 4
SDK-19654 - Spark skin for the Halo ComboBox dropdown needs a drop shadow
SDK-19637 - Halo HScrollBar/VScrollBar controls dont render correctly when specifying includeIn states
SDK-19634 - Halo ProgressBar default size is very different when using Halo vs Gumbo theme
SDK-19626 - Flicker when toggling enabled property on Halo TabBar control with Gumbo skin
SDK-19556 - selected Halo CheckBox and RadioButton icons briefly flicker when you roll over them
SDK-19658 - Halo ComboBox with Gumbo skin has an odd flicker
Doc/QA Notes: The fix for SDK-19963 includes a compatibility-version check. When compatibility-version < 4, setting themeColor implicitly sets rollOverColor and selectionColor, if they have not been set. When compatibility-version >= 4, you must explicitly set rollOverColor and selectionColor, even when using the Halo theme.
Ticket Links:
http://bugs.adobe.com/jira/browse/SDK-19963
http://bugs.adobe.com/jira/browse/SDK-19654
http://bugs.adobe.com/jira/browse/SDK-19637
http://bugs.adobe.com/jira/browse/SDK-19634
http://bugs.adobe.com/jira/browse/SDK-19626
http://bugs.adobe.com/jira/browse/SDK-19556
http://bugs.adobe.com/jira/browse/SDK-19658
http://bugs.adobe.com/jira/browse/SDK-19963
Modified Paths:
flex/sdk/trunk/frameworks/projects/flex4/src/mx/components/FxApplication.as
flex/sdk/trunk/frameworks/projects/framework/defaults.css
flex/sdk/trunk/frameworks/projects/framework/src/mx/controls/Button.as
flex/sdk/trunk/frameworks/projects/framework/src/mx/controls/ComboBase.as
flex/sdk/trunk/frameworks/projects/framework/src/mx/core/Application.as
flex/sdk/trunk/frameworks/projects/framework/src/mx/core/UIComponent.as
flex/sdk/trunk/frameworks/projects/framework/src/mx/graphics/RectangularDropShadow.as
flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/BorderSkin.mxml
flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/ProgressBarTrackSkin.mxm l

Default skin for spark button class

Hi, where in the spark button class or superclasses does it specify its default skin?

Spark components like Button.as don't define thier default skins internally. If you want a skinnable component to have a default skin so that you don't have to manually specify the skin every time you have two options. The preferred method, and the one used in the flex sdk, is to use a css file to specify the skin for the component. If you don't want to do that, then the other option is to call setStyle("skinClass", YourSkinClass) inside the constructor of the actionscript component.

How to intercept style changes in skin for spark Button?

How to intercept style changes in skin for spark Button?
Thank you.

How to intercept style changes in skin for spark Button?
Thank you.

Skins for swing components

HI All!
Please tell me where I can get skins for swing components for free.

http://www.javootoo.com/

CSS reference chart for spark?

I'm running into many issues when trying to add CSS into my project due to the way spark skins now work with CSS. Is there a CSS reference chart I can use or spark? Also why did Adobe remove the CSS design view in flash builder 4?

Hi,
Can you elaborate on the issues you're having with CSS? The main change between Flex 3 and Flex 4 is 'CSS namespaces'. I don't know of a reference chart, per se,but I took the following from an article in Adobe Dev Center called 'Differences between Flex 3 and Flex 4 beta'.
Flex 4 beta has also added multiple namespace support in CSS. If you are using the MXML 2009, Spark, and Halo namespaces along with Type selectors, you will need to define a set of namespaces in your CSS definitions to avoid name collisions.
Here is an example of CSS that uses type selectors for both Halo and Spark components:
<fx:Style>
    @namespace s "library://ns.adobe.com/flex/spark";
    @namespace mx "library://ns.adobe.com/flex/halo";
    s|Button {
        color: #FF0000;
    mx|DateChooser {
        color: #FF0000;
</fx:Style>
The Halo and Spark skinning models are different enough that the existing CSS design view implementation (in Flex Builder 3) isn't the right solution for the task of skinning Spark components. The engineering team is currently investigating ideas to address this issue in FB4 for Spark components. (Btw, the CSS design mode is still available in Flash Builder 4, but only for Flex 3 SDK projects.)
thanks
Tim

How do I apply programmatic skins for completely custom drawn components of a Flex library project?

Hello folks,
I am looking for best practices advice when (1) creating
custom components and (2) styling and skinning.
I already know how to skin a component part of the Flex
framework. I can make a class extending ProgrammaticSkin and have
my component skinned using CSS to link the component with the
reference to my custom class.
However what about those cases when you are completely
creating a component from scratch?
Imagine a "Freehand Drawing Canvas" component that allows the
user to draw on it and has some buttons to set color styles, line
styles, etc., or imagine a "Screen Flow Gallery" component that
displays visual objects in a fashion similar to Cover Flow in the
Mac.
In many components I am aware you may reuse other components
part of the Flex framework but I am trying to picture an scenario
where you would need to draw everything yourself because there just
isn't something to base it upon so you will end up drawing it from
scratch.
To learn how instead of building one of those components I
mentioned previously I decided to start with something simple that
would illustrate this like a LiteButton component that will behave
just like the Flex mx.controls.Button but will extend UIComponent
and be completely custom drawn.
The component will have a default look and will also be
style-able and skin-able. I will provide styles for users of the
component to modify and regarding skinning anyone can create a
custom ProgrammaticSkin adding its own drawing logic and link it to
the component via CSS with the ClassReference applied to the skin
selector.
So far so good and it's clear what I want to achieve. I
actually know how to do most of the stuff here but I have one
single problem.
Here is my question, where should I put my custom drawing
logic? If I do it in the updateDisplayList inside the class
extending UIComponent it works, however I thought that it would be
a better practice to do it using programmatic skins, that way I
could provide different skin themes for my component set.
The problem is that I can't make the programmatic work in
this scenario. I tried instantiating the custom programmatic skin
during the updateDisplayList of the LiteButton component and adding
it to my display object via addChild but that didn't do anything. I
also tried creating a "default.css" stylesheet and tried to use
ClassReference as I would normally do to skin an already existing
component (or composite component as well) but that didn't do
anything either.
So how do I apply programmatic skins for completely custom
drawn components of my Flex library project?
I could do it inside the updateDisplayList of the LiteButton
class extending UIComponent but again I would like to provide
different theme sets for my components so it makes sense using
programmatic skins.

"jbucaran" <[email protected]> wrote in
message
news:[email protected]...
> Hello folks,
>
> I am looking for best practices advice when (1) creating
custom components
> and
> (2) styling and skinning.
>
> I already know how to skin a component part of the Flex
framework. I can
> make
> a class extending ProgrammaticSkin and have my component
skinned using CSS
> to
> link the component with the reference to my custom
class.
>
> However what about those cases when you are completely
creating a
> component
> from scratch?
>
> Imagine a "Freehand Drawing Canvas" component that
allows the user to draw
> on
> it and has some buttons to set color styles, line
styles, etc., or imagine
> a
> "Screen Flow Gallery" component that displays visual
objects in a fashion
> similar to Cover Flow in the Mac.
>
> In many components I am aware you may reuse other
components part of the
> Flex
> framework but I am trying to picture an scenario where
you would need to
> draw
> everything yourself because there just isn't something
to base it upon so
> you
> will end up drawing it from scratch.
This may help with that
http://livedocs.adobe.com/flex/3/html/help.html?content=skinstyle_3.html
> To learn how instead of building one of those components
I mentioned
> previously I decided to start with something simple that
would illustrate
> this
> like a LiteButton component that will behave just like
the Flex
> mx.controls.Button but will extend UIComponent and be
completely custom
> drawn.
>
> The component will have a default look and will also be
style-able and
> skin-able. I will provide styles for users of the
component to modify and
> regarding skinning anyone can create a custom
ProgrammaticSkin adding its
> own
> drawing logic and link it to the component via CSS with
the ClassReference
> applied to the skin selector.
>
> So far so good and it's clear what I want to achieve.
Actually after
> playing
> with the weekend and today I know how to do most of the
stuff but I have
> one
> single problem. So here is my question, where should I
provide my custom
> drawing logic? If I do it in the updateDisplayList
inside the class
> extending
> UIComponent it works, however I thought that it would be
a better practice
> to
> do it using programmatic skins, that way I could provide
different skin
> themes
> for my component set.
These aren't mutually exclusive. When you provide a skin with
a
TypeSelector, you have to add it to the display list
somewhere, and this is
typically done in updateDisplayList or addChildren. I prefer
to do it in
updateDisplayList, because you can then change it if the
style changes.
> The problem is that I can't make the programmatic work
in this scenario. I
> tried instantiating the custom programmatic skin during
the
> updateDisplayList
> of the LiteButton component and adding it to my display
object via
> addChild but
> that didn't do anything.
Exactly what did you do?
> I also tried creating a "default.css" stylesheet and
> tried to use ClassReference as I would normally do to
skin an already
> existing
> component (or composite component as well) but that
didn't do anything
> either.
I've never had any problem using an approach similar to
this...but I will
say that I couldn't see any advantage in creating a
default.css style sheet,
since it's not really default in the way that the one that
comes with Flex
is. It's much more obvious to anyone using your component
what's going on
there if you create a style sheet where they're likely to
spot it.
> So how do I apply programmatic skins with the default
look for custom
> drawn
> components?
It seems like your approach is fine, but maybe you've made a
mistake in your
implementation.
> I could do it inside the updateDisplayList of the
LiteButton class
> extending
> UIComponent but again I would like to provide different
theme sets for my
> components so it makes sense using programmatic skins.
You might want to consider also adding an instance of
HaloBorder to your
component. That brings a lot of functionality with it.
HTH;
Amy

[svn:fx-trunk] 5465: Now that padding set on a TextInput does not affect the inner textView, we need to add a custom TextInput skin for the TextInput a Spark NumericStepper contains .

Revision: 5465
Author: [email protected]
Date: 2009-03-20 11:52:56 -0700 (Fri, 20 Mar 2009)
Log Message:
Now that padding set on a TextInput does not affect the inner textView, we need to add a custom TextInput skin for the TextInput a Spark NumericStepper contains. Jim ok'ed the addition of the new FxNumericStepperTextInputSkin.mxml class into the spark.skins and wireframe packaged.
SDK-18275, SDK-19849
Reviewer: Glenn
Checkintests: Pass
Ticket Links:
http://bugs.adobe.com/jira/browse/SDK-18275
http://bugs.adobe.com/jira/browse/SDK-19849
Modified Paths:
flex/sdk/trunk/frameworks/projects/flex4/src/mx/components/FxNumericStepper.as
flex/sdk/trunk/frameworks/projects/flex4/src/mx/skins/spark/FxNumericStepperSkin.mxml
flex/sdk/trunk/frameworks/projects/wireframe/src/wireframe/FxNumericStepperSkin.mxml
Added Paths:
flex/sdk/trunk/frameworks/projects/flex4/src/mx/skins/spark/FxNumericStepperTextInputSkin .mxml
flex/sdk/trunk/frameworks/projects/wireframe/src/wireframe/FxNumericStepperTextInputSkin. mxml

Revision: 5465
Author: [email protected]
Date: 2009-03-20 11:52:56 -0700 (Fri, 20 Mar 2009)
Log Message:
Now that padding set on a TextInput does not affect the inner textView, we need to add a custom TextInput skin for the TextInput a Spark NumericStepper contains. Jim ok'ed the addition of the new FxNumericStepperTextInputSkin.mxml class into the spark.skins and wireframe packaged.
SDK-18275, SDK-19849
Reviewer: Glenn
Checkintests: Pass
Ticket Links:
http://bugs.adobe.com/jira/browse/SDK-18275
http://bugs.adobe.com/jira/browse/SDK-19849
Modified Paths:
flex/sdk/trunk/frameworks/projects/flex4/src/mx/components/FxNumericStepper.as
flex/sdk/trunk/frameworks/projects/flex4/src/mx/skins/spark/FxNumericStepperSkin.mxml
flex/sdk/trunk/frameworks/projects/wireframe/src/wireframe/FxNumericStepperSkin.mxml
Added Paths:
flex/sdk/trunk/frameworks/projects/flex4/src/mx/skins/spark/FxNumericStepperTextInputSkin .mxml
flex/sdk/trunk/frameworks/projects/wireframe/src/wireframe/FxNumericStepperTextInputSkin. mxml

[svn:fx-trunk] 10006: Initial checkin of the "More styles for Spark skins" feature.

Revision: 10006
Author:   [email protected]
Date:     2009-09-03 15:04:47 -0700 (Thu, 03 Sep 2009)
Log Message:
Initial checkin of the "More styles for Spark skins" feature. Details here:
http://opensource.adobe.com/wiki/display/flexsdk/MoreStylesforSparkSkins
There are some known issues:
Panel bottom corners not rounded correctly when the panel has a control bar
cornerRadius on Tab and DateChooser non functional
cornerRadius values > 4 have drawing artifacts in the "down" state of Button and button-like components
TextInput/TextArea incorrectly list lineBreak and verticalAlign as valid styles
This checkin also includes a couple minor unrelated bug fixes:
Remove MiniDebugTarget. This is a logging target that used MiniDebug, which hasn't worked since Flex 1.5
Fix RTEs when setting focusSkin to null
Optimization: don't measure skins if the host component has explicit sizes
QE notes: Yes, many baseline images will need to be regenerated
Doc notes: New ASDoc comments should be scrubbed
Bugs: SDK-22931, SDK-22798, SDK-22217, SDK-19358
Reviewer: Jason
Tests run: checkintests, cyclone
Is noteworthy for integration: Yes
Ticket Links:
    http://bugs.adobe.com/jira/browse/SDK-22931
    http://bugs.adobe.com/jira/browse/SDK-22798
    http://bugs.adobe.com/jira/browse/SDK-22217
    http://bugs.adobe.com/jira/browse/SDK-19358
Modified Paths:
    flex/sdk/trunk/frameworks/halo-manifest.xml
    flex/sdk/trunk/frameworks/mxml-manifest.xml
    flex/sdk/trunk/frameworks/projects/airframework/defaults.css
    flex/sdk/trunk/frameworks/projects/airframework/src/spark/components/Window.as
    flex/sdk/trunk/frameworks/projects/airframework/src/spark/components/WindowedApplication. as
    flex/sdk/trunk/frameworks/projects/airframework/src/spark/skins/spark/SparkChromeWindowed ApplicationSkin.mxml
    flex/sdk/trunk/frameworks/projects/airframework/src/spark/skins/spark/WindowedApplication Skin.mxml
    flex/sdk/trunk/frameworks/projects/framework/defaults.css
    flex/sdk/trunk/frameworks/projects/framework/src/mx/controls/ComboBase.as
    flex/sdk/trunk/frameworks/projects/framework/src/mx/controls/DateChooser.as
    flex/sdk/trunk/frameworks/projects/framework/src/mx/controls/NumericStepper.as
    flex/sdk/trunk/frameworks/projects/framework/src/mx/controls/TextInput.as
    flex/sdk/trunk/frameworks/projects/framework/src/mx/core/Container.as
    flex/sdk/trunk/frameworks/projects/framework/src/mx/core/IDeferredContentOwner.as
    flex/sdk/trunk/frameworks/projects/framework/src/mx/core/INavigatorContent.as
    flex/sdk/trunk/frameworks/projects/framework/src/mx/core/ScrollControlBase.as
    flex/sdk/trunk/frameworks/projects/framework/src/mx/core/UIComponent.as
    flex/sdk/trunk/frameworks/projects/framework/src/mx/styles/metadata/BorderStyles.as
    flex/sdk/trunk/frameworks/projects/spark/defaults.css
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/Application.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/DropDownList.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/List.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/NumericStepper.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/Panel.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/Scroller.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/SkinnableContainer.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/Spinner.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/supportClasses/ButtonBase.a s
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/supportClasses/GroupBase.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/supportClasses/Skin.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/supportClasses/SkinnableCom ponent.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/supportClasses/SkinnableTex tBase.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/components/supportClasses/Slider.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/primitives/RectangularDropShadow.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/SparkSkin.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/ApplicationSkin.mxml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/ButtonBarFirstButtonSkin.m xml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/ButtonBarLastButtonSkin.mx ml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/ButtonSkin.mxml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/DefaultButtonSkin.mxml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/DropDownListButtonSkin.mxm l
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/DropDownListSkin.mxml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/FocusSkin.as
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/ListSkin.mxml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/NumericStepperTextInputSki n.mxml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/PanelSkin.mxml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/SpinnerDecrementButtonSkin .mxml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/SpinnerIncrementButtonSkin .mxml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/TextAreaSkin.mxml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/TextInputSkin.mxml
    flex/sdk/trunk/frameworks/projects/spark/src/spark/skins/spark/ToggleButtonSkin.mxml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/BorderSkin.mxml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/ButtonBarFirstButtonSkin .mxml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/ButtonBarLastButtonSkin. mxml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/ButtonSkin.mxml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/ComboBoxSkin.mxml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/DefaultButtonSkin.mxml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/EditableComboBoxSkin.mxm l
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/PanelBorderSkin.mxml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/PopUpButtonSkin.mxml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/SparkSkinForHalo.as
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/StepperDecrButtonSkin.mx ml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/StepperIncrButtonSkin.mx ml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/TextInputBorderSkin.mxml
    flex/sdk/trunk/frameworks/projects/wireframe/src/spark/skins/wireframe/ApplicationSkin.mx ml
    flex/sdk/trunk/frameworks/tests/basicTests/BasicTests.css
    flex/sdk/trunk/frameworks/tests/basicTests/spark/scripts/BorderTestScript.mxml
Removed Paths:
    flex/sdk/trunk/frameworks/projects/framework/src/mx/logging/targets/MiniDebugTarget.as

Gordon, it looks like its been a while since you made this post. Not sure how valid it is now...   I am particularly interested in the LigatureLevel.NONE value. It seems that it is no longer supported.
How do I turn of ligatures in the font rendering?
My flex project involves trying to match the font rendering of Apache's Batik rendering of SVG and ligatures have been turned off in that codebase. Is there any way (even roundabout) to turn ligatures off in flash?
Thanks,
Om

[svn:fx-trunk] 13288: Changing the workaround for custom whitespace preservation in spark components in order to cater for fixes to SDK-24699 and SDK-24611 .

Revision: 13288
Revision: 13288
Author:   [email protected]
Date:     2010-01-05 15:21:57 -0800 (Tue, 05 Jan 2010)
Log Message:
Changing the workaround for custom whitespace preservation in spark components in order to cater for fixes to SDK-24699 and SDK-24611.
We now preserve whitespace for all of the spark "text" tags at compile time (but not only-whitespace content if an alternate text attribute was specified).
QE notes: Please ensure that whitespace preservation continues to work, including for the scenarios mentioned in previous issues SDK-22601, SDK-23160, SDK-23972.
Doc notes: N/A
Bugs:
SDK-24699 - Binding does not work with Spark TextInput "text" property
SDK-24611 - MXML compiler should preserve whitespace in FlowElement tags (such as
Reviewer: Paul
Tests run: checkintests, mustella RichText, List, TextArea (the 2 baseline position failures existed prior to these changes)
Is noteworthy for integration: Yes
Ticket Links:
    http://bugs.adobe.com/jira/browse/SDK-24699
    http://bugs.adobe.com/jira/browse/SDK-24611
    http://bugs.adobe.com/jira/browse/SDK-22601
    http://bugs.adobe.com/jira/browse/SDK-23160
    http://bugs.adobe.com/jira/browse/SDK-23972
    http://bugs.adobe.com/jira/browse/SDK-24699
    http://bugs.adobe.com/jira/browse/SDK-24611
Modified Paths:
    flex/sdk/trunk/modules/compiler/src/java/flex2/compiler/mxml/dom/MxmlScanner.java
    flex/sdk/trunk/modules/compiler/src/java/flex2/compiler/mxml/dom/Node.java
    flex/sdk/trunk/modules/compiler/src/java/flex2/compiler/mxml/lang/StandardDefs.java

This bug figures out also when creating a custom spark ComboBox, then trying to programatically update the userProposedSelectedIndex property. The proposed selected index is selected, but does not apply the same skin as when mouse is on rollover or item is selected due to up and down keys.
The issue seems like updating the status of the item renderer to rollover or selected to get the same skin applied.
Please could you attach DropDow nList.as that you edited ?
Thank you so much.

How to use swf file for Spark Skin

Hi all
I have little confuse about how to use swf file with Spark Skin,
in Flex3 , i use Flex Skin Design Extension for Flash to deal with skin ,
so basically , I just create a swf file and import to the project , then everything is ok
but , seem that not working in flex4 , spark skin.
1` I can't find the Flex Skin Design for the FlashCs4
2` I try to use FlashCs3 version to import the skin art to the project , but seemed not working.
3` I Google and check the Flex4 Help , seemed Spak skin need the Skin-Class , which I don't know how to use that with swf file
what I have searched is how to use FXG , or some jpg file in that skin class, none of them are use swf file.
so , is there any way that let user use the swf file to deal with the skin?
is the Flex Skin Design can use in Flex4?
Thanks

Hello,
I'm new to Flex, but have come to it from Flash Pro. I'd like to know the same thing. I think I found the answer here:
http://www.flashallys.com/blog/spark-button-skinning-with-flash-symbols/
However my question is now: Is this a good approach to use?
99% of the googling I've done tells me to skin components with fxg files. I've tried that by creating graphics and exporting from flash, but using swfs containing lots of graphics is much faster so I'd rather use that.
The other thing I've done is to create custom components using these helpful tutorials:
Creating component in flash:
http://www.webkitchen.be/2008/12/12/video-tutorial-make-flex-components-with-flash-cs4/
Dealing with Resizing with method overrides for your flash component:
http://www.psyked.co.uk/flex/creating-flex-components-the-easy-way-for-flash-ide-converts. htm
This allows me the flexibility of Flash Pro design with the layout, transistions, data binding etc from Flex.
So my question is: Is this approach (skinning spark components with swfs, and using custom swc components made in flash) a bad idea for any reason? E.g. does it create slow mobile apps?
Cheers
Chris

[svn:fx-trunk] 10024: Fix regressions from "More styles for Spark skins" checkin.

Revision: 10024
Author:   [email protected]
Date:     2009-09-04 10:13:32 -0700 (Fri, 04 Sep 2009)
Log Message:
Fix regressions from "More styles for Spark skins" checkin.
Remove redundant Group tag from BorderSkin
Support borderStyle="none" for TextInputBorderSkin
Made BorderSkin work correctly when borderStyle="none" and contentBackgroundColor is set
QE notes: This should clean up a bunch of mustella failures
Doc notes: None
Bugs: SDK-23004, SDK-23008, SDK-23011
Reviewer: Corey
Tests run: checkintests, basictests
Is noteworthy for integration: No
Ticket Links:
    http://bugs.adobe.com/jira/browse/SDK-23004
    http://bugs.adobe.com/jira/browse/SDK-23008
    http://bugs.adobe.com/jira/browse/SDK-23011
Modified Paths:
    flex/sdk/trunk/frameworks/projects/framework/src/mx/core/Container.as
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/BorderSkin.mxml
    flex/sdk/trunk/frameworks/projects/sparkskins/src/mx/skins/spark/TextInputBorderSkin.mxml

[svn:fx-trunk] 7204: Tweaks to appearance of Halo skins for WindowedApplication/ Window to match Spark appearance.

Revision: 7204
Author:   [email protected]
Date:     2009-05-21 16:30:20 -0700 (Thu, 21 May 2009)
Log Message:
Tweaks to appearance of Halo skins for WindowedApplication/Window to match Spark appearance.
Bug: SDK-19653
QA Notes: Baseline images of Halo WindowedApplication/Window need to be updated.
Doc Notes: none
Ticket Links:
    http://bugs.adobe.com/jira/browse/SDK-19653
Modified Paths:
    flex/sdk/trunk/frameworks/projects/airframework/defaults.css

I had downloaded it for test, and requested for evaluation license...
But I haven't got license, and also I am not able to find Flash Builder Plugins from HFCD site....
I think those plugins are removed from site....
Please help me, if anyone have those plugins...

[svn:fx-trunk] 8652: Set ControlBar borderStyle to "none" for Spark skins.

Revision: 8652
Author:   [email protected]
Date:     2009-07-16 17:16:28 -0700 (Thu, 16 Jul 2009)
Log Message:
Set ControlBar borderStyle to "none" for Spark skins.
QE notes: -
Doc notes: -
Bugs: SDK-21399
Reviewer: Jason
Tests run: checkintests, QE cyclone
Is noteworthy for integration: No
Ticket Links:
    http://bugs.adobe.com/jira/browse/SDK-21399
Modified Paths:
    flex/sdk/trunk/frameworks/projects/framework/defaults.css

Visual skinning for spark components

Similar Messages

Maybe you are looking for