摘要:小贼音乐的最终效果如下在中,我们完成了一个简易版本的,能够通过扫描人脸进行播放歌曲的音乐播放器。不过暂时我只选取了四个表情进行识别,分别是其余表情,个人感觉放在音乐中,不是特别合适然后,我们在中,添加一个,放到当前底部。
小贼音乐的最终效果如下:
在step2中,我们完成了一个简易版本的,能够通过扫描人脸进行播放歌曲的音乐播放器。在前面我们也提到了,一登默认的权限,并没有获取表情的功能,幸运的是,本人申请得到了这个高级权限(一登的负责的哥们儿还是挺好说话的,哈哈,可以尝试申请弄个权限来玩玩,题外话,高级功能中,本人的颜值只有0.3,满分是1,o(╯□╰)o)。
所以,现在有表情识别的权限了,当然想把它做得更好一些了。不过暂时我只选取了四个表情进行识别,分别是:
Happy
Sad
Calm
Angry
其余表情,个人感觉放在音乐中,不是特别合适.然后,我们在storyboard中,添加一个view,放到当前viewController底部。是一个固定高度120的view,再添加几个表情,最终效果图如下:
注意,底部的表情,使用的是autolayout的等距离约束,如果不了解的话,可以看这篇blog,到我的github山,可以下载这些表情图片,顺便说一下,表情都是使用sketch简单的制作,颜值不是很高。
然后新建一个MoodUIView类,继承UIView,将最底下view对应的类改为MoodUIView,绑定MoodUIView到viewController中,并且增添一个swipeHandler方法,来处理上下滑动手势。
/** 上下滑动处理函数 :param: sender 滑动手势 */ func swipeHandler(sender : UISwipeGestureRecognizer){ var frameY = self.view.frame.height if sender.direction == .Up{ let h = frameY - self.moodView.center.y if h < 0 { UIView.animateWithDuration(2, delay: 0, usingSpringWithDamping: 0.3, initialSpringVelocity: 20, options: UIViewAnimationOptions.CurveEaseInOut, animations: { () -> Void in self.moodView.center.y -= 120 }, completion: { (ok) -> Void in }) } } if sender.direction == .Down{ let h = frameY - self.moodView.center.y if h > 0 { UIView.animateWithDuration( 0.3 , delay: 0, options: UIViewAnimationOptions.CurveEaseInOut, animations: { () -> Void in self.moodView.center.y += 120 }, completion: { (ok) -> Void in }) } } }
然后,在viewDidLoad中添加:
//添加Swipgesture var up = UISwipeGestureRecognizer(target: self, action: "swipeHandler:") var down = UISwipeGestureRecognizer(target: self, action: "swipeHandler:") up.direction = .Up down.direction = .Down self.view.addGestureRecognizer(up) self.view.addGestureRecognizer(down)
运行后,可以看到上下滑动的手势操作效果。
在main.storyboard中,给每个表情图标和对应的label,添加一个不带透明的button,用来响应点击事件。这里的点击事件,就是用户,手动选择更换频道。添加方法:
/** 用户主动点击表情,切换频道的处理函数 :param: sender 标识点击的表情 */ @IBAction func moodViewTapped(sender : UIButton){ //通过UIImageView的tag进行标示,可以在storyboard对应的utility的attribute inspector中设置 switch sender.tag{ case 0: emotion = Emotion.happy case 1: emotion = Emotion.sad case 2: emotion = Emotion.calm default: emotion = Emotion.angry } updateMoodView() UIView.animateWithDuration( 0.3 , delay: 0.2, options: UIViewAnimationOptions.CurveEaseInOut, animations: { () -> Void in self.moodView.center.y += 120 }, completion: { (ok) -> Void in }) http.onSearch(emotion.rawValue) }
接下来,需要增加一个pan gesture,初定的功能是,向左pan切换歌曲,向右暂停。
// MARK: - Pan gesture /** control view 拖动手势处理函数 :param: sender */ func drag(sender : UIPanGestureRecognizer){ let xDistance:CGFloat = sender.translationInView(self.view).x let yDistance:CGFloat = sender.translationInView(self.view).y switch sender.state{ case UIGestureRecognizerState.Began: println("begin") case UIGestureRecognizerState.Changed: self.controlView.center.x = originalPoint.x + xDistance var nowX = self.controlView.center.x //展示下一首 label if nowX <= originalPoint.x - 120 { self.nextLabel.hidden = false }else{ self.nextLabel.hidden = true } //展示暂停 label if nowX >= originalPoint.x + 120{ self.pauseLabel.hidden = false }else{ self.pauseLabel.hidden = true } case UIGestureRecognizerState.Ended: var nowX = self.controlView.center.x self.nextLabel.hidden = true //需要切换歌曲 if nowX <= originalPoint.x - 120{ self.nextLabel.hidden = true self.playerDidFinishPlaying() UIView.animateWithDuration( 0.3 , delay: 0, options: UIViewAnimationOptions.CurveEaseInOut, animations: { () -> Void in self.controlView.center.x = self.originalPoint.x }, completion: nil) } //需要暂停 else if nowX >= originalPoint.x + 120{ self.circularProgressView.pause() UIView.animateWithDuration( 0.3 , delay: 0, options: UIViewAnimationOptions.CurveEaseInOut, animations: { () -> Void in self.controlView.center.x = self.view.frame.width }, completion: nil) }else{ self.circularProgressView.play() UIView.animateWithDuration( 0.3 , delay: 0, options: UIViewAnimationOptions.CurveEaseInOut, animations: { () -> Void in self.controlView.center.x = self.originalPoint.x }, completion: nil) } default: println("default") } }
还有部分操作,不过可以查看源码,获取详情。
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/15725.html
摘要:如果不了解,可以去了解一下,简单的说,就是手势识别,这个是专门用来识别长按屏幕这个手势操作的,是苹果官方提供的手势识别,当然你也可以自己写自己的手势,不过我们暂时使用这个手势就足够了。 小贼音乐的最终效果如下: showImg(https://raw.githubusercontent.com/ZHONGHuanGit/ZHEmotionMusic/master/zhEmotion...
摘要:并且把中的我的歌声里这首歌添加进我们的项目。记录当前播放歌曲在内的位置。负责处理从网络上获取的数据获取得到的数据数据成功接收更新界面的操作,放在主线程,提高反应速度同时不要忘记修改其它地方,将切换歌曲或者播放歌曲,都放在中,修改。 小贼音乐的最终效果如下: showImg(https://raw.githubusercontent.com/ZHONGHuanGit/ZHEmotion...
摘要:电影豆瓣电影豆瓣电影支持电影条目,影人条目,搜索和榜单等。音乐豆瓣音乐支持音乐信息,评论信息,标签信息,搜索音乐,某个音乐中标记最多的标签,发表修改删除评论,用户对音乐的所有标签等内容。 项目地址:https://github.com/marktony/A... 本页仅收集国内部分官方API,如需查看其他版本,请点击这里。 目录 笔记 出行 词典 电商 地图 电影 即时通讯 开发者网...
摘要:电影豆瓣电影豆瓣电影支持电影条目,影人条目,搜索和榜单等。音乐豆瓣音乐支持音乐信息,评论信息,标签信息,搜索音乐,某个音乐中标记最多的标签,发表修改删除评论,用户对音乐的所有标签等内容。 项目地址:https://github.com/marktony/A... 本页仅收集国内部分官方API,如需查看其他版本,请点击这里。 目录 笔记 出行 词典 电商 地图 电影 即时通讯 开发者网...
摘要:电影豆瓣电影豆瓣电影支持电影条目,影人条目,搜索和榜单等。音乐豆瓣音乐支持音乐信息,评论信息,标签信息,搜索音乐,某个音乐中标记最多的标签,发表修改删除评论,用户对音乐的所有标签等内容。 项目地址:https://github.com/marktony/A... 本页仅收集国内部分官方API,如需查看其他版本,请点击这里。 目录 笔记 出行 词典 电商 地图 电影 即时通讯 开发者网...
阅读 1095·2021-11-17 09:33
阅读 2279·2021-10-08 10:17
阅读 678·2021-10-08 10:04
阅读 1630·2021-09-06 15:02
阅读 2420·2019-08-29 17:30
阅读 2553·2019-08-29 13:24
阅读 1373·2019-08-29 11:12
阅读 3235·2019-08-28 17:52