歡迎加入QQ討論群258996829

Swift 菜單動畫效果 SDiffuseMenu

發(fā)布時間:2017-01-19 11:39  回復(fù):0  查看:5213  感興趣:34  贊:1   最后回復(fù):2017-01-19 11:39  

SDiffuseMenu: Swift版AwesomeMenu, 點(diǎn)擊菜單后選項(xiàng)按鈕四散的動畫效果。OC版本點(diǎn)擊這里。

實(shí)際效果如下:

Swift 菜單動畫效果 SDiffuseMenu

一、使用方法如下:

添加協(xié)議(動畫狀態(tài)回調(diào)) -> 設(shè)置選項(xiàng)數(shù)組 -> 設(shè)置菜單按鈕 -> 動畫屬性配置 -> .addSubview(menu)

1、添加協(xié)議

class ViewController: UIViewController, SDiffuseMenuDelegate {
    var menu: SDiffuseMenu!
}

2、設(shè)置菜單的選項(xiàng)按鈕數(shù)據(jù)

guard let storyMenuItemImage            =  UIImage(named:"menuitem-normal.png")         else { fatalError("圖片加載失敗") }
guard let storyMenuItemImagePressed     =  UIImage(named:"menuitem-highlighted.png")    else { fatalError("圖片加載失敗") }
guard let starImage                     =  UIImage(named:"star.png")                    else { fatalError("圖片加載失敗") }
guard let starItemNormalImage           =  UIImage(named:"addbutton-normal.png")        else { fatalError("圖片加載失敗") }
guard let starItemLightedImage          =  UIImage(named:"addbutton-highlighted.png")   else { fatalError("圖片加載失敗") }
guard let starItemContentImage          =  UIImage(named:"plus-normal.png")             else { fatalError("圖片加載失敗") }
guard let starItemContentLightedImage   =  UIImage(named:"plus-highlighted.png")        else { fatalError("圖片加載失敗") }

var menus = [SDiffuseMenuItem]()
for _ in 0 ..< 9 {
    let starMenuItem =  SDiffuseMenuItem(image: storyMenuItemImage,
                                         highlightedImage: storyMenuItemImagePressed, contentImage: starImage,
                                         highlightedContentImage: nil)
    menus.append(starMenuItem)
}

3、設(shè)置菜單按鈕

let startItem = SDiffuseMenuItem(image: starItemNormalImage,
                                 highlightedImage: starItemLightedImage,
                                 contentImage: starItemContentImage,
                                 highlightedContentImage: starItemContentLightedImage)

4、添加SDiffuseMenu

let menuRect = CGRect.init(x: self.menuView.bounds.size.width/2,
                           y: self.menuView.bounds.size.width/2,
                           width: self.menuView.bounds.size.width,
                           height: self.menuView.bounds.size.width)
menu =  SDiffuseMenu(frame:menuRect, startItem:startItem,
                         menusArray:menus as NSArray)
menu.center = self.menuView.center
menu.delegate = self
self.menuView.addSubview(menu)

5、動畫配置

動畫中半徑的變化:0--> 最大farRadius--> 最小nearRadius--> 結(jié)束endRadius

// 動畫時長
menu.animationDuration  = CFTimeInterval(animationDrationValue.text!)
// 最小半徑
menu.nearRadius         = CGFloat((nearRadiusValue.text! as NSString).floatValue)
// 結(jié)束半徑
menu.endRadius          = CGFloat((endRadiusValue.text! as NSString).floatValue)
// 最大半徑
menu.farRadius          = CGFloat((farRadiusValue.text! as NSString).floatValue)
// 單個動畫間隔時間
menu.timeOffset         = CFTimeInterval(timeOffSetValue.text!)!
// 整體角度
menu.menuWholeAngle     = CGFloat((menuWholeAngleValue.text! as NSString).floatValue)
// 整體偏移角度
menu.rotateAngle        = CGFloat(0.0)
// 展開時自旋角度
menu.expandRotation     = CGFloat(M_PI)
// 結(jié)束時自旋角度
menu.closeRotation      = CGFloat(M_PI * 2)
// 是否旋轉(zhuǎn)菜單按鈕
menu.rotateAddButton    = rotateAddButton.isOn
// 菜單按鈕旋轉(zhuǎn)角度
menu.rotateAddButtonAngle = CGFloat((rotateAddButtonAngleValue.text! as NSString).floatValue)
// ..

6、動畫過程監(jiān)聽

func SDiffuseMenuDidSelectMenuItem(_ menu: SDiffuseMenu, didSelectIndex index: Int) {
    print("選中按鈕at index:\(index) is: \(menu.menuItemAtIndex(index)) ")
}

func SDiffuseMenuDidClose(_ menu: SDiffuseMenu) {
    print("菜單關(guān)閉動畫結(jié)束")
}

func SDiffuseMenuDidOpen(_ menu: SDiffuseMenu) {
    print("菜單展開動畫結(jié)束")
}

func SDiffuseMenuWillOpen(_ menu: SDiffuseMenu) {
    print("菜單將要展開")
}

func SDiffuseMenuWillClose(_ menu: SDiffuseMenu) {
    print("菜單將要關(guān)閉")
}


相關(guān)開源代碼

您還未登錄,請先登錄

熱門帖子

最新帖子

?