我如何devise一个button以获得透明文本？

我目前在一个欢迎页面上工作，我遇到了这个有趣的devise：

我试图在底部使用一个button，文本通过后面的半透明视图。 我试了下面的代码，但似乎并没有工作：

let transparent = UIColor(red: 0, green: 0, blue: 0, alpha: 0) let semiwhite = UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 0.15) bottomView.backgroundColor = semiwhite loginButton.backgroundColor = semiwhite loginButton.setTitleColor(transparent, forState: .Normal) loginButton.layer.cornerRadius = 10 loginButton.layer.masksToBounds = true loginButton.layer.borderWidth = 2.5 loginButton.layer.borderColor = transparent.CGColor 

有谁知道如何做到这一点？

Answer 1

我build议你不要“透明”的文字。 相反，你可能想把它看作是一个带有“蒙板”的白色视图，这个蒙板是文本的轮廓，允许显示下面的图像。 这很复杂，因为面具实际上是从我们通常掩盖图像的方式倒过来的（例如，“用Facebooklogin”文本不是面具，而是它周围的空白区域）。 但核心graphics提供了很容易做到这一点的方法。

所以，虽然在你最喜欢的图像编辑工具中创build这个graphics可能是最容易的，但是如果你想以编程的方式来做，你可以做一些事情：

 override func viewDidLayoutSubviews() { super.viewDidLayoutSubviews() updateMaskForView(button1, text: "Sign in with Facebook") updateMaskForView(button2, text: "Sign-up with Email") } func updateMaskForView(button: UIImageView, text: String) { UIGraphicsBeginImageContextWithOptions(button.bounds.size, true, 0) let context = UIGraphicsGetCurrentContext() CGContextScaleCTM(context, 1, -1); CGContextTranslateCTM(context, 0, -button.bounds.size.height); // draw rounded rectange inset of the button's entire dimensions UIColor.whiteColor().setStroke() let rect = CGRectInset(button.bounds, 10, 10) let path = UIBezierPath(roundedRect: rect, cornerRadius: 5) path.lineWidth = 4 path.stroke() // draw the text let attributes = [ NSFontAttributeName: UIFont.preferredFontForTextStyle(UIFontTextStyleCaption1), NSForegroundColorAttributeName: UIColor.whiteColor() ] let size = text.sizeWithAttributes(attributes) let point = CGPoint(x: (button.bounds.size.width - size.width) / 2.0, y: (button.bounds.size.height - size.height) / 2.0) text.drawAtPoint(point, withAttributes: attributes) // capture the image and end context let image = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() // create image mask let cgimage = image.CGImage! let bytesPerRow = CGImageGetBytesPerRow(cgimage) let dataProvider = CGImageGetDataProvider(cgimage) let bitsPerPixel = CGImageGetBitsPerPixel(cgimage) let width = CGImageGetWidth(cgimage) let height = CGImageGetHeight(cgimage) let bitsPerComponent = CGImageGetBitsPerComponent(cgimage) let mask = CGImageMaskCreate(width, height, bitsPerComponent, bitsPerPixel, bytesPerRow, dataProvider, nil, false) // create background UIGraphicsBeginImageContextWithOptions(button.bounds.size, false, 0) CGContextClipToMask(UIGraphicsGetCurrentContext(), button.bounds, mask) UIColor.whiteColor().colorWithAlphaComponent(0.9).setFill() UIBezierPath(rect: button.bounds).fill() let background = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() // use image button.image = background } 

这里要注意的技巧是使用CGImageMaskCreate ，它可以让我们屏蔽除了我们绘制的白色文本和边框之外的所有东西。 一般来说，当我们谈论遮罩图像时，我们用其他图像（其中一个非零的alpha通道揭示了什么应该被掩盖，什么不应该）掩盖它们，但是我们使用一个核心graphics“图像遮罩” ，这给了我们更多的控制。 有关图像蒙版蒙版和图像蒙版之间差异的讨论，请参阅“ Quartz 2D Programming Guide”中的蒙版图像一章。

Answer 2

我将deviseAdobe Fireworks之类的button，使文本保持透明，然后将其保存为GIF。 然后，您可以将其设置为您的button的背景。

Answer 3

首先你可以将tintcolor设置为你想要的颜色。

如果你将alpha设置为0那么意味着视图被隐藏。 所以不要给alpha 0 。

你有select，你可以使用clear color 。 所以背景颜色会显示。

第二件事，如果你想使用的颜色，然后采取alpha 0.5或其他颜色与alpha 0.5或0.2的白色同样不采取确切的0.它将使视图隐形。

这是基本部分。 现在在你的情况下，你可以做这样的事情，

例如你的button尺寸是30×100比你应该把uiview作为背景更大的那个button的大小，并设置清晰的颜色作为背景颜色，并在该视图上添加button，所以边框颜色或textcolor会自动设置为明智的，如果你给清晰的颜色作为色彩或边界。

另一个简单的select是，您可以拍摄与需求完全匹配的图像，并将图像视图和背景设置为图像清除颜色和图像，并在该图像上添加button，closuresbutton，颜色清晰，没有文字，因为图像本身覆盖了文字

希望这会帮助:)