画一个半圆形按钮iOS [英] Draw a semi-circle button iOS

问题描述

我正在尝试绘制一个半圆形按钮。我在绘制半圆并将其附加到我在xcode中制作的按钮时遇到了麻烦。 xcode中的按钮具有约束，将其固定到屏幕底部并使其居中。我在视图控制器中引用该按钮，然后尝试将其覆盖为半圆，如下所示。我得到一个空白按钮。我还在按钮所在的故事板的坐标中进行了硬编码。有没有更好的方法呢？

I am trying to draw a semi-circle button. I'm having trouble both drawing the semi-circle and attaching it to the button I made in xcode. The button in xcode has constraints pinning it to the bottom of the screen and centering it. I reference the button in my view controller and then try to override it to a semi-circle as follows. I am getting a blank button. I also hard coded in the coordinates from the storyboard of where the button is. Is there a better way to do that?

let circlePath = UIBezierPath.init(arcCenter: CGPoint(x: 113.0, y: 434.0),
radius: 10.0, startAngle: 0.0, endAngle: CGFloat(M_PI), clockwise: true)

let circleShape = CAShapeLayer()
circleShape.path = circlePath.CGPath

sunButton.layer.mask = circleShape

推荐答案

问题是你的形状图层位于按钮边界之外。如果您只是将形状图层添加为按钮图层的子视图，您将看到问题：

The problem is that your shape layer is positioned way outside the buttons bounds. If you just add the shape layer as a subview of your button's layer you'll see the problem:

button.layer.addSublayer(circleShape)

您必须调整圆弧中心点，以便圆弧位于按钮的边界内：

You have to adjust the arc center point, so that the arc lies within the button's bounds:

let circlePath = UIBezierPath.init(arcCenter: CGPointMake(button.bounds.size.width / 2, 0), radius: button.bounds.size.height, startAngle: 0.0, endAngle: CGFloat(M_PI), clockwise: true)
let circleShape = CAShapeLayer()
circleShape.path = circlePath.CGPath
button.layer.mask = circleShape

你会得到这个：

这篇关于画一个半圆形按钮iOS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！