How to maximize a Callout, so that it takes the maximal available space at the screen?
I'm trying to display a ViewNavigator in a Callout and while it works, the displayed View
is too narrow:
In the same program I have another Callout
and it is wide enough:
The only 2 differences between them is that the latter is attached to a CalloutButton and the latter holds a custom Score
component for which I set:
override protected function measure():void {
super.measure();
measuredWidth = Capabilities.screenResolutionX;
measuredHeight = Capabilities.screenResolutionY;
}
I keep staring at the Callout.as code, but can't find a way to trick it to occupy most available space yet.
My custom mxml component is quite simple:
PlayerInfo.mxml:
<?xml version="1.0" encoding="utf-8"?>
<s:Callout
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
contentBackgroundAppearance="none">
<fx:Script>
<![CDATA[
[Bindable]
public var userid:String;
]]>
</fx:Script>
<s:ViewNavigator
firstView="views.Profile"
firstViewData="{userid}">
<s:navigationContent>
<s:Button label="Close" click="close()" />
</s:navigationContent>
</s:ViewNavigator>
</s:Callout>
Callout extends Container, so you shouldn't have problems setting the width and height to 100%.
Also, in the Callout code there's a method:
/**
* @private
* Force a new measurement when callout should use it's screen-constrained
* max size.
*/
private function invalidateMaxSize():void
{
// calloutMaxWidth and calloutMaxHeight don't invalidate
// explicitMaxWidth or explicitMaxHeight. If callout's max size changes
// and explicit max sizes aren't set, then invalidate size here so that
// callout's max size is applied.
if (!canSkipMeasurement() && !isMaxSizeSet)
skin.invalidateSize();
}
So, try to set the 'explicitMaxWidth' and 'explicitMaxHeight' properties.