自己实现的一个底部控件
监听MKWebView的滚动事件，上滑动消失，下滑动出现。同时用blur效果和FontAwesome图标结合在一起，动画方面用的facebook开源pop库。还算漂亮。下面是效果图：
import UIKit
import FontAwesome_swift
import pop
class BottomBarView: UIView {
private let horizontalPadding: CGFloat = 0.0
private var rightBtnContainerView: UIView!
private var leftBtnContainerView: UIView!
private var commentBtn:UIButton!
private var likeBtn:UIButton!
private var shareBtn:UIButton!
private var returnBtn:UIButton!
private var btnWidthHeight:CGFloat!
private var rightContainerWidth:CGFloat!
//Button回调方法
typealias fuckBlock = () ->()
var returnButtonBlock:fuckBlock!
var commentButtonBlock:fuckBlock!
var likeButtonBlock:fuckBlock!
var shareButtonBlock:fuckBlock!
override init(frame: CGRect) {
super.init(frame: frame)
setUpComs()
setUpContainerView()
setUpContainerViewAutoConstraint()
setUpButtons()
addButtonEvents()
}
private func addButtonEvents() {
returnBtn.addTarget(self, action:#selector(BottomBarView.returnBtnPressed), forControlEvents: UIControlEvents.TouchUpInside)
commentBtn.addTarget(self, action:#selector(BottomBarView.commentBtnPressed), forControlEvents: UIControlEvents.TouchUpInside)
likeBtn.addTarget(self, action:#selector(BottomBarView.likeBtnPressed), forControlEvents: UIControlEvents.TouchUpInside)
shareBtn.addTarget(self, action:#selector(BottomBarView.shareBtnPressed), forControlEvents: UIControlEvents.TouchUpInside)
}
func returnBtnPressed(){
if let _ = returnButtonBlock{
UIView.animateWithDuration(0.5, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 0.4, options: UIViewAnimationOptions.Autoreverse, animations: {
self.returnBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(30)
}, completion: { (finally) in
self.returnBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(25)
return self.returnButtonBlock()
})
}
}
func commentBtnPressed(){
if let _ = commentButtonBlock{
UIView.animateWithDuration(0.5, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 0.4, options: UIViewAnimationOptions.Autoreverse, animations: {
self.commentBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(30)
}, completion: { (finally) in
self.commentBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(25)
return self.commentButtonBlock()
})
}
}
func likeBtnPressed(){
UIView.animateWithDuration(1, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 0.8, options: UIViewAnimationOptions.Autoreverse, animations: {
self.likeBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(30)
self.likeBtn.setTitleColor(UIColor.redColor(), forState: UIControlState.Normal)
}, completion: { (finally) in
self.likeBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(25)
// return self.likeButtonBlock()
})
}
func shareBtnPressed(){
if let _ = shareButtonBlock{
UIView.animateWithDuration(0.5, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 0.4, options: UIViewAnimationOptions.Autoreverse, animations: {
self.shareBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(30)
}, completion: { (finally) in
self.shareBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(25)
return self.shareButtonBlock()
})
}
}
private func setUpComs() {
btnWidthHeight = self.bounds.height
rightContainerWidth = btnWidthHeight * 3 + 20.0 //左右pading各10
}
private func setUpContainerView() {
leftBtnContainerView = UIView.init(frame: CGRectMake(0, 0, btnWidthHeight, btnWidthHeight))
leftBtnContainerView.backgroundColor = UIColor.clearColor()
leftBtnContainerView.translatesAutoresizingMaskIntoConstraints = false
self.addSubview(leftBtnContainerView)
//右边3个buttion,左右button padding 10
rightBtnContainerView = UIView.init(frame: CGRectMake(0, 0, rightContainerWidth, btnWidthHeight))
rightBtnContainerView.backgroundColor = UIColor.clearColor()
rightBtnContainerView.translatesAutoresizingMaskIntoConstraints = false
self.addSubview(rightBtnContainerView)
}
private func setUpContainerViewAutoConstraint() {
let views = ["leftView":leftBtnContainerView,"rightView":rightBtnContainerView]
let metrics = ["btnWH": btnWidthHeight]
NSLayoutConstraint.activateConstraints([
NSLayoutConstraint.constraintsWithVisualFormat(
"H:|-15-[leftView(btnWH)]-80@250-[rightView(\(rightContainerWidth))]-15-|", options: [], metrics: metrics, views: views),
NSLayoutConstraint.constraintsWithVisualFormat(
"V:|-0-[leftView]-0-|", options: [], metrics: metrics, views: views),
NSLayoutConstraint.constraintsWithVisualFormat(
"V:|-0-[rightView]-0-|", options: [], metrics: metrics, views: views)
].flatten().map{$0})
}
private func setUpButtons() {
//左排按钮模糊效果
let blurLeftEffectView = UIVisualEffectView(effect: UIBlurEffect(style: UIBlurEffectStyle.Dark))
blurLeftEffectView.frame = leftBtnContainerView.bounds
leftBtnContainerView.addSubview(blurLeftEffectView)
let subLeftEffectView = UIVisualEffectView(effect: UIVibrancyEffect(
forBlurEffect: blurLeftEffectView.effect as! UIBlurEffect))
subLeftEffectView.frame = blurLeftEffectView.bounds
blurLeftEffectView.contentView.addSubview(subLeftEffectView)
returnBtn = UIButton.init(frame: leftBtnContainerView.bounds)
returnBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(25)
returnBtn.titleLabel?.textColor = UIColor.blackColor()
returnBtn.setTitle(String.fontAwesomeIconWithName(.ArrowLeft), forState: .Normal)
subLeftEffectView.contentView.addSubview(returnBtn)
//圆角
self.leftBtnContainerView.layer.cornerRadius = btnWidthHeight/4
self.leftBtnContainerView.layer.masksToBounds = true
//右排按钮添加模糊效果
let blurRightEffectView = UIVisualEffectView(effect: UIBlurEffect(style: UIBlurEffectStyle.Dark))
blurRightEffectView.frame = rightBtnContainerView.bounds
rightBtnContainerView.addSubview(blurRightEffectView)
let subRightEffectView = UIVisualEffectView(effect: UIVibrancyEffect(
forBlurEffect: blurRightEffectView.effect as! UIBlurEffect))
subRightEffectView.frame = blurRightEffectView.bounds
blurRightEffectView.contentView.addSubview(subRightEffectView)
//评论按钮
commentBtn = UIButton.init(frame: CGRectMake(0, 0, btnWidthHeight, btnWidthHeight))
commentBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(25)
commentBtn.titleLabel?.textColor = UIColor.blackColor()
commentBtn.setTitle(String.fontAwesomeIconWithName(.Comments), forState: .Normal)
commentBtn.translatesAutoresizingMaskIntoConstraints = false
subRightEffectView.contentView.addSubview(commentBtn)
//喜欢按钮
likeBtn = UIButton.init(frame: CGRectMake(0, 0, btnWidthHeight, btnWidthHeight))
likeBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(25)
likeBtn.setTitle(String.fontAwesomeIconWithName(.Heart), forState: .Normal)
likeBtn.translatesAutoresizingMaskIntoConstraints = false
subRightEffectView.contentView.addSubview(likeBtn)
//转发按钮
shareBtn = UIButton.init(frame: CGRectMake(0, 0, btnWidthHeight, btnWidthHeight))
shareBtn.titleLabel?.font = UIFont.fontAwesomeOfSize(25)
shareBtn.setTitle(String.fontAwesomeIconWithName(.ShareAlt), forState: .Normal)
shareBtn.translatesAutoresizingMaskIntoConstraints = false
subRightEffectView.contentView.addSubview(shareBtn)
//圆角
self.rightBtnContainerView.layer.cornerRadius = btnWidthHeight/4
self.rightBtnContainerView.layer.masksToBounds = true
//设置右排3个button的auto layout
let views = ["commentBtn":commentBtn,"likeBtn":likeBtn,"shareBtn":shareBtn]
let metrics = ["hp": horizontalPadding,"btnWidth": btnWidthHeight]
NSLayoutConstraint.activateConstraints([
//10@250 优先级设为最低，出现冲突时优先break
NSLayoutConstraint.constraintsWithVisualFormat(
"H:|-10@250-[commentBtn(btnWidth)]-hp-[likeBtn(btnWidth)]-hp-[shareBtn(btnWidth)]-10@250-|", options: [], metrics: metrics, views: views),
NSLayoutConstraint.constraintsWithVisualFormat(
"V:|-0-[likeBtn]-0-|", options: [], metrics: nil, views: views),
NSLayoutConstraint.constraintsWithVisualFormat(
"V:|-0-[commentBtn]-0-|", options: [], metrics: nil, views: views),
NSLayoutConstraint.constraintsWithVisualFormat(
"V:|-0-[shareBtn]-0-|", options: [], metrics: nil, views: views)
].flatten().map{$0})
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
}
}
