以编程方式将UIElement以异步方式添加到View中

时间:2013-07-16 03:55:09

标签: c# mvvm windows-phone-8 uielement

现在几天我一直坚持同样的问题所以我最终提出要问社区。 我会尽量让它变得清晰。

我实际上是想在我的 MainPage 中以异步方式添加一些UIElement给我的Canvas定义。

据我了解,将UIElement添加到Canvas的基本方法是将其添加到UIElementCollection上,例如我应该这样做:

        Line line = new Line();

        // Line attributes
        line.Stroke = new SolidColorBrush(Colors.Purple);
        line.StrokeThickness = 15;
        Point point1 = new Point();
        point1.X = 0;
        point1.Y = 0;
        Point point2 = new Point();
        point2.X = 480;
        point2.Y = 720;
        line.X1 = point1.X;
        line.Y1 = point1.Y;
        line.X2 = point2.X;
        line.Y2 = point2.Y;
        // Line attributes

        MyCanvas.Children.Add(line);

让我们假设我有一个Class调用 Graphics ,需要访问此Canvas才能在其上绘图。

 public class Graphics
 {
     public void drawLine()
     {
            //Using Dispatcher in order to access the main UI thread
            Deployment.Current.Dispatcher.BeginInvoke(() =>
            {
               Line line = new Line();

               // Line attributes

               /**
                *  Here I want to acces the Canvas of the MainPage
                *  I have no Idea what to put here !!!
                *
                **/

            });
      }
  }

在“我不知道该放什么!!!”的地方我试图直接访问 MainPage Canvas - >失败

我尝试在 MainPage 中声明一个公共静态UIElementCollection,以便添加我的UIElement,然后将其传递给Canvas但不可能,因为UIElementCollection没有构造函数 - > FAIL

但这些想法似乎是肮脏的编码而不是非常优雅。因此,通过我的研究,我发现 MVVM 应该发挥魔力。但是我发现的所有教程都是通过xaml文件进行数据绑定,这在我的情况下无法使用。

所以我有两个问题:

首先:如何使用Canvas的UIElementCollection? (是否有一个隐藏的方法叫做谁绘制它,比如JAVA中的Paint或Repaint?)

第二:如果我想遵循MVVM模式,我可以将 MainPage 视为我的视图,将图形类视为我的ViewModel和 UIElement 作为我的模特?

我事先感谢你的帮助,如果某些部分不够明确,请随时告诉我。

1 个答案:

答案 0 :(得分:1)

这是一个非常基本的例子,但应该让你朝着正确的方向前进。

Graphics.cs

 public class Graphics
{
    public ObservableCollection<UIElement> UIElements { get; set; }
    int poisiton = 0;
    private Timer backgroundTimer;
    public Graphics()
    {
        this.UIElements = new ObservableCollection<UIElement>();
        this.backgroundTimer = new Timer(new TimerCallback((timer) => {
            Deployment.Current.Dispatcher.BeginInvoke(() => this.GenerateLine());
        }), null, 2000, 3000);
    }

    private void GenerateLine()
    {
        Line line = new Line();

        // Line attributes
        line.Stroke = new SolidColorBrush(Colors.Purple);
        line.StrokeThickness = 15;
        Point point1 = new Point();
        point1.X = this.poisiton;
        point1.Y = this.poisiton;
        Point point2 = new Point();
        point2.X = this.poisiton;
        point2.Y = this.poisiton + 30;
        line.X1 = point1.X;
        line.Y1 = point1.Y;
        line.X2 = point2.X;
        line.Y2 = point2.Y;
        // Line attributes

        this.poisiton += 10;
        UIElements.Add(line);
    }
}

MainPage.xaml.cs中

 public MainPage()
 {
      InitializeComponent();

      this.Loaded += MainPage_Loaded;
      // Sample code to localize the ApplicationBar
      //BuildLocalizedApplicationBar();
 }

  void MainPage_Loaded(object sender, RoutedEventArgs e)
  {
      var graphics = new Graphics();
      this.ContentPanel.DataContext = graphics;
  }

MainPage.xaml中

  <Canvas x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
      <ItemsControl ItemsSource="{Binding UIElements}">

      </ItemsControl>
  </Canvas>

我希望这会有所帮助。