如何在Flex中创建无标题的可拖动面板？

Question

我想拖动没有标题的面板，当我拖动它的任何部分。我已经知道如何从面板中删除标题，并知道如何将其拖放到标题栏。但我不知道如何拖拽没有标题..请帮助。

Answer 1

这里是my example

//应用

<?xml version="1.0" encoding="utf-8"?> 
<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" 
      minWidth="955" minHeight="600" creationComplete="init(event)"> 
<fx:Script> 
    <![CDATA[ 
     import com.dragpanel.MyPanel; 

     import mx.events.FlexEvent; 

     protected function init(event:FlexEvent):void 
     { 
      var panel:MyPanel = new MyPanel(); 
      panel.width = 300; 
      panel.height = 200; 
      panel.title = "Hello"; 

      this.addElement(panel); 
     } 

    ]]> 
</fx:Script> 

</s:Application> 

//MyPanel.mxml

<?xml version="1.0" encoding="utf-8"?> 
<s:Panel 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="150" height="80" title="Hello" 
    mouseDown="onMouseDown(event)" mouseUp="onMouseUp(event)" 
    skinClass="com.dragpanel.PanelNoTitleBar"> 

<fx:Script> 
    <![CDATA[ 
     protected function onMouseDown(event:MouseEvent):void 
     { 
      this.startDrag(); 
     } 

     protected function onMouseUp(event:MouseEvent):void 
     { 
      this.stopDrag(); 
     } 

    ]]> 
</fx:Script> 

<s:HGroup verticalAlign="bottom" x="10" y="10"> 
    <s:Label text="Name:"/> 
    <s:TextInput width="60"/> 
</s:HGroup> 
</s:Panel> 

Answer 2

你如何使用标题栏开始拖动？你在面板的标题栏部分有一个mouseDown监听器吗？您可以将mouseDown侦听器移动到面板本身。