PopUpManager + TitleWindow + Form: helpContent is drawn outside the TitleWindow

I'm trying to add a settings popup to my Flex 4.5 application, but have the problem, that the Form help string is drawn outside the TitleWindow for some reason. Adding width="100%" height="100%" to the Form does not change anything:

Does anybody please have an idea how to handle this case?

Below is my very simple test code. If you paste it into a Flash Builder 4.5 project, you will see the problem instantly.

SettingsTest.mxml:

<s:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:mx="library://ns.adobe.com/flex/mx"
    xmlns:comps="*"
    width="700" height="525" >

    <fx:Script>
        <![CDATA[
            import mx.managers.PopUpManager;

            private function showSettings(event:MouseEvent):void {
                var _settings:Settings =
                    PopUpManager.createPopUp(this, Settings, true) as Settings;
                PopUpManager.centerPopUp(_settings);
            }           
        ]]>
    </fx:Script>

    <s:Button right="10" bottom="10" label="Settings" click="showSettings(event)" />

</s:Application>

Settings.mxml:

<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx"
    width="400" height="300"
    close="handleClose()"
    creationComplete="init(event)">

    <fx:Script>
        <![CDATA[
            import mx.events.FlexEvent;
            import mx.managers.PopUpManager;
            import flash.filters.ColorMatrixFilter;

            private var _settings:SharedObject =
                SharedObject.getLocal('settings');

            public function init(event:FlexEvent):void {
                handleHide(null);
            }

            private function handleClose():void {
                PopUpManager.removePopUp(this);
            }

            private function handleHide(event:Event):void { 
                var hide:Number = _hide.value;
                _settings.data.hide = hide;
                _settings.flush();

                if (hide >= 0.8) {
                    filters = null;
                } else {
                    var matrix:Array = new Array();
                    matrix = matrix.concat([1, 0, 0, 0, 1]);    
                    matrix = matrix.concat([0, 1, 0, 0, 1]);    
      开发者_如何学Python              matrix = matrix.concat([0, 0, 1, 0, 1]);    
                    matrix = matrix.concat([0, 0, 0, hide, 1]); 

                    filters = [ new ColorMatrixFilter(matrix) ];
                }
            }
        ]]>
    </fx:Script>

    <s:Form width="100%" height="100%">
        <s:FormItem label="Invisible:">         
            <s:HSlider id="_hide" minimum="0.25" maximum="1.00" value="1.00" stepSize="0.25" change="handleHide(event)" />
            <s:helpContent>
                <s:Label text="Make the game less visible at the screen" />
            </s:helpContent>
        </s:FormItem>   
    </s:Form>
</s:TitleWindow>

---

This is not a Form problem, but a Label problem I believe. Try adding width="100%" to the label or specify an absolute width on it.