Using DragPanelExtender to Drag and Drop Silverlight Control
Using DragPanelExtender to Drag and Drop Silverlight Control
In previous post ASP.NET AJAX DragPanelExtender I was displaying how to use ASP.NET AJAX DragPanelExtender Control to drag and drop content in your ASP.NET web pages.
In order to drag and drop a Silverlight Control you need to:
The html content of your web page should contain something like:
<body style="height:100%;margin:0;">
<form id="form1" runat="server" style="height:100%;">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<cc1:DragPanelExtender ID="DragPanelExtender1" runat="server" TargetControlID="PanelContainer" DragHandleID="PanelHeader">
</cc1:DragPanelExtender>
<asp:Panel ID="PanelContainer" runat="server" style="width: 200px;" BorderStyle="Double">
<asp:Panel ID="PanelHeader" runat="server" style="width: 100%; height: 21px;">
<div style="text-align: center">Panel Header...</div>
</asp:Panel>
<asp:Panel ID="PanelBody" runat="server" style="width: 200px; height: 100px; background-color: yellow">
<div style="height:100%;">
<asp:Silverlight ID="Xaml1" runat="server" Source="~/ClientBin/SilverlightApplication1.xap" Version="2.0" Width="100%" Height="100%" />
</div>
</asp:Panel>
</asp:Panel>
</form>
</body>
Then, you can drag your Silverlight Control.
You can download the source code here.