Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Adobe AIR Development

Reply
Contributor
Posts: 16
Registered: ‎02-20-2011
My Device: Not Specified

Skinning Mobile Application with Image

Hey everyone.  Thanks for looking in advance.  

 

I have been trying for hours to get a custom skin on the view of my mobile application and have had no luck.  When I run the application, the image I'm using completely covers the screen as well as all of the components that I have in the View.  

 

Here's part of Mobile App .mxml file just in case it helps at all:

 

 

<?xml version="1.0" encoding="utf-8"?>
<s:MobileApplication

 xmlns:fx="http://ns.adobe.com/mxml/2009"					    xmlns:s="library://ns.adobe.com/flex/spark"				 xmlns:mx="library://ns.adobe.com/flex/mx"
firstView="views.HomePage" skinClass="skins.appskin">

 

And here is my skin .mxml:  (It's very simple for now, I just want to get a basic version working.)

 

 

<?xml version="1.0" encoding="utf-8"?>
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" 
		xmlns:s="library://ns.adobe.com/flex/spark">
	<!-- host component -->
	<fx:Metadata>
		[HostComponent("spark.components.MobileApplication")]
	</fx:Metadata>
	
	<!-- states -->
	<s:states>
		<s:State name="disabled" />
		<s:State name="normal" />
	</s:states>
	
	<s:BitmapImage source="@Embed('Cereal.jpg')"
				   fillMode ="scale" left="0" right="0"  top="0" bottom="0"/>
	
		<s:ViewNavigator id="Navigator" left="0" right="0" top="0" bottom="0" minWidth="0" minHeight="0"/>
	
</s:Skin>

 

Any help is much appreciated.  Thanks!

 

 

 

 

 

Developer
Posts: 350
Registered: ‎01-21-2011
My Device: Curve 8900 (Personal) / Bold 9650 (Work)
My Carrier: Regional

Re: Skinning Mobile Application with Image

Have you tried removing the fillMode, left, right, top, bottom attributes to see if just having:

<s:BitmapImage source="@Embed('Cereal.jpg')"/>

will display properly under the other components for you? I have a BitmapImage used similarily, but without those attributes, and it displays under my components without issue. Though my image is a large image that fills the full background.

Contributor
Posts: 16
Registered: ‎02-20-2011
My Device: Not Specified

Re: Skinning Mobile Application with Image

Yeah, the image still overlaps all of my components.  Right now, I seem to (sort of ) have a workaround for it just by adding the components to the View after I add the image, but it seems a bit sketchy to do this..

Developer
Posts: 350
Registered: ‎01-21-2011
My Device: Curve 8900 (Personal) / Bold 9650 (Work)
My Carrier: Regional

Re: Skinning Mobile Application with Image

That is odd, are you using 4.0.1 or Burritto?

Contributor
Posts: 16
Registered: ‎02-20-2011
My Device: Not Specified

Re: Skinning Mobile Application with Image

Developer
Posts: 350
Registered: ‎01-21-2011
My Device: Curve 8900 (Personal) / Bold 9650 (Work)
My Carrier: Regional

Re: Skinning Mobile Application with Image

[ Edited ]

I'm fairly new to Flex in general, but I've never used Burrito so I can't even honestly comment on the Burrito. However, the reading I've done suggests the only way to have it show properly is to do what you did, place it before the other components.

 

It does seem messy, and unreliable.