UIBezierPath的起始和结束角度？ [英] start and end angle of UIBezierPath?

问题描述

我使用 UIBezierPath 和 CAShapeLayer 在iOS中编码如下半圈。

  clockWiseLayer = [[CAShapeLayer alloc] init]; 
 
 CGFloat startAngle = -M_PI_2; 
 CGFloat endAngle = M_PI + M_PI_2; 
 
 CGFloat width = CGRectGetWidth（imageView.frame）/2.0f + 30; 
 CGFloat height = CGRectGetHeight（imageView.frame）/2.0f +50; 
 CGPoint centerPoint = CGPointMake（宽度，高度）; 
 
 float radius = CGRectGetWidth（imageView.frame）/ 2 + 10; 
 
 clockWiseLayer.path = [UIBezierPath bezierPathWithArcCenter：centerPoint 
 radius：radius 
 startAngle：startAngle 
 endAngle：endAngle 
顺时针：是] .CGPath; 
 
 clockWiseLayer.fillColor = [UIColor clearColor] .CGColor; 
 clockWiseLayer.strokeColor = [UIColor blueColor] .CGColor; 
 clockWiseLayer.borderColor = [UIColor greenColor] .CGColor; 
 clockWiseLayer.backgroundColor = [UIColor redColor] .CGColor; 
 
 clockWiseLayer.strokeStart = 0.0f; 
 clockWiseLayer.strokeEnd = 0.5f; 
 
 clockWiseLayer.lineWidth = 2.0f; 
 clockWiseLayer.borderWidth = 5.0f; 
 
 clockWiseLayer.shouldRasterize = NO; 
 [self.layer addSublayer：clockWiseLayer]; 
  

结果如下。

< a href =https://i.stack.imgur.com/mPiEg.png>

我希望在World Globe的另一侧有一个蓝色半圈。

它是半圈，但我想要它在另一边，也是CounterClockWise。

我无法设置开始和结束角度，而顺时针：否。

谢谢。

解决方案

检查文档坐标：

Y轴是与数学中的标准坐标系相比发生逆转。

您应该从1/2 * PI（底部锚点）绘制到3/2 * PI（顶部锚点）然后将strokeStart设置为0.0f并将strokeEnd设置为1.0f（因此它填充整个路径使用iOS常量的工作代码：

  CGFloat startAngle = M_PI_2; 
 CGFloat endAngle = startAngle + M_PI; 
 CGFloat width = CGRectGetWidth（imageView.frame）/2.0f; 
 CGFloat height = CGRectGetHeight（imageView.frame）/2.0f; 
 CGPoint centerPoint = CGPointMake（宽度，高度）; 
 float radius = CGRectGetWidth（imageView.frame）/ 2 + 10; 
 CAShapeLayer * clockWiseLayer = [[CAShapeLayer alloc] init]; 
 clockWiseLayer.path = [UIBezierPath bezierPathWithArcCenter：centerPoint 
 radius：radius 
 startAngle：startAngle 
 endAngle：endAngle 
顺时针：是] .CGPath; 
 
 clockWiseLayer.fillColor = [UIColor clearColor] .CGColor; 
 clockWiseLayer.strokeColor = [UIColor blueColor] .CGColor; 
 clockWiseLayer.borderColor = [UIColor greenColor] .CGColor; 
 clockWiseLayer.backgroundColor = [UIColor redColor] .CGColor; 
 
 clockWiseLayer.strokeStart = 0.0f; 
 clockWiseLayer.strokeEnd = 1.0f; 
 
 clockWiseLayer.lineWidth = 2.0f; 
 clockWiseLayer.borderWidth = 5.0f; 
 [self.layer addSublayer：clockWiseLayer]; 
  

I have coded as below for half circle in iOS using UIBezierPath and CAShapeLayer.

 clockWiseLayer = [[CAShapeLayer alloc] init];

CGFloat startAngle = -M_PI_2;
CGFloat endAngle = M_PI + M_PI_2;

CGFloat width = CGRectGetWidth(imageView.frame)/2.0f + 30;
CGFloat height = CGRectGetHeight(imageView.frame)/2.0f +50;
CGPoint centerPoint = CGPointMake(width, height);

float radius = CGRectGetWidth(imageView.frame)/2+10;

clockWiseLayer.path = [UIBezierPath bezierPathWithArcCenter:centerPoint
                                                    radius:radius
                                                startAngle:startAngle
                                                  endAngle:endAngle
                                                 clockwise:YES].CGPath;

clockWiseLayer.fillColor = [UIColor clearColor].CGColor;
clockWiseLayer.strokeColor = [UIColor blueColor].CGColor;
clockWiseLayer.borderColor = [UIColor greenColor].CGColor;
clockWiseLayer.backgroundColor = [UIColor redColor].CGColor;

clockWiseLayer.strokeStart = 0.0f;
clockWiseLayer.strokeEnd = 0.5f;

clockWiseLayer.lineWidth = 2.0f;
clockWiseLayer.borderWidth = 5.0f;

clockWiseLayer.shouldRasterize = NO;
[self.layer addSublayer:clockWiseLayer];

This results as below.

I want this blue half circle on the opposite side of the World Globe.

It is half Circle, but I want it on the other side, also CounterClockWise.

I am unable to set start and end angle for that, while clockwise:NO.

Thanks.

解决方案

Check documentation for coordinates: http://i.stack.imgur.com/1yJo6.png

Y-Axis is reversed compared to standard coordinate system in mathematics.

You should draw from 1/2*PI (bottom anchor) to 3/2*PI (top anchor) and then you set strokeStart to 0.0f and strokeEnd to 1.0f (so it fills whole path).

Working code using iOS constants:

CGFloat startAngle = M_PI_2;
CGFloat endAngle = startAngle + M_PI;
CGFloat width = CGRectGetWidth(imageView.frame)/2.0f;
CGFloat height = CGRectGetHeight(imageView.frame)/2.0f;
CGPoint centerPoint = CGPointMake(width, height);
float radius = CGRectGetWidth(imageView.frame)/2+10;
CAShapeLayer* clockWiseLayer = [[CAShapeLayer alloc] init];
clockWiseLayer.path = [UIBezierPath bezierPathWithArcCenter:centerPoint
                                                     radius:radius
                                                 startAngle:startAngle
                                                   endAngle:endAngle
                                                  clockwise:YES].CGPath;

clockWiseLayer.fillColor = [UIColor clearColor].CGColor;
clockWiseLayer.strokeColor = [UIColor blueColor].CGColor;
clockWiseLayer.borderColor = [UIColor greenColor].CGColor;
clockWiseLayer.backgroundColor = [UIColor redColor].CGColor;

clockWiseLayer.strokeStart = 0.0f;
clockWiseLayer.strokeEnd = 1.0f;

clockWiseLayer.lineWidth = 2.0f;
clockWiseLayer.borderWidth = 5.0f;
[self.layer addSublayer:clockWiseLayer];

这篇关于UIBezierPath的起始和结束角度？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！