c# 实例——绘制波浪线(附源码)

效果图

界面绘制操作

private Point? _startPoint = null;
  private void ContainerCanvas_OnPreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
  {
    var position = e.GetPosition(ContainerCanvas);
    if (_startPoint == null)
    {
      _startPoint = position;
    }
    else
    {
      //删除预览
      if (_previewLineElement != null)
      {
        ContainerCanvas.Children.Remove(_previewLineElement);
        _previewLineElement = null;
        _lastMovedPoint = null;
      }
      //确定结束点,绘制波浪线
      var myLineElement = new MyLineElement();
      myLineElement.DrawLine((Point)_startPoint, position);
      ContainerCanvas.Children.Add(myLineElement);
      _startPoint = null;
    }
  }

  private MyLineElement _previewLineElement = null;
  private Point? _lastMovedPoint = null;

  /// <summary>
  /// 波浪线绘制预览
  /// </summary>
  /// <param name="sender"></param>
  /// <param name="e"></param>
  private void ContainerCanvas_OnMouseMove(object sender, MouseEventArgs e)
  {
    var position = e.GetPosition(ContainerCanvas);
    if (_startPoint != null && (_lastMovedPoint == null || _lastMovedPoint != null & (position - (Point)_lastMovedPoint).Length >= 2))
    {
      _lastMovedPoint = position;
      if (_previewLineElement != null)
      {
        ContainerCanvas.Children.Remove(_previewLineElement);
      }
      var myLineElement = new MyLineElement();
      myLineElement.DrawLine((Point)_startPoint, position);
      ContainerCanvas.Children.Add(myLineElement);
      _previewLineElement = myLineElement;
    }
  }

波浪线控件及绘制

class MyLineElement : FrameworkElement
  {
    public MyLineElement()
    {
      _visualShape = new VisualCollection(this);
    }
    internal void DrawLine(Point startPoint, Point endPoint)
    {
      List<Point> points = ForgePoints(startPoint, endPoint);
      DrawLine(points);
    }
    private const int SeparatorPiexl = 4;
    private const int AbundancePiexl = 3;
    private List<Point> ForgePoints(Point startPoint, Point endPoint)
    {
      var points = new List<Point>();

      var lineVector = endPoint - startPoint;
      var lineDistance = lineVector.Length;
      var lineAngle = Math.Atan2(-(endPoint.Y - startPoint.Y), endPoint.X - startPoint.X);

      points.Add(startPoint);
      int index = 0;
      bool isAbundanceUpward = true;
      while (index * SeparatorPiexl < lineDistance)
      {
        index++;
        //计算出间隔长度(模拟点到起始点)
        var separatorDistance = index * SeparatorPiexl;
        var abundancePiexl = AbundancePiexl;
        var distanceToStartPoint = Math.Sqrt(Math.Pow(separatorDistance, 2) + Math.Pow(abundancePiexl, 2));
        //计算出模拟点、起始点,与直线的角度
        var separatorAngle = Math.Atan2(AbundancePiexl, separatorDistance);
        separatorAngle = isAbundanceUpward ? separatorAngle : -separatorAngle;
        isAbundanceUpward = !isAbundanceUpward;
        //得到模拟点的水平角度
        var mockPointAngle = lineAngle + separatorAngle;
        //计算出模拟点坐标
        var verticalDistance = distanceToStartPoint * Math.Sin(mockPointAngle);
        var horizontalDistance = distanceToStartPoint * Math.Cos(mockPointAngle);
        var mockPoint = new Point(startPoint.X + horizontalDistance, startPoint.Y - verticalDistance);
        points.Add(mockPoint);
      }
      points.Add(endPoint);
      return points;
    }

    private void DrawLine(List<Point> points)
    {
      _visualShape.Clear();

      var geometryTest = new StreamGeometry();
      using (var ctx = geometryTest.Open())
      {
        ctx.BeginFigure(points[0], true, false);
        if (points.Count % 2 == 0)
        {
          //绘制二阶贝塞尔函数,需要保证为偶数点
          ctx.PolyQuadraticBezierTo(points, true, true);
        }
        else
        {
          //绘制二阶贝塞尔函数,需要保证为偶数点
          points.Insert(0, points[0]);
          ctx.PolyQuadraticBezierTo(points, true, true);
        }

        ctx.Close();
      }

      var visual = new DrawingVisual();
      using (var context = visual.RenderOpen())
      {
        context.DrawGeometry(FillBrush, StrokePen, geometryTest);
      }
      _visualShape.Add(visual);
    }

    #region 内部方法

    [Obsolete]
    protected override void OnRender(DrawingContext drawingContext)
    {
      //弃用,改为_visualShape填充实现
      //drawingContext.DrawGeometry(FillBrush, StrokePen, BaseGeometry);
    }

    protected override int VisualChildrenCount => _visualShape.Count;

    protected override Visual GetVisualChild(int index)
    {
      if (index < 0 || index >= _visualShape.Count)
      {
        throw new ArgumentOutOfRangeException();
      }

      return _visualShape[index];
    }

    #endregion

    #region 曲线属性

    private readonly VisualCollection _visualShape;
    protected Brush FillBrush { get; set; } = Brushes.Transparent;
    public Brush LineBrush { get; set; } = Brushes.DarkSeaGreen;
    protected double BorderThickness { get; set; } = 1.0;
    private Pen _defaultPen = null;
    protected Pen StrokePen
    {
      get
      {
        if (_defaultPen == null)
        {
          _defaultPen = new Pen(LineBrush, BorderThickness);
        }
        return _defaultPen;
      }
      set => _defaultPen = value;
    }

    #endregion
  }

Github地址:https://github.com/Kybs0/WaveLineTextDemo

以上就是c# 实例——绘制波浪线(附源码)的详细内容,更多关于c# 绘制波浪线的资料请关注我们其它相关文章!

(0)

相关推荐

  • C# 使用GDI绘制雷达图的实例

    最近项目要用C#实现画一个雷达图,搜了搜网上竟然找不到C#画雷达图的解决方案,那么自己实现一个吧 实现效果如下图: 代码如下: public static class RadarDemo { static float mW = 1200; static float mH = 1200; static Dictionary<string, float> mData = new Dictionary<string, float> { //{ "速度",77}, {

  • c# 绘制中国象棋棋盘与棋子

    本文是利用C# 实现中国象棋的棋盘绘制,以及初始化布局,并不实现中国象棋的对弈逻辑.仅供学习参考使用. 思路: 绘制中国象棋棋盘,竖线九条,横线十条.再中间绘制'楚河','汉界' . 绘制棋子,然后将棋子布局在棋盘上即可. 涉及知识点: 用户控件:用于实现棋盘的绘制,重写 OnPaint(PaintEventArgs e) 方法. Matrix:封装表示几何变换的 3x3 仿射矩阵.本例中主要用于旋转绘制反方的'汉界'. GraphicsPath:表示一系列相互连接的直线和曲线.本例中主要用于绘

  • C# Winform中如何绘制动画示例详解

    前言 这里介绍一个.net自身携带的类ImageAnimator,这个类类似于控制动画的时间轴,使用ImageAnimator.CanAnimate可以判断一个图片是否为动画,调用ImageAnimator.Animate可以开始播放动画,即每经过一帧的时间触发一次OnFrameChanged委托,我们只要在该委托中将Image的活动帧选至下一帧再迫使界面重绘就可以实现动画效果了. 为了方便以后的使用,我将这些代码整合到了一起,形成一个AnimateImage类,该类提供了CanAnimate.

  • C# 绘制统计图大全(柱状图, 折线图, 扇形图)

    统计图形种类繁多, 有柱状图, 折线图, 扇形图等等, 而统计图形的绘制方法也有很多, 有Flash制作的统计图形, 有水晶报表生成统计图形, 有专门制图软件制作, 也有编程语言自己制作的:这里我们用就C# 制作三款最经典的统计图: 柱状图, 折线图和扇形图:既然是统计, 当然需要数据, 这里演示的数据存于Sql Server2000中, 三款统计图形都是动态生成. 其中柱状图我会附上制作步骤, 其他两款统计图直接附源码. 说明: 需求不一样, 统计图形绘制后的显示效果也不一样, 比如这里柱状图

  • C#绘制飞行棋地图小程序

    1. 初始化地图,在绘制时可先将地图进行初始化,用数组来存储关卡的位置,然后利用循环给地图中 关卡所在处赋予代表关卡的值. 关键代码如下 /// <summary> /// 初始化游戏地图 /// </summary> static void InitialMap() { for (int i=0;i<Map.Length;i++) { Map[i] =0; } //用于存储关卡位置 int[] luckyTurn = { 6, 23, 40, 55, 69, 83,98 }

  • C# 绘制实时折线图,波形图

    此Demo是采用VS自带的Chart图表控件,制作实时动态显示的折线图,和波形图.本文仅供学习分享使用,如有不足之处,还请指正. 涉及知识点: Chart 控件,功能强大,可以绘制柱状图,折线图,波形图,饼状图,大大简化了对图的开发与定制. Chart控件的相关概念: ChartArea,表示图表区域,一个Chart可以绘制多个ChartArea,重叠在一起. Series ,表示数据序列,每个ChartArea可以有多个数据线.即,Series属于ChartArea. AxisX,AxisY,

  • C#正方形图片的绘制方法

    本文实例为大家分享了C#绘制正方形图片的的具体代码,供大家参考,具体内容如下 using System; using System.Collections.Generic; using System.Drawing; using System.Drawing.Drawing2D; using System.Drawing.Imaging; using System.Linq; using System.Text; using System.Threading.Tasks; namespace t

  • c# 实例——绘制波浪线(附源码)

    效果图 界面绘制操作 private Point? _startPoint = null; private void ContainerCanvas_OnPreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e) { var position = e.GetPosition(ContainerCanvas); if (_startPoint == null) { _startPoint = position; } else

  • 微信小程序 表单Form实例详解(附源码)

    微信小程序 表单Form实例 表单Form的应用很广泛,我们可以利用form设计登录注册,也可以设计一种答题问卷的形式,今天主要讲一下form的使用 form表单,将组件内输入的"switch","input","checkbox","slider","radio","picker"的值进行提交,数据的格式为:name:value,所以表单中控件都需要添加name属性,否则找不到对应控件

  • jQuery插件ImageDrawer.js实现动态绘制图片动画(附源码下载)

    ImageDrawer.js是一款可以实现动态绘制图片动画的jQuery插件.通过ImageDrawer.js插件,你可以制作在页面中绘制图片的动态过程,你可以控制绘制动画的持续时间等参数,非常有趣. 效果展示       源码下载 使用方法 使用该动态绘制图片插件需要在页面中引入imagedrawer.css,jquery和imagedrawer.js文件. <link rel="stylesheet" href="css/imagedrawer.css"

  • 超详细的php用户注册页面填写信息完整实例(附源码)

    注册页面是大多数网站必备的页面,所以很有必要对自己的注册页面做些精心的设计.下面三张图,第一张是注册的展示页面,第二张思维导图就一个简单的逻辑,第三张是通过firebug查看调用的JS文件. 一.给每个输入框写下说明 在用户看到这个输入框的时候,就能非常清晰的明白这个输入框是做啥用的,最大限度的降低他们产生疑惑的可能性.我们需要假设用户毫不了解注册需要输入的内容,随后给他们足够的信息以便帮助他们理解.  二.小图标icon Icon是增强内容的工具,而且能给访客一个很好的暗示.以前使用小图标都是

  • C# 动态输出Dos命令执行结果的实例(附源码)

    本文以一个简单的小例子讲解如何将命令行信息实时的输出到文本框中.仅供学习分享使用,如有不足之处,还请指正. 概述 在C#程序开发过程中,有时需要运行其它的程序并获得输出的结果来进行进一步的处理.一般第三方的程序,主要通过进程来调用,如果能够获取第三方程序执行过程中的信息,就显得方便而有用. 涉及知识点: 进程相关类: Process,ProcessStartInfo,主要设置进程的重定向输出,以及接受数据的事件. 文本框操作:多行显示,滚动条总在最下面 效果图 如下[如果命令执行完毕,会自动结束

  • Android编程实现画板功能的方法总结【附源码下载】

    本文实例讲述了Android编程实现画板功能的方法.分享给大家供大家参考,具体如下: Android实现画板主要有2种方式,一种是用自定义View实现,另一种是通过Canvas类实现.当然自定义View内部也是用的Canvas.第一种方式的思路是,创建一个自定义View(推荐SurfaceView),在自定义View里通过Path对象记录手指滑动的路径调用lineTo()绘制:第二种方式的思路是,先用Canvas绘制一张空的Bitmap,通过ImageView的setImageBitmap()方

  • 自定义Android六边形进度条(附源码)

    本文实例讲述了Android自定义圆形进度条,分享给大家供大家参考.具体如下: 大家也可以参考这两篇文章进行学习: <自定义Android圆形进度条(附源码)>   <Android带进度的圆形进度条> 运行效果截图如下: 主要代码: package com.sxc.hexagonprogress; import java.util.Random; import android.content.Context; import android.content.res.ColorSta

  • C++ Opengl图形颜色功能附源码下载

    项目开发环境: 开发语言:C++和IDE:VS2017,操作系统Windows版本windows SDK8.1,三方库:OpenGL. 项目功能: 创建一个有颜色的图形. 项目源码如下: /*********************包含链接的库文件*******************************************************************************************/ #pragma comment( lib, "opengl32.l

  • C++ Opengl旋转功能附源码下载

    项目开发环境: 开发语言:C++和IDE:VS2017,操作系统Windows版本windows SDK8.1,三方库:OpenGL. 项目功能: 是图形旋转起来. 项目源码如下: /*********************包含链接的库文件*******************************************************************************************/ #pragma comment( lib, "opengl32.lib&

  • python opencv实现直线检测并测出倾斜角度(附源码+注释)

    由于学习需要,我想要检测出图片中的直线,并且得到这些直线的角度.于是我在网上搜了好多直线检测的代码,但是没有搜到附有计算直线倾斜角度的代码,所以我花了一点时间,自己写了一份直线检测并测出倾斜角度的代码,希望能够帮助到大家! 注:这份代码只能够检测简单结构图片的直线,复杂结构的图片还需要设置合理的参数 下面展示 源码. import cv2 import numpy as np def line_detect(image): # 将图片转换为HSV hsv = cv2.cvtColor(image

随机推荐