swift ios 平移動畫(8種方式)
1.前言
2.實戰
準備工作:
我們添加了一個紅色的uiview圓和一個藍色的calyaer圓,給螢幕添加了點選事件。
enum AniType: Int {
case ViewCenterNone
case ViewCenterAni
case Block
case Spring
case LayerNone
case CABasic
case Display
case Snap
}
var currentType:AniType? //當前動畫的型別,因為我們要用多種方式實現
var circleView:UIView? //UIView 紅色的圓 用於動畫
var layer:CALayer? // CALayer 藍色的圓 用於動畫
var dynamicAnimator:UIDynamicAnimator?
override func viewDidLoad() {
super.viewDidLoad ()
currentType = .Snap
dynamicAnimator = UIDynamicAnimator()
addView()
addLayer()
addOptionsBtn()
addTapGesture()
}
//新增 UIView 的圓
func addView(){
circleView = UIView(frame: CGRectMake(0,0,50,50))
self.view.addSubview(circleView!)
circleView!.backgroundColor = UIColor.redColor()
circleView?.layer.cornerRadius = 25
circleView?.center = CGPoint(x: 30,y: 60)
}
//新增 Layer 的圓
func addLayer(){
layer = CALayer()
layer?.bounds = CGRectMake(0, 0, 50, 50)
layer?.cornerRadius = 25
layer?.position = CGPoint(x: 30 ,y: 30)
layer?.backgroundColor = UIColor.blueColor().CGColor
self.view.layer.addSublayer(layer!)
}
//給主屏新增點選事件
func addTapGesture(){
let tap = UITapGestureRecognizer(target: self, action: "onTap:")
tap.numberOfTapsRequired = 1
tap.numberOfTouchesRequired = 1
self.view.addGestureRecognizer(tap)
}
//根據動畫型別匹配動畫
func onTap(tap:UITapGestureRecognizer){
let local = tap.locationInView(self.view)
switch(currentType!){
case .ViewCenterNone:
translationTypeViewCenterNone(local)
case .ViewCenterAni:
translationTypeViewCenterAni(local)
case .Block:
translationTypeBlock(local)
case .Spring:
translationTypeSpring(local)
case .LayerNone:
layerTypeNone(local)
case .CABasic:
layerTypeCABasic(local)
case .Display:
TypeDispaly(local)
case .Snap:
dynamicSnap(local)
default:break
}
}
func addOptionsBtn(){
let btn = UIButton(frame: CGRectMake(0,0,100,60))
btn.setTitle("動畫方式", forState: .Normal)
btn.setTitleColor(UIColor.redColor(), forState: .Normal)
btn.addTarget(self, action: "onClick", forControlEvents: .TouchUpInside)
self.view.addSubview(btn)
btn.center = CGPoint(x: UIScreen.mainScreen().bounds.width - 60 , y: UIScreen.mainScreen().bounds.width - 60)
}
func onClick(){
showOptions()
}
//其他效果選項
func showOptions(){
let actionSheet = UIActionSheet()
actionSheet.addButtonWithTitle("UIView無動畫")
actionSheet.addButtonWithTitle("UIview有動畫")
actionSheet.addButtonWithTitle("UIview.animate")
actionSheet.addButtonWithTitle("彈簧動畫")
actionSheet.addButtonWithTitle("Layer實現")
actionSheet.addButtonWithTitle("CABasic")
actionSheet.addButtonWithTitle("逐幀動畫")
actionSheet.addButtonWithTitle("UIDynamicAnimator")
actionSheet.delegate = self
actionSheet.showInView(self.view)
}
func actionSheet(actionSheet: UIActionSheet, clickedButtonAtIndex buttonIndex: Int) {
switch(buttonIndex){
case 0:
currentType = .ViewCenterNone
case 1:
currentType = .ViewCenterAni
case 2:
currentType = .Block
case 3:
currentType = .Spring
case 4:
currentType = .LayerNone
case 5:
currentType = .CABasic
case 6:
currentType = .Display
case 7:
currentType = .Snap
default:
break
}
}
1.直接改變UIView.center:
定義了一個ViewCenterNone型別,只改變UIview的center,可以看到紅色uiview移動但是沒有動畫效果。
func translationTypeViewCenterNone(local:CGPoint){
self.circleView?.center = local
}
2.直接改變UIView.center 加動畫效果:
定義了一個ViewCenterNone型別,只改變UIview的center,可以看到紅色uiview移動但是沒有動畫效果。
//移動UIview 有動畫效果
func translationTypeViewCenterAni(local:CGPoint){
UIView.beginAnimations(nil, context: nil)
UIView.setAnimationDuration(1.0)
self.circleView?.center = local
UIView.commitAnimations()
}
2.animateWithDuration:
UIView的動畫封裝
//UIView.animate 封裝的動畫
func translationTypeBlock(local:CGPoint){
UIView.animateWithDuration(1.0, animations: { () -> Void in
self.circleView?.center = local
}) { (finished) -> Void in
print("finished")
}
}
4.animateWithDuration 彈簧效果:
UIView的動畫封裝 加兩個引數
①usingSpringWithDamping 阻尼係數 越小彈性越大
②initialSpringVelocity 初始速度 值越大速度越大
//UIView Spring 彈簧動畫
//usingSpringWithDamping 阻尼係數 越小彈性越大
//initialSpringVelocity 初始速度
func translationTypeSpring(local:CGPoint){
UIView.animateWithDuration(5 , delay: 0, usingSpringWithDamping: 0.43, initialSpringVelocity: 5, options: .CurveEaseOut ,animations: { () -> Void in
self.circleView?.center = local
}) { (finished) -> Void in
print("end")
}
}
5.直接改變layer的position:
通過改變layer的position可以改變位置,但是對於CALayer和UIVIew是有區別的。
①CAlyaer當改變position時,會有一個平滑過渡的動畫效果。因為它的屬性是隱式動畫的。也就是說會預設開啟動畫效果。
②UIview的layer改變position時卻沒有動畫效果。這是因為UIview的根Layer是不會產生動畫效果的。
//通過layer改變位置
func layerTypeNone(local:CGPoint){
self.layer?.position = local // 藍色的圓是有動畫效果的
self.circleView?.layer.position = local //紅色的圓是沒有動畫效果的
}
6.CABasicAnimation 改變layer的屬性:
//CABasicAnimation 改變layer的屬性
func layerTypeCABasic(local:CGPoint){
let basicAni = CABasicAnimation(keyPath: "position") // 用position屬性 來表示是位移動畫
basicAni.toValue = NSValue(CGPoint: local)
basicAni.duration = 1.0//動畫時間5秒
layer?.addAnimation(basicAni, forKey: "")
}
7.CADisplayLink :
CADisplayLink是ios中的逐幀動畫 重新整理頻率是60次/秒,和系統的螢幕重新整理頻率相同,所以看上去會比較流暢。當螢幕重新整理的時候會呼叫selector中的方法。
//建立CADisplayLink
var displaylink:CADisplayLink?
func TypeDispaly(local:CGPoint){
displaylink = CADisplayLink(target: self, selector: "onDisplayLink")
displaylink!.addToRunLoop(NSRunLoop.mainRunLoop(), forMode: NSDefaultRunLoopMode)
}
//向下移動
func onDisplayLink(){
circleView?.layer.position.y++
if circleView?.layer.position.y == self.view.frame.height - 30{
displaylink?.paused = true
}
}
8.UIDynamicAnimator :
UIDynamicAnimator物理學相關的動畫方式。看起來會比較自然。
//吸附動畫
func dynamicSnap(local:CGPoint){
let snapBehavior = UISnapBehavior(item: circleView!, snapToPoint: local)//吸附動畫 引數①要產生動畫的view②被吸附到點
snapBehavior.damping = 0.9
dynamicAnimator?.removeAllBehaviors()
dynamicAnimator?.addBehavior(snapBehavior)//dynamicAnimator物理學動畫的執行者
}
3.總結
相關推薦
swift ios 平移動畫(8種方式)
1.前言 2.實戰 準備工作: 我們添加了一個紅色的uiview圓和一個藍色的calyaer圓,給螢幕添加了點選事件。 enum AniType: Int { case ViewCenterNone
IOS中訊息傳遞的8種方式
原創Blog,轉載請註明出處 一 MVC簡介 MVC是將應用中的類組織起來的一種策略。是IOS開發最常用的設計模式,當然,還有諸如MVVM,VIPER等模式,不過不在本文的討論範疇。 MVC代表什麼:Model-View-Controller。 Model:應用是什麼(w
並發體驗:Python抓圖的8種方式
splash 意圖 HR wrapper with os.path mon pri AD 本文是通過用爬蟲示例來說明並發相關的多線程、多進程、協程之間的執行效率對比。 假設我們現在要在網上下載圖片,一個簡單的方法是用 requests+BeautifulSoup。註:本文
iOS-撥打電話三種方式(修改後)
1,這種方法,不彈出提示,直接撥打,打完電話後還會回到原來的程式 NSMutableString *str=[[NSMutableString alloc] initWithFormat:@"tel:%@",@"1575539xxxx"]; [[UIApplication sharedA
程序間通訊的8種方式
前言: 程序通訊: 每個程序各自有不同的使用者地址空間,任何一個程序的全域性變數在另一個程序中都看不到,所以程序之間要交換資料必須通過核心,在核心中開闢一塊緩衝區,程序A把資料從使用者空間拷到核心緩衝區,程序B再從核心緩衝區把資料讀走,核心提供的這種機制稱為程序間通訊。
css 清楚浮動的8種方式
<iframe id="cproIframe_u811641_2" height="250" marginheight="0" src="http://pos.baidu.com/acom?adn=3&at=103&aurl=&cad=1&
iOS 撥打電話三種方式
1,這種方法,撥打完電話回不到原來的應用,會停留在通訊錄裡,而且是直接撥打,不彈出提示NSMutableString * str=[[NSMutableString alloc] initWithFo
【java基礎:JDBC】基於DBUtils工具類查詢資料庫的8種方式!非常重要!
package cn.itcast.demo2; import java.sql.Connection; import java.sql.SQLException; import java.util.List; import java.util.Map; import
iOS 撥打電話四種方式總結(推薦最後一種)
方法一:不彈出提示直接撥打 NSMutableString *str=[[NSMutableStringalloc]initWithFormat:@"tel:%@",@"電話號碼"]; [[UIApplication sharedApplication] openUR
iOS儲存的幾種方式
1.寫檔案 NSData *dat = [[NSDataalloc]initWithContentsOfURL:[NSURLURLWithString:imageUrl]]; NSString *fullPath = [[NSHomeDirectory() strin
HTML5實現動畫三種方式
編者注:作者以一個運動的小車為例子,講述了三種實現HTML5動畫的方式,思路清晰,動畫不僅僅是,還有CSS3和.通過合理的選擇,來實現最優的實現。 PS:由於顯示卡、錄製的幀間隔,以及可能你電腦處理器的原因,播放過程可能有些不太流暢或者失真! 分三
WebDriver--定位元素的8種方式
在UI層面的自動化測試開發中,元素的定位與操作是基礎,也是經常遇到的困難所在。webdriver提供了8種定位:1. id定位:find_element_by_id("id值");id屬性是唯一的1 driver.find_element_by_id("loginName")
【shell指令碼】字串擷取的8種方式
在編寫配置指令碼時,經常會用到字串的切割,所以,shell提供了8種字串的切割方式 我們定義一個變數a=test.c.sh。接下來對它進行切割,直接在命令列演示: 1. # 號擷取,刪除左邊字元,保留
死磕 java執行緒系列之建立執行緒的8種方式
問題 (1)建立執行緒有哪幾種方式? (2)它們分別有什麼運用場景? 簡介 建立執行緒,是多執行緒程式設計中最基本的操作,彤哥總結了一下,大概有8種建立執行緒的方式,你知道嗎? 繼承Thread類並重寫run()方法 public class CreatingThread01 extends Thread
ios-Swift中解除迴圈引用的三種方式
1、加一個標記,表示裡面用到的self都是弱引用 test4 {[weak self] (name)->() in //self?表示如果物件一旦被
iOS 簡單動畫效果實現的三種方式
【在ios開發中,動畫是廉價的】 一、首尾式動畫 程式碼示例: // beginAnimations表示此後的程式碼要“參與到”動畫中 [UIView beginAnimations:nil context:nil]; //設定動畫時長
iOS 旋轉動畫的幾種實現方式
第一種:使用CABasicAnimated方法 這種方法是最簡單的方法 CABasicAnimation *animation = [CABasicAnimation animationWithKe
Cocos2d-x3.3beta0創建動畫的3種方式
sprintf action frame idt adding instance 修改 name 工具 1、單獨載入精靈對象 渲染效率低,浪費資源,不推薦用該方法。代碼例如以下:註:代碼僅僅需貼到HelloWorldScene.cpp中就可以。 //First,單獨渲染
七夕攻略丨中國單身達2億?8種高端創意的告白方式,到底要不要收藏呢?
活動 人才 是不是 收藏 img nbsp image main 優勢 “很絕望,找不到對象還影響經濟發展” “嗯?女朋友?是手機不好玩,還是遊戲不夠看?” “我,七夕,告白,懂?” 本以為七夕快到了 世界都是撒狗糧的人 沒想到,調皮的某媒公布出這一結果後 世界人民都不
CSS3實現動畫的兩種方式
logs del pin 屬性 cnblogs ase http eve 括號 1、設置transition設置過渡,添加transform設置形狀,形成動畫效果,如下: .divadd { transition: All 0.4s ease-in-out;