I suspect I can guess the answer but looking for the definitive
resolution on a 9-Slice question.
I have an image that is 960(x) by 113(y) and I want it to dynamically
stretch across the screen as a header/title banner but keep the same
height.
Say for example my screen is 1200 wide. I would like the image to
stretch to 1200 x 113. I have divided the image up using 9-Slice as:
[Embed(
source="images/header.png",
scaleGridTop="70", scaleGridBottom="86",
scaleGridLeft="199", scaleGridRight="900"
)]
[Bindable]
public var FancyBorderImage:Class;
For the sake of an example, I am using the following to display the
image:
<mx:Panel x="0" y="0" width="100%" height="600" layout="absolute">
<mx:Image source="{FancyBorderImage}" x="0" y="0" height="113" />
<mx:Image source="{FancyBorderImage}" x="0" y="200" width="100%"
height="113" />
<mx:Image source="{FancyBorderImage}" x="0" y="400" width="1200"
height="200" />
</mx:Panel>
Here is the issue - the image will not scale horizontally with the
original height of 113.
It only scales horizontally beyond the original 960 width in the 3rd
case when I increase the height.
I was hoping the 2nd example would be the working one under 9-slice.
Ideas?
Geoff.