動態儀表板界面

我想在Silverlight中創建類似於以下的界面。 http://demos6.dundas.com/Silverlight/動態儀表板界面

我需要創建一個儀表板，其中可以使用Silverlight重新排列不同的元素。儀表板元素可以是不同的用戶控件，這些用戶控件又可以包含圖表，規則，網格......用戶應該能夠動態添加和刪除儀表板元素。用戶還應該能夠使用拖放來重新定位儀表板元素。

如果有一些代碼示例讓我開始使用，那將會非常棒，因爲我們剛開始使用某些Silverlight開發。

感謝， PRATIK

來源

2010-03-12 Pratik Kothari

已經在Blacklight Controls Library看看"Drag Dock Panel"。這對於構建儀表板很好。還有一個關於如何使用它的教程here ...

來源

2010-03-13 17:17:48 Sorskoot

你也可以試試Visifire也可以。您可以使用Visifire的圖表和量表並實現拖放行爲。以下代碼將幫助您在應用程序中構建拖放行爲。您可以在Silverlight或WPF應用程序中將此行爲附加到Visifire圖表或量表。

您可以從我的SkyDrive下載源代碼（DragElementsInCanvasBehaviour.zip）。

https://skydrive.live.com/?cid=61995e3895be1728&sc=documents&uc=1&id=61995E3895BE1728!106#

[ 「Hello World」的拖放行爲分類]

using System; 
using System.Net; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Documents; 
using System.Windows.Ink; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Animation; 
using System.Windows.Shapes; 
using System.Windows.Interactivity; 

namespace DragInCanvasBehaviour 
{ 
    public class DragInCanvasBehaviour : Behavior<UIElement> 
    { 
     protected override void OnAttached() 
     { 
      base.OnAttached(); 
      this.AssociatedObject.MouseLeftButtonDown += AssociatedObject_MouseLeftButtonDown; 
      this.AssociatedObject.MouseMove += AssociatedObject_MouseMove; 
      this.AssociatedObject.MouseLeftButtonUp += AssociatedObject_MouseLeftButtonUp; 
     } 

     protected override void OnDetaching() 
     { 
      base.OnDetaching(); 
      this.AssociatedObject.MouseLeftButtonDown -= AssociatedObject_MouseLeftButtonDown; 
      this.AssociatedObject.MouseMove -= AssociatedObject_MouseMove; 
      this.AssociatedObject.MouseLeftButtonUp -= AssociatedObject_MouseLeftButtonUp; 
     } 

     private Canvas canvas; 
     private bool IsDragging = false; 
     private Point mouseOffset; 

     private void AssociatedObject_MouseLeftButtonDown(object sender, MouseButtonEventArgs e) 
     { 
      if (canvas == null) 
       canvas = (Canvas)VisualTreeHelper.GetParent(this.AssociatedObject); 
      IsDragging = true; 
      mouseOffset = e.GetPosition(AssociatedObject); 
      AssociatedObject.CaptureMouse(); 
     } 

     private void AssociatedObject_MouseMove(object sender, MouseEventArgs e) 
     { 

      if (IsDragging) 
      { 
       FrameworkElement element = AssociatedObject as FrameworkElement; 
       FrameworkElement parent = element.Parent as FrameworkElement; 

       Point point = e.GetPosition(parent); 
       AssociatedObject.SetValue(Canvas.TopProperty, point.Y - element.Height /2); 
       AssociatedObject.SetValue(Canvas.LeftProperty, point.X - element.Width/2); 
      } 
     } 

     private void AssociatedObject_MouseLeftButtonUp(object sender, MouseButtonEventArgs e) 
     { 
      if (IsDragging) 
      { 
       AssociatedObject.ReleaseMouseCapture(); 
       IsDragging = false; 
      } 
     } 

    } 
}

希望這有助於！

來源

2011-09-08 07:24:32 Somnath

動態儀表板界面

回答

相關問題