在metro风格的应用程序中完整的油漆(绘图)应用程序

时间:2012-06-26 13:23:41

标签: c# xaml drawing windows-8 microsoft-metro

我正在为windows 8开发类似应用程序的涂料。我试过但我甚至无法开发出一种线条绘制工具。我的应用程序将有免费的手工工具,线,矩形,椭圆,圆绘图工具,橡皮擦,将画布内容保存为JPG。我正在使用画布工具进行绘图。我在各种“指针”事件中感到困惑。我在WPF中检查了一些类似涂料的样品,但是我无法完全移植这些应用程序。

所以请指导我一些编码,请提供我的工作代码。

这里我附上了线条图的示例代码。但是在那条线上不断被绘制,因为没有检查是否按下了鼠标左键。

<!-- XAML CODE -->
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
        <StackPanel Orientation="Horizontal" Margin="0,-700,0,0" Grid.Row="0">
            <Button x:Name="btnLine" Click="btnLine_Click" Height="50" Width="auto" Content="Line" Grid.Row="0"/>
            <Button x:Name="btnElipse" Click="btnElipse_Click" Height="50" Width="auto" Content="Elipse" Grid.Row="0"/>
            <Button x:Name="btnPencil" Click="btnPencil_Click" Height="50" Width="auto" Content="Pencil" Grid.Row="0"/>
        </StackPanel>
    <Canvas Name="canvas" Background="AntiqueWhite" Margin="0,65,0,0"/>

/* C# Code*/

void canvas_PointerEntered(object sender, PointerRoutedEventArgs e)
    {
        switch (DrawingTool)
        {
            case "Line":
                {
                    clickPoint = e.GetCurrentPoint(canvas).Position;
                    newLine = new Line();
                    newLine.Fill = new SolidColorBrush(Windows.UI.Colors.Black);
                    newLine.StrokeLineJoin = PenLineJoin.Bevel;
                    newLine.X1 = clickPoint.X;
                    newLine.Y1 = clickPoint.Y;
                    newLine.X2 = clickPoint.X + 10;
                    newLine.Y2 = clickPoint.Y + 10;
                    newLine.StrokeThickness = 2;
                    canvas.Children.Add(newLine);
                    int zindex = canvas.Children.Count;
                    Canvas.SetZIndex(newLine, zindex);
                }
                break;

            case "Pencil":
                {
                    startPoint = e.GetCurrentPoint(canvas).Position;
                    line = new Polyline();
                    line.Stroke = new SolidColorBrush(Windows.UI.Colors.Black);
                    line.StrokeThickness = 2.0;
                    canvas.Children.Add(line);
                }
                break;

            case "Ellipse":
                {
                    newEllipse = new Ellipse();
                    newEllipse.StrokeThickness = 2;
                    newEllipse.Stroke = new SolidColorBrush(Windows.UI.Colors.Black);
                    newEllipse.StrokeLineJoin = PenLineJoin.Bevel;
                    newEllipse.Width = clickPoint.X;
                    newEllipse.Height = clickPoint.Y;
                    canvas.Children.Add(newEllipse);
                }
                break;

            default:
                break;
        }
    }

    void canvas_PointerMoved(object sender, PointerRoutedEventArgs e)
    {
        switch (DrawingTool)
        {
            case "Pencil":
                {
                    if (true)
                    {
                        Point currentPoint = e.GetCurrentPoint(canvas).Position;
                        if (startPoint != currentPoint)
                        {
                            line.Points.Add(currentPoint);
                        }
                    }
                }
                break;

            case "Line":
                {
                    drawPoint = e.GetCurrentPoint(canvas).Position; ;
                    if (newLine != null)
                    {
                        newLine.X2 = drawPoint.X;
                        newLine.Y2 = drawPoint.Y;
                    }
                }
                break;

            default:
                break;
        }
    }

    void canvas_PointerReleased(object sender, PointerRoutedEventArgs e)
    {
        newLine = null;
    }

    string DrawingTool;
    Line newLine;
    Ellipse newEllipse;
    Point clickPoint;
    Point drawPoint;
    Point startPoint;
    Polyline line;

    /// <summary>
    /// Invoked when this page is about to be displayed in a Frame.
    /// </summary>
    /// <param name="e">Event data that describes how this page was reached.  The Parameter
    /// property is typically used to configure the page.</param>
    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
    }

    private void btnPencil_Click(object sender, RoutedEventArgs e)
    {
        DrawingTool = "Pencil";
    }

    private void btnLine_Click(object sender, RoutedEventArgs e)
    {
        DrawingTool = "Line";
    }

    private void btnElipse_Click(object sender, RoutedEventArgs e)
    {
        DrawingTool = "Ellipse";
    }

3 个答案:

答案 0 :(得分:3)

我现在成功开发了基本的地铁式涂料应用程序。欢迎提出建议。您可以下载源表单codeproject

答案 1 :(得分:1)

在画布中订阅mousedown和mouseup事件,并在鼠标位置绘制一个像素,在你收到mousedown之后,你会收到鼠标。

答案 2 :(得分:1)

canvas.PointerMoved += _canvas_PointerMoved;
canvas.PointerPressed += _canvas_PointerPressed;
canvas.PointerReleased += _canvas_PointerReleased;

处理指针输入所需的事件是