This topic provides a description of the Flash assets that are included with this SDK. All assets are defined in the
qnx.ui.skins.SkinAssets class.
The following components are described in detail:
The CellRendererSkinBlack skin uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The background skin for a cell in up state, in the dark color theme. | Up | SkinAssets.CellRendererUpBlack |
|
| The background skin for a cell in the up state, in the dark color theme, using alternating row colors. | Up (alternating row colors) | SkinAssets.CellRendererUpOddBlack |
|
| The background skin for a cell in the selected state, in the dark color theme. | Selected | SkinAssets.CellRendererSelected |
|
| The background skin for a cell in the down state, in the dark color theme. | Down | SkinAssets.CellRendererSelected |
|
| The background skin for a cell in the disabled state, in the dark color theme. | Disabled | SkinAssets.CellRendererDisabledBlack |
|
The CellRendererSkinWhite skin uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The background skin for a cell in the up state in the light color theme. | Up | SkinAssets.CellRendererUpWhite |
|
| The background skin for a cell in the up state, in the light color theme, using alternating row colors. | Up (alternating row colors) | SkinAssets.CellRendererUpOddWhite |
|
| The background skin for a cell in the selected state, in the light color theme. | Selected | SkinAssets.CellRendererSelected |
|
| The background skin for a cell in the down state, in the light color theme. | Down | SkinAssets.CellRendererSelected |
|
| The background skin for a cell in the disabled state, in the light color theme. | Disabled | SkinAssets.CellRendererDisabledWhite |
|
The TextInputSkin class uses the following assets:
| Description | Asset | Image |
|---|---|---|
| The background skin for a text input field with focus in the light theme. | SkinAssets.TextInputUpWhite |
|
| The background skin for a text input field in the key up state in the light theme. | SkinAssets.TextInputUpWhite |
|
| The background skin for a text input field in the key down state in the light theme. | SkinAssets.TextInputPressedWhite |
|
| The background skin for a text input field with focus in the dark theme. | SkinAssets.TextInputUpBlack |
|
| The background skin for a text input field in the key up state in the dark theme. | SkinAssets.TextInputUpBlack |
|
| The background skin for a text input field in the key down state in the dark theme. | SkinAssets.TextInputPressedBlack |
|
The RoundedButtonSkinBlack class uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The background skin for a rounded button in the up state, in the dark color theme. | Up | SkinAssets.RoundedButtonUpBlack |
|
| The background skin for a rounded button in the selected state, in the dark color theme. | Selected | SkinAssets.RoundedButtonSelectedBlack |
|
| The background skin for a rounded button in the down state, in the dark color theme. | Down | SkinAssets.RoundedButtonSelected |
|
| The background skin for a rounded button in the disabled state, in the dark color theme. | Disabled | SkinAssets.RoundedButtonDisabledBlack |
|
The RoundedButtonSkinWhite class uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The background skin for a rounded button in the up state, in the light color theme. | Up | SkinAssets.RoundedButtonUpWhite |
|
| The background skin for a rounded button in the selected state, in the light color theme. | Selected | SkinAssets.RoundedButtonSelected |
|
| The background skin for a rounded button, in the disabled state, in the light color theme. | Disabled | SkinAssets.RoundedButtonDisabledWhite |
|
| The background skin for a rounded button, in the down state, in the light color theme. | Down | SkinAssets.RoundedButtonSelected |
|
The CheckBoxSkinBlack skin uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The background skin for a check box in the up state, in the dark color theme. | Up | SkinAssets.CheckBoxRoundedSkinBlack |
|
| The background skin for a check box, in the selected state, in the dark color theme. | Selected | SkinAssets.CheckBoxRoundedSkinPressedWhite |
|
| The background skin for a check box, in the down state, in the dark color theme. | Down | SkinAssets.CheckBoxDownSelected |
|
| The background skin for a check box, in the disabled state, for the dark color theme. | Disabled | SkinAssets.CheckBoxDisabledBlack |
|
| The background skin for a disabled check box, in the selected state, in the dark color theme. | Disabled and Selected | SkinAssets.CheckBoxRoundedSkinDisabledBlack |
|
The CheckBoxSkinWhite skin uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The background skin for a check box, in the up state, in the light color theme. | Up | SkinAssets.CheckBoxRoundedSkinWhite |
|
| The background skin for a check box, in the selected state, in the light color theme. | Selected | SkinAssets.CheckBoxRoundedSkinPressedWhite |
|
| The background skin for a check box, in the down state, in the light color theme. | Down | SkinAssets.CheckBoxRoundedSkinPressedWhite |
|
| The background skin for a check box, in the disabled state, in the light color theme. | Disabled | SkinAssets.CheckBoxRoundedSkinDisabledWhite |
|
| The background skin for a check box in the disabled, selected state, in the light color theme. | Disabled and Selected | SkinAssets.CheckBoxRoundedSkinDisabledWhite |
|
| Description | State | Asset | Image |
|---|---|---|---|
| The background skin for a round radio button, in the unselected state, in the dark color theme. | Up | SkinAssets.RadioButtonSkinBlack |
|
| The background skin for a round radio button, in the unselected state, in the white color theme. | Up | SkinAssets.RadioButtonSkinWhite |
|
| The background skin for a round radio button, in the selected state, in the dark color theme. | Down | SkinAssets.RadioButtonPressedBlack |
|
| The background skin for a round radio button, in the selected state, in the white color theme. | Down | SkinAssets.RadioButtonSkinPressedWhite |
|
| The background skin for a round radio button, in the disabled state, in the dark color theme. | Disabled | SkinAssets.RadioButtonSkinDisabledBlack |
|
| The background skin for a round radio button, in the disabled state, in the white color theme. | Disabled | SkinAssets.RadioButtonSkinDisabledWhite |
|
A toggleswitch has three skinnable elements: the track, fill and thumb( button ) elements. Currently, there is no dark color theme for the toggle switch component.
The ToggleSwitchTrackSkinWhite class uses the following assets:
| Description | Asset | Image |
|---|---|---|
| The skin for the toggleswitch track in the light color theme in the off and enabled position. | SkinAssets.ToggleSwitchTrackOffWhite |
|
| The skin for the toggleswitch track in the light color theme in the off and disabled position. | SkinAssets.ToggleSwitchTrackOffDisabledWhite |
|
| The skin for the toggleswitch track in the light color theme in the on position. | SkinAssets.ToggleSwitchTrackOnWhite |
|
| The skin for the toggleswitch track in the dark color theme in the off and enabled position. | SkinAssets.ToggleSwitchTrackOffBlack |
|
| The skin for the toggleswitch track in the dark color theme in the off and disabled position. | SkinAssets.ToggleSwitchTrackOffDisabledBlack |
|
| The skin for the toggleswitch track in the dark color theme in the on position. | SkinAssets.ToggleSwitchTrackOnBlack |
|
| The skin for the toggleswitch track in the light color theme in the on and disabled position. | SkinAssets.ToggleSwitchTrackOnDisabledWhite |
|
The ToggleSwitchFillSkin class uses the following assets:
| Description | Asset | Image |
|---|---|---|
| The skin for the toggleswitch fill in the light color theme in the on state. | SkinAssets.ToggleSwitchTrackOnWhite |
|
| The skin for the toggleswitch fill in the light color theme in the disabled state. | SkinAssets.ToggleSwitchTrackOnDisabledWhite |
|
| The skin for the toggleswitch fill in the dark color theme in the on state. | SkinAssets.ToggleSwitchTrackOnBlack |
|
| The skin for the toggleswitch fill in the dark color theme in the disabled state. | SkinAssets.ToggleSwitchTrackOnDisabledBlack |
|
The ToggleSwitchThumbSkinBlack class uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The background skin for a rounded button, in the up state for the on position, in the dark color theme. | Up On | SkinAssets.ToggleSwitchButtonOnUpBlack |
|
| The background skin for a rounded button, in the down state for the on position, in the dark color theme. | Down On | SkinAssets.ToggleSwitchButtonOnPressedBlack |
|
| The background skin for a rounded button, in the disabled state for the on position, in the dark color theme. | Disabled On | SkinAssets.ToggleSwitchButtonOnDisabledBlack |
|
| The background skin for a rounded button, in the up state for the off position, in the dark color theme. | Up Off | SkinAssets.ToggleSwitchButtonOffUpBlack |
|
| The background skin for a toggle button, in the down state for the off position, in the dark color theme. | Down Off | SkinAssets.ToggleSwitchButtonOffPressedBlack |
|
| The background skin for a toggle button, in the disabled state for the off position, in the dark color theme. | Disabled Off | SkinAssets.ToggleSwitchButtonOffDisabledBlack |
|
The ToggleSwitchThumbSkinWhite class uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The background skin for a rounded button, in the up state for the on position, in the dark color theme. | Up On | SkinAssets.ToggleSwitchButtonOnUpWhite |
|
| The background skin for a rounded button, in the down state for the on position, in the dark color theme. | Down On | SkinAssets.ToggleSwitchButtonOnPressedWhite |
|
| The background skin for a rounded button, in the disabled state for the on position, in the dark color theme. | Disabled On | SkinAssets.ToggleSwitchButtonOnDisabledWhite |
|
| The background skin for a rounded button, in the up state for the off position, in the dark color theme. | Up Off | SkinAssets.ToggleSwitchButtonOffUpWhite |
|
| The background skin for a toggle button, in the down state for the off position, in the dark color theme. | Down Off | SkinAssets.ToggleSwitchButtonOffPressedWhite |
|
| The background skin for a toggle button, in the disabled state for the off position, in the dark color theme. | Disabled Off | SkinAssets.ToggleSwitchButtonOffDisabledBlack |
|
The dropdown is comprised of three skinnable elements - the drop down button, the dropdown list background and the cell renderer skin for the drop down list item.
The DropDownButtonSkinBlack class uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The button skin for the drop down, in the up state, in the dark color theme. | Up | SkinAssets.DropDownButtonUpBlack |
|
| The button skin for the drop down, in the down state, in the dark color theme. | Down | SkinAssets.DropDownButtonDownBlack |
|
| The button skin for the drop down, in the selected state, in the dark color theme. | Selected | SkinAssets.DropDownButtonPressedBlack |
|
| The button skin for the drop down, in the disabled state, in the dark color theme. | Disabled | SkinAssets.DropDownButtonDisabledBlack |
|
The DropDownButtonSkinWhite class uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The button skin for the drop down, in the up state, in the light color theme. | Up | SkinAssets.DropDownButtonUpWhite |
|
| The button skin for the drop down, in the down state, in the light color theme. | Down | SkinAssets.DropDownButtonDownWhite |
|
| The button skin for the drop down, in the selected state, in the light color theme. | Selected | SkinAssets.DropDownButtonPressedWhite |
|
| The button skin for the drop down, in the disabled state, in the light color theme. | Disabled | SkinAssets.DropDownButtonDisabledWhite |
|
The DropDownBackgroundSkinBlack class uses the following assets:
| Description | State | Image |
|---|---|---|
| The image used for the background of the drop down list, in the dark color theme. | SkinAssets.DropDownBgrBlack |
|
The DropDownBackgroundSkinWhite class uses the following assets:
| Description | Asset | Image |
|---|---|---|
| The image used for the background of the drop down list, in the light color theme. | SkinAssets.DropDownBgrWhite |
|
The CellRendererSkinBlack class uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The background skin for a cell, in the up state, in the dark color theme. | Up | SkinAssets.CellRendererUpBlack |
|
| The background skin for a cell, in the up state, in the dark color theme, with alternating row colors. | Up (alternating row colors) | SkinAssets.CellRendererUpOddBlack |
|
| The background skin for a cell, in the selected state, in the dark color theme. | Selected | SkinAssets.CellRendererSelected |
|
| The background skin for a cell, in the down state, in the dark color theme. | Down | SkinAssets.CellRendererSelected |
|
| The background skin for a cell, in the disabled state, in the dark color theme. | Disabled | SkinAssets.CellRendererDisabledBlack |
|
The CellRendererSkinWhite class uses the following assets:
| Description | State | Asset | Image |
|---|---|---|---|
| The background skin for a cell, in the up state, in the light color theme. | Up | SkinAssets.CellRendererUpWhite |
|
| The background skin for a cell, in the up state, in the light color theme, with alternating row colors. | Up (alternating row colors) | SkinAssets.CellRendererUpOddWhite |
|
| The background skin for a cell, in the selected state, in the light color theme. | Selected | SkinAssets.CellRendererSelected |
|
| The background skin for a cell, in the down state, in the light color theme. | Down | SkinAssets.CellRendererSelected |
|
| The background skin for a cell, in the disabled state, in the light color theme. | Disabled | SkinAssets.CellRendererDisabledWhite |
|
A slider is comprised of three skins, each with their own assets: track, fill and thumb. The track, fill, and thumb components look the same for both color schemes.
The SliderTrackSkin class uses the following assets:
| Description | Asset | Image |
|---|---|---|
| The background skin for the slider track in the light theme. | SkinAssets.SliderTrackWhite |
|
| The background skin for the slider track in the dark theme. | SkinAssets.SliderTrackBlack |
|
The SliderTrackSkin class uses the following assets:
| Description | Asset | Image |
|---|---|---|
| The background skin for the slider track filler (disabled state) in the light theme. | SkinAssets.SliderTrackFillDisabledWhite |
|
| The background skin for the slider track filler (disabled state) in the dark theme. | SkinAssets.SliderTrackFillDisabledBlack |
|
| The background skin for the slider track filler (up state) in the light theme. | SkinAssets.SliderTrackFillUpWhite |
|
| The background skin for the slider track filler (up state) in the dark theme. | SkinAssets.SliderTrackFillUpBlack |
|
The SliderThumbSkinBlack class uses the following assets:
| Description | Asset | Image |
|---|---|---|
| The image used for the slider thumb (disabled) in the light theme. | SkinAssets.SliderThumbDisabledWhite |
|
| The image used for slider thumb (up state) in the light theme. | SkinAssets.SliderThumbUpWhite |
|
| The image used for slider thumb (down state) in the light theme. | SkinAssets.SliderThumbPressedWhite |
|
| The image used for the slider thumb (disabled) in the dark theme. | SkinAssets.SliderThumbDisabledBlack |
|
| The image used for slider thumb (up state) in the dark theme. | SkinAssets.SliderThumbUpBlack |
|
| The image used for slider thumb (down state) in the dark theme. | SkinAssets.SliderThumbPressedBlack |
|
The Picker class uses the following assets:
| Description | Asset | Image |
|---|---|---|
| The black skin for the picker list background in the light theme. | SkinAssets.PickerListBgWhite |
|
| The black skin for the picker list background in the dark theme. | SkinAssets.PickerListBgBlack |
|
| The white skin for the picker selection glow. | SkinAssets.PickerSelectionWhite |
|
| The black skin for the picker selection glow. | SkinAssets.PickerSelectionBlack |
|
| The white skin for the picker background button in the up state. | SkinAssets.PickerButtonUpWhite |
|
| The white skin for the picker background button in the down state. | SkinAssets.PickerButtonPressedWhite |
|
| The light skin for the picker background button in the disabled state. | SkinAssets.PickerButtonDisabledWhite |
|
| The dark skin for the picker background button in the up state. | SkinAssets.PickerButtonUpBlack |
|
| The dark skin for the picker background button in the down state. | SkinAssets.PickerButtonPressedBlack |
|
| The dark skin for the picker background button in the disabled state. | SkinAssets.PickerButtonDisabledBlack |
|