IOS为UIButton添加阴影

时间:2018-03-04 18:43:29

标签: ios swift uibutton uikit

我试图为按钮添加阴影,但阴影会添加到按钮的文本而不是整个按钮:

enter image description here

我是否需要使用代码来实现此目的?或者这是一个尺寸问题?我可以在故事板上添加阴影大小,但是我不知道应该在哪里设置它是否应该绕过按钮

4 个答案:

答案 0 :(得分:3)

这是因为您的按钮的背景是透明 当您在具有透明背景的 UIView 上设置阴影时,阴影将应用于他的所有子视图(而不是UIView本身)。在您的情况下,您有 UIButton ,其透明背景,因此阴影应用于所有可见的子视图,在这种情况下,只有 titleLabel
所以你有两个解决方案:
1)将按钮的背景颜色更改为其他颜色 2)直接指定shadowPath:
 button.layer.shadowPath = UIBezierPath(rect: button.layer.bounds).cgPath

答案 1 :(得分:1)

我对故事板没有太多了解,但使用下面的图层属性可以设置阴影。你可以玩按钮。

我尝试以下代码并根据您的要求更改值,并为您的按钮添加一些颜色

    //button is your button name
    button.backgroundColor = self.view.backgroundColor
    button.layer.shadowOpacity = 0.3
    button.layer.shadowRadius = 2.0
    button.layer.shadowColor = UIColor.yellow.cgColor
    button.layer.cornerRadius = 2

答案 2 :(得分:1)

阴影被赋予整个按钮。问题是按钮本身有<Grid HorizontalAlignment="{Binding HorizontalAlignment}" ... ,这意味着它不会创建任何阴影(只有它的标题是非透明部分,因此这只是创建阴影的部分)。

在您的情况下,将按钮的背景颜色设置为与其超级视图相同的颜色,您应该得到您想要的颜色。

答案 3 :(得分:1)

这里有两个添加阴影的扩展方法

extension UIView {
func setRadiusWithShadow(_ radius: CGFloat? = nil) { // this method adds shadow to right and bottom side of button
    self.layer.cornerRadius = radius ?? self.frame.width / 2
    self.layer.shadowColor = UIColor.darkGray.cgColor
    self.layer.shadowOffset = CGSize(width: 1.5, height: 1.5)
    self.layer.shadowRadius = 1.0
    self.layer.shadowOpacity = 0.7
    self.layer.masksToBounds = false
}

func setAllSideShadow(shadowShowSize: CGFloat = 1.0) { // this method adds shadow to allsides
    let shadowSize : CGFloat = shadowShowSize
    let shadowPath = UIBezierPath(rect: CGRect(x: -shadowSize / 2,
                                               y: -shadowSize / 2,
                                               width: self.frame.size.width + shadowSize,
                                               height: self.frame.size.height + shadowSize))
    self.layer.masksToBounds = false
    self.layer.shadowColor = UIColor.lightGray.withAlphaComponent(0.8).cgColor
    self.layer.shadowOffset = CGSize(width: 0.0, height: 0.0)
    self.layer.shadowOpacity = 0.5
    self.layer.shadowPath = shadowPath.cgPath
}
}

shadows to button

 self.view.layoutIfNeeded() // need this method to layout your run time button frame before giving shadow

第一个按钮带有所有侧面阴影

self.recordMeasurementWrapperView.setAllSideShadow(shadowShowSize: 3.0)

第二个按钮只有底部和右侧的阴影

self.retakeMeasurementWrapperView.setRadiusWithShadow(2.0)