如何在UITabBar的顶部创建圆角

时间:2019-05-15 09:30:25

标签: swift xcode uitabbarcontroller uitabbar

我想将拐角半径设置为UITabBar并设置阴影。它看起来应该像img1,但是看起来却像img2

我的代码:

  tabBar.barTintColor = .white
  tabBar.isTranslucent = false

tabBar.dropShadow(shadowColor: UIColor.lightGray, fillColor: UIColor.white, opacity: 1, offset: CGSize(width: 0, height: 5), radius: 25)

        tabBar.layer.masksToBounds = false
        tabBar.isTranslucent = true
        tabBar.barStyle = .blackOpaque
        tabBar.layer.cornerRadius = 13
        tabBar.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner]

和爆炸

extension UIView{
    func dropShadow(shadowColor: UIColor = UIColor.black,
                    fillColor: UIColor = UIColor.white,
                    opacity: Float = 0.2,
                    offset: CGSize = CGSize(width: 0.0, height: 5.0),
                    radius: CGFloat = 10) -> CAShapeLayer {

        let shadowLayer = CAShapeLayer()

        shadowLayer.path = UIBezierPath(roundedRect: self.bounds, cornerRadius: radius).cgPath
        shadowLayer.fillColor = fillColor.cgColor
        shadowLayer.shadowColor = shadowColor.cgColor
        shadowLayer.shadowPath = shadowLayer.path
        shadowLayer.shadowOffset = offset
        shadowLayer.shadowOpacity = opacity
        shadowLayer.shadowRadius = radius
        layer.insertSublayer(shadowLayer, at: 0)
        return shadowLayer
    }
}

2 个答案:

答案 0 :(得分:0)

使用下面的UIView扩展方法制作圆角

func roundedTop(_ radius: CGFloat) {
        let maskPath1 = UIBezierPath(roundedRect: bounds,
                                     byRoundingCorners: [.topRight, .topLeft],
                                     cornerRadii: CGSize(width: radius, height: radius))
        let maskLayer1 = CAShapeLayer()
        maskLayer1.frame = bounds
        maskLayer1.path = maskPath1.cgPath
        layer.mask = maskLayer1
    }

并使用下面的UIView扩展方法进行阴影处理。根据您的要求修改方法。

enum VerticalLocation: String {
    case bottom
    case top
}
func addShadow(location: VerticalLocation, color: UIColor = .black, opacity: Float = 0.3, radius: CGFloat = 2.0) {
        switch location {
        case .bottom:
            addShadow(offset: CGSize(width: 0, height: 5), color: color, opacity: opacity, radius: radius)
        case .top:
            addShadow(offset: CGSize(width: 0, height: -5), color: color, opacity: opacity, radius: radius)
        }
    }

    func addShadow(offset: CGSize, color: UIColor = .black, opacity: Float = 0.3, radius: CGFloat = 2.0) {
        self.layer.masksToBounds = false
        self.layer.shadowColor = color.cgColor
        self.layer.shadowOffset = offset
        self.layer.shadowOpacity = opacity
        self.layer.shadowRadius = radius
    }

希望获得帮助。

答案 1 :(得分:0)

  1. 添加扩展:
        extension UIView {
             func makeCornerTabBar(shadowColor: UIColor = UIColor.black,
                             fillColor: UIColor = UIColor.white,
                             opacity: Float = 0.2,
                             corners: UIRectCorner,
                             offset: CGSize = CGSize(width: 0.0, height: 5.0),
                             radius: CGFloat = 0.0) -> CAShapeLayer {
            
              let shadowLayer = CAShapeLayer()
              shadowLayer.path = UIBezierPath(roundedRect: bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius)).cgPath
              shadowLayer.fillColor = fillColor.cgColor
              shadowLayer.shadowColor = shadowColor.cgColor
              shadowLayer.shadowPath = shadowLayer.path
              shadowLayer.shadowOffset = offset
              shadowLayer.shadowOpacity = opacity
              layer.mask = shadowLayer
              layer.insertSublayer(shadowLayer, at: 0)
              return shadowLayer
           }
      }
  1. 呼叫分机:

    tabBar.makeCornerTabBar(shadowColor: UIColor.lightGray, fillColor: UIColor.white, opacity: 1, corners: [.topLeft, .topRight], offset: CGSize(width: 0, height: 5), radius: 25)