2017-01-07 12 views
0

私はこのプロジェクトを持っていますSwiftySwitch正確なコーナー半径でUIView.animate()でUIViewを拡大するにはどうすればいいですか?

私の目標は、アニメーションのそれぞれの特定の瞬間の現在の円の高さよりも大きなコーナーの半径を持つ代わりに、サークルを拡大して円の形を維持しないようにすることです。

成長しているサークルを扱うこのコードはここにある:私はRIGHT HERE言う

func turnOn() { 
    let tempView = UIView(frame: CGRect(x: ballDiameter/2, y: ballDiameter/2, width: 0, height: 0)) 
    tempView.backgroundColor = onColor 
    tempView.layer.cornerRadius = ballDiameter/2 
    self.addSubview(tempView) 

    UIView.animate(withDuration: dotTravelTime, animations: { [weak self] in 

     //RIGHT HERE is the code for the circle to hold it's circular form 
     if self != nil { 
      tempView.frame = CGRect(x: 0, y: 0, width: self!.ballDiameter, height: self!.ballDiameter) 
      tempView.layer.cornerRadius = self!.ballDiameter/2 
     } 
     self?.layoutIfNeeded() 

    }) { [weak self] _ in 
     self?.backgroundColor = self!.onColor 
     tempView.removeFromSuperview() 
    } 
} 

func turnOff() { 
    let tempView = UIView(frame: CGRect(x: 0, y: 0, width: ballDiameter, height: ballDiameter)) 
    tempView.backgroundColor = onColor 
    self.addSubview(tempView) 
    self.backgroundColor = offColor 

    UIView.animate(withDuration: dotTravelTime, animations: { [weak self] in 

     //RIGHT HERE is the code for the circle to hold it's circular form 
     if self != nil { 
      tempView.frame = CGRect(x: self!.ballDiameter/2, y: self!.ballDiameter/2, width: 0, height: 0) 
      tempView.layer.cornerRadius = self!.ballDiameter/2 
     } 
     self?.layoutIfNeeded() 

    }) { _ in 
     tempView.removeFromSuperview() 
    } 
} 

私はサークルのアニメーションを取り扱う場所です。 temp UIViewを使ってアニメーションを処理し、実際のビューの色を変更した後にビューを削除します。 tempViewは、スライドアニメーションで変更されることがわかる円のスイッチです。私のデザインに関する情報が必要な場合は、私に知らせてください。私はたくさんのことを試しました。そして、すべてのものは、円が正方形であるか、または私が望むよりもわずかに大きなコーナー半径を持つように解決されました。 (私はそれが元のサイズから、いくつかの角の半径を縮小していると思いますが、それは軽微であります。

+0

フレームサイズを変更する代わりに自動レイアウトを試しましたか? – dfd

+0

Autolayoutはさらに悪化するでしょう。 @dfd – Sethmr

+1

@Mattは非常に良いです。彼はあなたに良い答えをくれたことをうれしく思います。 – dfd

答えて

2

私の目標は、円が拡大し、円の形

その後ドンを維持し損なうようにすることです「ばか」の方法で円を描く(cornerRadius)マスク(円形パス)をマスクしてマスク(および/またはパス)の成長/縮小をアニメーション化する

この例では、そのアニメーションは意図的に遅く(2秒間)、スムーズに動作することがわかります。左上のラベルと右下のラベルは、(1)ビューであり、(2)コヒーレントに成長することがわかります。

enter image description here

+0

私はアニメーションを初めてやっています....スケッチでイメージを作るのではなく、単純なイメージとビューをプログラムで作成するのが好きな場所に移行しました。厳しい批判の笑でちょうど私にいくつかの時間を与えてください! – Sethmr

+0

私たちのサーバーはすべて稼働していないので、私はあなたの本を読んでいます。このすべての材料をありがとう! – Sethmr

+0

@Sethmrあなたの質問は本を変更しました!それは私にこの例を追加するよう促しました:https://github.com/mattneub/Programming-iOS-Book-Examples/blob/master/bk2ch04p130viewAnimationWithMask/MaskViewTest/ViewController.swift – matt

1

コーナー半径のCALayerとしないのUIViewの特性です。残念ながら、UIView Animationメソッドは、UIView関連のプロパティのキー値の変更のみを取得します。レイヤプロパティを別々にアニメートすることはできますが、代わりにCABasicAnimationを使用する必要があります。代わりに、drawRectを実装し、コーナー半径を使用する代わりにUIBezierPathを使用して円を描画することもできます。

関連する問題