关闭

WPF 如何画出1像素的线

标签: wpfxamlC#net
863人阅读 评论(0) 收藏 举报
分类:

如何有人告诉你,请你画出1像素的线,是不是觉得很简单,实际上在 WPF 上还是比较难的。

本文告诉大家,如何让画出的线不模糊

画出线的第一个方法,创建一个 Canvas ,添加一个线

界面代码

            <Canvas x:Name="Canvas"></Canvas>

在后台添加一条线

            Line myLine = new Line();

            myLine.Stroke = System.Windows.Media.Brushes.Black;

            myLine.X1 = 100;
            myLine.X2 = 200;  // 150 too far
            myLine.Y1 = 200;
            myLine.Y2 = 200;

            myLine.StrokeThickness = 1;

            Canvas.Children.Add(myLine);

那么如何看到线模糊呢?

简单方法是使用 ViewBox 和放大镜,可以看到模糊

在界面添加下面代码

    <Viewbox >
            <Canvas x:Name="Canvas"></Canvas>
    </Viewbox>

这时拖动窗口可以看到线放大

可以看到线是模糊的,如果想要让线不模糊,可以添加下面的代码

        myLine.SnapsToDevicePixels = true;
            myLine.SetValue(RenderOptions.EdgeModeProperty, EdgeMode.Aliased);

这个方法是从 [https://stackoverflow.com/q/2879033/6116637][https://stackoverflow.com/q/2879033/6116637]得到,但是无法对于自己的控件

如果自己创建一个控件,那么直接使用 dc.DrawLine 得到不是清晰的

创建一个类自定义控件,添加下面的代码画出线

        protected override void OnRender(DrawingContext dc)
        {

                dc.DrawLine(_pen,  new Point(10, 10), new Point(310, 10));

        }

可以看到,画出来的线是模糊的,于是看了微软的代码

看了他的矩形是如何画的,看到他画出来的是清晰的,但是复制他的代码到我的控件,画出来不是清晰的

        /// <summary>
        /// Render callback.
        /// </summary>
        protected override void OnRender(DrawingContext drawingContext)
        {
            Pen pen = GetPen();
            drawingContext.DrawRoundedRectangle(Fill, pen, _rect, RadiusX, RadiusY);
        }

下面代码是我复制他的,但是自己的控件画出来在放大时,线模糊,所以直接复制是无法做到wr的矩形那样

       protected override void OnRender(DrawingContext dc)
        {

            dc.DrawRoundedRectangle(null, _pen, new Rect(new Point(10, 10), new Size(100, 100)), 5, 5);
        }

在界面画出来wr 的矩形和自定义控件,可以看到,微软的是清晰的

那么是不是wr 做了特殊的东西,到现在还不知道,但是找到了一个方法,可以画出清晰

缩小看到的图片是这样

那么放大时就是下面这张图

所以需要在放大时,也画一个像素,
这个方法就是本文,所以这是在翻译,只是没有使用对所有的文字翻译,来自工藤大神的方法。

本文使用的方法很简单,第一步

复制方法到一个静态类

    public static void DrawSnappedLinesBetweenPoints(this DrawingContext dc,
        Pen pen, double lineThickness, params Point[] points)
    {
        var guidelineSet = new GuidelineSet();
        foreach (var point in points)
        {
            guidelineSet.GuidelinesX.Add(point.X);
            guidelineSet.GuidelinesY.Add(point.Y);
        }
        var half = lineThickness / 2;
        points = points.Select(p => new Point(p.X + half, p.Y + half)).ToArray();
        dc.PushGuidelineSet(guidelineSet);
        for (var i = 0; i < points.Length - 1; i = i + 2)
        {
            dc.DrawLine(pen, points[i], points[i + 1]);
        }
        dc.Pop();
    }

然后就可以在自定义控件使用下面的代码

      protected override void OnRender(DrawingContext dc)
        {
            dc.DrawSnappedLinesBetweenPoints(_pen,1, new[]
            {
                new Point(10, 10),
                new Point(310, 10),
            });
        }

可以看到线是清晰的

参见:https://stackoverflow.com/a/45189552/6116637

http://www.nbdtech.com/Blog/archive/2008/11/20/blurred-images-in-wpf.aspx

知识共享许可协议
本作品采用知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议进行许可。欢迎转载、使用、重新发布,但务必保留文章署名林德熙(包含链接:http://blog.csdn.net/lindexi_gd ),不得用于商业目的,基于本文修改后的作品务必以相同的许可发布。如有任何疑问,请与我联系

2
0
查看评论
发表评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场

IOS绘制1像素线条问题

前段时间美术在验收界面时提了问题:为啥要求1像素宽的一个矩形框似乎却变成了2,3个像素宽。仔细检查过代码后发现,的确设置了LineWidth为1,但绘制效果却并不如人愿。似乎在ios上绘制最低要2个像...
  • zhouleizhao
  • zhouleizhao
  • 2014-06-23 09:56
  • 1116

StoryBoard中一像素的分割线

可视化一像素设置,使用UIView高度设置为1,自定义约束.
  • lunlun426
  • lunlun426
  • 2015-09-23 10:56
  • 1565

[Canvas系列]Canvas简单线条绘制_02

在学画画的时候,线条是最基本的了,而线条的连接可以组成任何图形。在Canvas中也是如此。在开始之前我们先拿出画布和画笔:12var cvs = document.getElementById(‘cv...
  • BaiHuaXiu123
  • BaiHuaXiu123
  • 2016-12-13 23:58
  • 2096

iOS: 如何正确的绘制1像素的线

iOS中当我们使用Quartz,UIKit,CoreAnimation等框架时,所有的坐标系统采用Point来衡量。系统在实际渲染到设置时会帮助我们处理Point到Pixel的转换。
  • u012371575
  • u012371575
  • 2017-11-22 09:23
  • 198

iOS 绘制1像素的线

一、Point Vs Pixel iOS中当我们使用Quartz,UIKit,CoreAnimation等框架时,所有的坐标系统采用Point来衡量。系统在实际渲染到设置时会帮助我们处理Poin...
  • meegomeego
  • meegomeego
  • 2015-08-09 20:38
  • 699

iOS: 如何正确的绘制1像素的线

一、Point Vs Pixel iOS中当我们使用Quartz,UIKit,CoreAnimation等框架时,所有的坐标系统采用Point来衡量。系统在实际渲染到设置时会帮助我们处理Po...
  • shaobo8910
  • shaobo8910
  • 2015-08-18 11:32
  • 475

【IOS开发】如何画1像素的线

最近在项目中画了一根1像素的线,我是通过直接花一个但是通过PS查看,画了不止1个像素。 原代码语句: 1 label1 = [[UILab...
  • Sunnylucy1
  • Sunnylucy1
  • 2015-09-16 16:30
  • 862

前端面试题---HTML部分

一年一度的秋招马上开始了(部分BAT这样的老大已经开始内推了,小伙伴们,快找学长学姐们内推吧):整理了一些面试题及答案;css与js部分之后更新。 ————————————————– HTML1.Do...
  • qq_34720425
  • qq_34720425
  • 2016-07-23 17:46
  • 833

1像素Activity进程保活

Android8.0马上就要发布,Google对于安卓市场上各种应用占据内存空间的问题不断进行内存完善,我们的应用进程很难再保持不死之身,以前的服务唤醒在5.0已经失效,现在我们尽可能的做到保活方式就...
  • wang_k516
  • wang_k516
  • 2017-07-10 11:34
  • 1980

R语言画中国地图(不含南沙群岛)

本文转至:http://blog.csdn.net/belldeep/article/details/40019803
  • u013259893
  • u013259893
  • 2014-10-25 11:00
  • 1316
    个人资料
    • 访问:593126次
    • 积分:8785
    • 等级:
    • 排名:第2548名
    • 原创:231篇
    • 转载:16篇
    • 译文:25篇
    • 评论:228条
    博客专栏
    文章分类
    最新评论