Core Graphics没有以正确的宽度绘制线条

Question

我正在尝试将UIView上的边框与drawRect中绘制的线组合在一起.我使用相同的宽度.但问题是有时候绘制的线条的宽度对于两者都是相同的,有时则不一样 - 这甚至会随着设备方向的变化而变化!但即使不改变设备方向,它通常仍然不是相同的宽度.

边框绘制为:

view.layer.borderColor = [UIColor blackColor].CGColor;
view.layer.borderWidth = 1.0f;

在该视图上方是另一个视图,它是UIView的子类.两个视图具有相同的宽度,第二个视图覆盖上面的视图顶部.覆盖视图使用drawRect中的以下代码在左侧绘制一条线,该线应该与其下方视图的边框完美对齐:

CGContextRef context = UIGraphicsGetCurrentContext();
CGFloat x = self.bounds.origin.x;
CGFloat y = self.bounds.origin.y;
CGFloat width = self.bounds.size.width;
CGFloat height = self.bounds.size.height;

CGContextSetStrokeColorWithColor(context, [UIColor blackColor].CGColor);
CGContextSetLineWidth(context, 1.0f);

// Left line
CGContextMoveToPoint(context, x, y);
CGContextAddLineToPoint(context, x, height);
CGContextStrokePath(context);

// Right line
CGContextMoveToPoint(context, width - 1.0f, y);
CGContextAddLineToPoint(context, width - 1.0f, height);
CGContextStrokePath(context);

任何想法如何实现这一目标？现在,即使宽度始终为1.0f,如果两条线都以相同的可见宽度绘制,也只是巧合.

目标是最终得到一些看起来像底部圆角但顶部通常边缘的视图.这就是我这样做的原因.第一个视图具有圆角,其上方的第二个视图在宽度上匹配但覆盖顶部,因此顶部的圆角不可见.

屏幕截图:

横向截图:

黄色视图位于白色视图上方.由于view.layer.borderWidth = 1.0f,绘制了白色视图的黑色线条.黄色视图左侧和右侧的黑线用drawRect绘制,上面的代码.方向更改会触发重绘,但绘图代码本身保持不变.两张截图均来自带视网膜显示屏的iPhone(iPhone 4S).

据我所知,所有值都是"整数":

x: 0.000000, y: 0.000000
width: 264.000000, height: 10.000000
frame.origin.x: 33.000000, frame.origin.y: 38.000000

Answer 1

我猜你画的线不是像素对齐的.如果我错了,请忽略我的切线.但它仍然是有用的信息.

我将借用这个WWDC 2011视频中的一些截图:

"1-29会议129 - 适用于iOS开发人员的实用绘图"

我建议你看整件事.相关部分在20:50左右开始.

基本上,想象你想绘制从(1,2)到(4,2)的1pt线

核心图形将尝试将其与y值(2.0)对齐.这意味着它将尝试绘制线条,其顶边为y = 1.5,底边为y = 2.5:

在视网膜显示器上,这将正常工作,因为y = 1.5和y = 2.5是像素对齐的:

然而,在非视网膜显示器上,图形系统将被迫以半强度填充2个垂直像素,以获得最接近的匹配:

请注意,当您处理较小的分数点值时,仍会在视网膜显示屏上看到此效果.所以这个问题仍然可以在视网膜显示器上看到,具体取决于你的视图框架.

要解决此问题,只要您有一个奇数线宽,就需要将绘制它的点值偏移0.5.您需要根据情况向上/向下/向左/向右偏移它.

我希望这有帮助.没有截图,很难说出你的问题是什么.