C#開發PACS醫學影像處理系統(十二)：繪圖處理之圖形標記

時間 2021-01-11

標籤 html 算法 canvas 微信架構併發機器學習 ide 函數高併發欄目 C# 简体版

原文原文鏈接

在醫生實際使用過程當中，對於有病竈的影像須要一些2D繪圖操做，例如對於病竈的標記和測量，html

這就牽涉到在WPF中的2D繪圖操做技術，通常的思路是監聽鼠標的按下和擡起以及運動軌跡，目前整理出的經常使用繪圖和測量功能以下：算法

圖形標記類：（測量類請參考本系列文章：繪圖處理之測量工具）canvas

功能	說明
選區	螞蟻線選擇框
線段	線段標記
折線	折線標記
圓形	空心圓形
矩形	空心矩形
多邊形	空心多邊形
箭頭	指向做用
文本	文本標記
清除全部標記	清空單元格繪圖對象
撤銷上個標記	刪除上一個繪圖對象

在WPF中，推薦使用InkCanvas控件。微信

最終效果：架構

1.在你的C#工程中添加一個圖形類做爲操做基類：併發

 　　/// <summary>
    /// 圖形信息
    /// </summary>
    public class ShapeInfo
    {
        #region -----聲明變量-----

        /// <summary>
        /// 圖形操做類型
        /// </summary>
        public DrawAction shapeType = DrawAction.None;

        /// <summary>
        /// 控件畫布對象
        /// </summary>
        public InkCanvas inkCanvas;

        /// <summary>
        /// 單位圖形畫布對象
        /// </summary>
        public Canvas canvas;

        /// <summary>
        /// 圖形
        /// </summary>
        public Shape shape;

        /// <summary>
        /// 控制點矩形對象集合
        /// </summary>
        public Dictionary<string, Ellipse> CtrlPoints;

        /// <summary>
        /// 範圍選區矩形對象
        /// </summary>
        public Polygon regionRect;

        /// <summary>
        /// 當前形狀的幾何體
        /// </summary>
        public Geometry geometry;

        /// <summary>
        /// 是否爲測量行爲
        /// </summary>
        public bool isMeasure = false;

        /// <summary>
        /// 測量對象集合
        /// </summary>
        public List<TextBlock> measureList = new List<TextBlock>();

        #endregion


        #region -----基類虛方法-----

        /// <summary>
        /// 繪製圖形
        /// </summary>
        /// <param name="point">鼠標座標</param>
        public virtual void DrawShape(Point point) { }


        /// <summary>
        /// 圖形繪製完成
        /// </summary>
        /// <param name="point">鼠標座標</param>
        /// <param name="isCallBack">是否回調</param>
        public virtual bool DrawDone(Point point, bool isCallBack) { return true; }


        /// <summary>
        /// 繪製完成回調函數
        /// </summary>
        /// <param name="point">鼠標座標</param>
        /// <param name="isCallBack">是否回調</param>
        public delegate bool DrawDoneCallBack(Point point, bool isCallBack);

        /// <summary>
        /// 繪製完成回調函數對象
        /// </summary>
        public DrawDoneCallBack drawDoneCallBack;


        /// <summary>
        /// 選區移動回調函數
        /// </summary>
        /// <param name="curPoint">當前鼠標座標</param>
        /// <param name="downPoint">按下鼠標座標</param>
        public delegate void RegionRectMoveCallBack(Point curPoint, Point downPoint);

        /// <summary>
        /// 選區移動回調函數對象
        /// </summary>
        public RegionRectMoveCallBack regionRectMoveCallBack;

        #endregion
　　}

2.建立圖形標記的子類來繼承基類，例如繪製一個線段：機器學習

/// <summary>
/// 線段圖形信息
/// </summary>
public class LineInfo : ShapeInfo

在此類中建立繪製方法ide

　　　　 /// <summary>
        /// 建立線段
        /// </summary>
        /// <param name="point">起點座標</param>
        public void CreateLine(Point point)
        {
            Line line = new Line
            {
                //線段顏色
                Stroke = ShapeManager.shapeColor,
                //線段粗細
                StrokeThickness = ShapeManager.shapeThickness,
                //圓角頂點
                StrokeLineJoin = PenLineJoin.Round,
                StrokeEndLineCap = PenLineCap.Round,
                StrokeStartLineCap = PenLineCap.Round,
                //起點的X、Y座標
                X1 = point.X,
                Y1 = point.Y,
                //終點的X、Y座標
                X2 = point.X,
                Y2 = point.Y,
            };

  　　　　　　Canvas canvas = new Canvas();
            canvas.Children.Add(line);
            inkCanvas.Children.Add(canvas);
        }

監聽鼠標的的運動軌跡並從新繪製：函數

 　　　　/// <summary>
        /// 繪製圖形
        /// </summary>
        /// <param name="point">當前座標</param>
        public override void DrawShape(Point point)
        {
            line.X2 = point.X;
            line.Y2 = point.Y;
        }

繪製控制點：一個白色的圓形內嵌一個黑色的圓形，做爲繪圖完成以後的控制點高併發

　　　　 /// <summary>
        /// 繪製控制點
        /// </summary>
        /// <param name="point">鼠標座標</param>
        /// <param name="tag">控制點標誌</param>
        /// <returns></returns>
        public Ellipse DrawCtrlPoint(Point point, string tag)
        {
            Ellipse ctrlPoint = new Ellipse
            {
                StrokeThickness = ShapeManager.ctrlPointThickness,
                Stroke = ShapeManager.ctrlPointColor,
                Fill = ShapeManager.ctrlPointFill,
                Width = ShapeManager.ctrlPointWidth,
                Height = ShapeManager.ctrlPointHeight,
                Margin = new Thickness(point.X - 5, point.Y - 5, point.X - 5, point.Y - 5),
                Visibility = Visibility.Hidden,
            };
            if (!CtrlPoints.Keys.Contains(tag))
            {
                CtrlPoints.Add(tag, ctrlPoint);
                canvas.Children.Add(ctrlPoint);
                ctrlPoint.Tag = tag;
            }
            return ctrlPoint;
        }

看效果：

螞蟻線選區：

　　　　 /// <summary>
        /// 建立選擇框
        /// </summary>
        /// <param name="point">起點座標</param>
        public void CreateSelected(Point point)
        {

            Polygon selectedPoly = new Polygon
            {
                Stroke = ShapeManager.selectRegColor,
                StrokeThickness = ShapeManager.selectRegThickness,
                StrokeDashArray = ShapeManager.selectRegDashArray,
                Points = { point, point, point, point },
            };
            canvas.Children.Add(selectedPoly);
            inkCanvas.Children.Add(canvas);
        }