许久没写博客了,最近在研究WPF下跟画板结合的轻量级气泡的画法,研发过程还是比较艰辛的(主要是复习了高中的数学知识,MMP全忘光了),这篇博客主要是提供一个思路给大家参考,如果有大神还有更好的解决方案可以不吝您的言论尽情留言。拿个这个类型的功能项目,首先分析可以假设气泡是由:椭圆/矩形/圆(椭圆的特例)和三角形组成,OK首先分步骤介绍研发步骤:

第一:首先我的所有的图形都是基于矩阵画出来的,坐标轴起点是(0,0),假设一个拖拉点DynamicPoint (x,y),和一个固定点FixedPoint (m,n);由两点即可确定一个矩形大小,从里面画出内接图形和一个三角形;

1、新建矩形  var TriagleRect = new Rect(FixedPoint, DynamicPoint);

2、假设矩形之内存在一个等比例大小的圆,而圆是由圆心和半径组成的直线所划过的弧确定的,半径R,圆心CenterXY (p,q);相当于已知

3、可以移动的点P设为:CurrentFixedPoint(s,t); 这个点是由鼠标捕获的相当于已知;

4、由动点CurrentFixedPoint(s,t)向圆 M(圆心为CenterXY (p,q),半径R)作两条圆的切线,求出两切点F1(f1x,f1y)、F2(f2x,f2y)坐标值?

如下图(做的图比较难看,做辅助之用)

到这边肯定很多人觉得很熟悉,没错这是高中的数学题,这边在研究的过程中研究了两种解决方案,下面简单的介绍下:

方案1:

如图,由圆心点C向两切点做垂直线,然后根据三角函数做辅助线PQ,QC得出斜边PC长,由图中可以知道

double Sine = R / AB; //求出正弦值

∠F1PC= Math.Round((Math.Asin(Sine) / Math.PI) * 180, 2);//把正弦值换算成角度

利用向量和向量模进行计算二元一次方程可以得出F1,F2坐标.

方程1:PF1向量=PC向量+CF1向量  ,这里可以得出一个关于F1的二元一次方程;

方程2:PF1向量的模=(PC平方+CF1平方)开根号,这里可以得出一个关于F1的二元二次方程;

由这两个方程式可以解出F1的坐标值,同理也可以得出F2的坐标值;

方案2:

也是如图,方案1是稍微复杂了一点,比较不利于软件当中的应用,这边着重介绍第二种算出切点的可行性方案;

double MB = Math.Sqrt(Math.Pow(PC, 2) - Math.Pow(R, 2));//MB为切线的长度

double Sine = R / AB; //求出正弦值

∠F1PC= Math.Round((Math.Asin(Sine) / Math.PI) * 180, 2);//把正弦值换算成角度

接下来跟方案1不同的地方是:我要让圆心点按照角度∠F1PC进行顺逆时针进行旋转

  //把移动点作为圆心按照角度SineAngle旋转,有方向,顺逆时针
Vector vector = Point.Subtract(CenterXY, CurrentFixedPoint);
Matrix matrix = new Matrix();
matrix.RotateAt(SineAngle, CurrentFixedPoint.X, CurrentFixedPoint.Y);
//转换成单位向量1
var v = matrix.Transform(vector);
v.Normalize(); Matrix matrix2 = new Matrix();
matrix2.ScaleAt(_vector, _vector, CurrentFixedPoint.X, CurrentFixedPoint.Y);
var v2 = matrix2.Transform(v);
return v2;

经过上面旋转,然后缩放到单位1的向量假设为PF1' ,然后按比例放大到PF1的模长之后得出向量PF1,这样就可以得出F1点坐标,同理得出F2;具体转换如下:

  //根据获得的向量值求出切点的坐标值
var tmpPoint = Point.Add(P, SecondPoint);
var tmpPoint2 = Point.Add(P, ThirdPoint);

这样就实现了移动动点P,F1,F2也会跟着角度进行实时变化,但是夹角不变,OK,现在动态的两个点都已经确认出来了,接下来就可以通过C#提供的方法进行连线,这样就组成了一个三角形,这个三角形是由内圆心出发延伸至动点P的图形。

 //开始连线画点
PathFigure PointPathFigure = new PathFigure();
PointPathFigure.StartPoint = CurrentFixedPoint;
PointPathFigure.Segments.Add(new LineSegment(new Point(tmpPoint.X, tmpPoint.Y), true));
PointPathFigure.Segments.Add(new LineSegment(new Point(tmpPoint2.X, tmpPoint2.Y), true)); PathGeometry myPathGeometry = new PathGeometry();
myPathGeometry.Figures.Add(PointPathFigure);

第二:两个独立图形出来之后那就是组合图形了,C#组合图形提供了一个专门的方法:Geometry.Combine(Geometry geometry1, Geometry geometry2, GeometryCombineMode mode, Transform transform),不多说不懂得可以查阅资料; 备注:ellipse 是第一个形状,四个中心点分别位于矩阵的边上;

             //组合图形
var geometry = Geometry.Combine(myPathGeometry, ellipse, GeometryCombineMode.Union, null); this.DrawGeometry(streamGeometryContext, geometry);

效果图如下:下面是任意移动动点P之后的效果。个人思路仅供参考。(这是原创文章,如有转载,请备注清楚)

C# WPF动点任意移动气泡画法(解决方案使用到数学勾股定理、正弦定理、向量知识)。的更多相关文章

  1. WPF 精准大小的消息气泡生成

    在其他网站发布过,都是这里写的. 全部为Wpf方式,生成的气泡宽度高度较为精确. 适用任意字体以及字号,可设置图像字体.字号.行间距.字间距.阴影.气泡宽度等,在RichtextboxHelper.c ...

  2. WPF应用程序支持多国语言解决方案

    原文:WPF应用程序支持多国语言解决方案 促使程序赢得更多客户的最好.最经济的方法是使之支持多国语言,而不是将潜在的客户群限制为全球近70亿人口中的一小部分.本文介绍四种实现WPF应用程序支持多国语言 ...

  3. 优动漫PAINT-凌霄花画法

    再见小清新~这次教程教授的是凌霄花的画法!话说这个作者的花卉系列都很米粒啊~配色什么的,赞到没话说~ 教程是简单,呃.... 没有优动漫PAINT软件肿么办? 别着急,╭(╯^╰)╮ 小编给你送来了 ...

  4. 优动漫PAINT-紫藤花画法

    本教程分享一篇使用优动漫PAINT绘制一树梦幻的紫藤萝花教程,原文转载自优动漫官网. 小清新紫藤萝教程,就到这里啦!有兴趣的可以尝试画一画哦,软件下载:www.dongmansoft.com/xiaz ...

  5. 优动漫PAINT-牵牛花画法教程

    喇叭型对画者自身的塑形功力会有较高的要求,作者很靠谱的把他的塑形方式详细呈现了出来~ 对于这样的一个仿真效果的牵牛花完全可以使用优动漫PAINT完成,简单又快捷,软件下载:http://www.don ...

  6. 如何组织一个同时面向 UWP/WPF/.Net Core 控制台的 C# 项目解决方案

    希望写一个小型工具,给自己和需要的人.考虑到代码尽可能的复用,我准备采用 .Net Standard 来编写大多数核心代码,并基于 .Net Core 编写跨平台控制台入口,用 WPF 编写桌面端 U ...

  7. [原创]WPF应用MediaPlayer播放声音断续、不全解决方案

    1.检查扬声器和驱动程序. 测试方法:首先,应用Windows Media Player播放器播放,看是否有问题,如果有问题,基本断定是驱动程序问题.其次,点击扬声器,选择测试,查看扬声器是否好用,如 ...

  8. 【转】WPF的知识

    [-] 闲话WPF之二XAML概述 闲话WPF之五XAML中的类型转换 闲话WPF之十六WPF中的资源 2 闲话WPF之十九WPF中的传递事件 1 闲话WPF之二十WPF中的传递事件 2 闲话WPF之 ...

  9. WPF图形/文字特别效果之一:交叉效果探讨

    原文:WPF图形/文字特别效果之一:交叉效果探讨 为了说明问题,先看下图:图1  完全重叠的单一颜色文字它是2008几个字的叠加,并且颜色为单一的红色.如果不仔细分辨,你或许无法一下子看出是2008. ...

随机推荐

  1. 在 Tomcat 8 部署多端口项目

    一般的部署途径 Tomcat 的部署途径很多,一般有如下几种: 直接将 War 包拷贝到 webapps 目录中,然后启动 Tomcat. 登陆 Tomcat 管理控制台http://localhos ...

  2. 【转载】小tips: PC端传统网页试试使用Zepto.js进行开发

    Zepto.js设计之初专为移动端,不对一些古董浏览器支持.所以,尺寸很小,压缩后20K多一点,但是,jQuery压缩后,3.*版本要80多K,1.*版本则要90多K,4倍差距. 由于每个页面都会使用 ...

  3. windows server 2003安装 SQL server 2008r2 版本的步骤

    大家好,这里介绍的是在系统 windows server 2003安装 SQL server 20008r2版本,如有雷同,敬请谅解,如果错误,欢迎大家多提意见 1.下载好安装包解压以后,就会出现如下 ...

  4. json生成方式

    <script type="text/javascript"> //初始化需要json化的参数 var data = { No: No, Type: Type }; / ...

  5. HiveQL简单操作DDL

    hive-2.1.1 DDL操作 Create/Drop/Alter/Use Database 创建数据库 //官方指导 CREATE (DATABASE|SCHEMA) [IF NOT EXISTS ...

  6. (转)java的动态代理机制详解

    原文出自:http://www.cnblogs.com/xiaoluo501395377/p/3383130.html 在学习Spring的时候,我们知道Spring主要有两大思想,一个是IoC,另一 ...

  7. SPARK 学习笔记一

    1.Spark基于内存进行运算 2.Spark核心是SprintContext,是程序的入口 3.RDDs是提供抽象的数据集,通过RDDS可以方便对分布在各个节点的数据进行计算,而且忽略细节 4.RD ...

  8. javascript 之作用域-06

    作用域 作用域是指变量和函数可访问范围,他规定了如何查找变量,也就是确定当前执行代码对变量的访问权限. 作用域有两种工作模式: 静态作用域 :又称为词法作用域,在编译阶就可以决定变量的引用,由程序定义 ...

  9. V6厂最新V4版本卡地亚蓝气球大号42mm男表|价格报价|

    大家好!为大家带来一款贵族气质的V6厂卡地亚蓝气球大号42mm男表!众所周知卡地亚品牌给人的印象是非常尊贵.奢华的,而且卡地亚蓝气球系列的表款都有着极高的识别度,而且每一款都是极受欢迎的热门腕表,接下 ...

  10. hadoop2的mapreduce操作hbase数据

    1.从hbase中取数据,再把计算结果插入hbase中 package com.yeliang; import java.io.IOException; import org.apache.hadoo ...