带有渐变、圆角、边框和阴影的 UIButton
问题描述
网站上有一些类似的问题,但我正在寻找一些具体且略有不同的问题.
There are a few similar questions on the site, but I'm looking for something specific and slightly different.
我遵循这里给出的方向:http://www.cimgf.com/2010/01/28/fun-with-uibuttons-and-core-animation-layers/ 子类化 UIButton 以创建一个我可以指定的通用类渐变色,而不是尝试使用静态图像.
I followed the direction given here: http://www.cimgf.com/2010/01/28/fun-with-uibuttons-and-core-animation-layers/ to subclass UIButton in order to create a generic class that I can specify the gradient colors on, rather than trying to use a static image.
我遇到了一个问题,按钮层上的 setMasksToBounds 要么允许a) 阴影要显示,也可以让渐变层显示超出圆角或者B)渐变层剪辑到圆角,但不允许显示阴影
I ran into a problem where the setMasksToBounds on the button's layer would either allow A) the drop shadow to show, but also allow the gradient layer to show beyond the rounded corners OR B) the gradient layer to clip to the rounded corners, but not allow the drop shadow to show
我对该问题的解决方案似乎很笨拙,并且(尽管它有效)我想看看是否有人知道更好和/或更清洁的方法来完成同样的事情.这是我的代码:
My solution to the problem seemed clunky and (although it works) I wanted to see if anyone knew of a better and/or cleaner way to accomplish the same thing. Here's my code:
CSGradientButton.h
CSGradientButton.h
CSGradient.m(有趣的部分,无论如何)
CSGradient.m (the interesting parts, anyway)
如您所见,我添加了一个包装"层,渐变层可以安全地遮罩到该层,而按钮视图的顶级 CALayer 可以在添加阴影时安全地设置 maskToBounds = NO.我添加了一个 setCornerRadius: 方法来允许顶层和包装器"进行调整.
As you can see, I add a 'wrapper' layer that the gradient layer can safely mask to, while the top level CALayer of the button view can safely set masksToBounds = NO when the dropshadow is added. I add a setCornerRadius: method to allow both the top layer and the 'wrapper' to adjust.
所以与其做 [[myCustomButton layer] setCornerRadius:3.0f];
我只是说 [myCustomButton setCornerRadius:3.0f];
如你所见,它可能没有我希望的那么干净.
So rather than doing something like [[myCustomButton layer] setCornerRadius:3.0f];
I just say [myCustomButton setCornerRadius:3.0f];
As you can see, it's not maybe as clean as I'm hoping.
有没有更好的办法?
推荐答案
这就是我发现的具有圆角、渐变和阴影的按钮的方式.这个例子有一个特定的渐变,但显然可以用其他渐变代替.
This is the way I found to have a button with rounded corner, gradient, and drop shadow. This example has one particular gradient, but can obviously be replaced with other gradients.
这篇关于带有渐变、圆角、边框和阴影的 UIButton的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!