每个屏幕尺寸的中心动画
问题描述:
我在屏幕的中心创建了一个6英寸大小的视图。我怎么能确保比例保持不变,当它适应我们说的iPhone 5s。我不是在谈论自动布局或约束。我在下面添加了动画代码。这是我想要的6英寸尺寸的方式,但是,当我调整iPhone 5s的所有尺寸时,除了动画本身,一切看起来都很好。我怎样才能解决这个问题?每个屏幕尺寸的中心动画
[
iphone 6动画屏幕上述(这是正确的动画和我希望的方式是对其他屏幕尺寸的位置。)
override func viewDidLoad()
super.viewDidLoad() {
circleAnimationView.frame = CGRect(x: 20.0, y: 90.0, width: 300, height: 300)
self.view.addSubview(circleAnimationView)
}
动画代码是对单独的视图 - 控制,那就是:
import UIKit
class CirlceAnimationView: UIView {
var replicatorLayer1 = CAReplicatorLayer()
var dot = CALayer()
// Animation starts running
func animation2() {
// A layer that creates a specified number of copies of its sublayers (the source layer), each copy potentially having geometric, temporal, and color transformations applied to it.
replicatorLayer1 = CAReplicatorLayer()
// The layer’s bounds rectangle. Animatable.
replicatorLayer1.bounds = self.bounds
// The radius to use when drawing rounded corners for the layer’s background. Animatable.
replicatorLayer1.cornerRadius = 10.0
// The background color of the receiver. Animatable.
replicatorLayer1.backgroundColor = UIColor(white: 0.0, alpha: 0.0).cgColor
// The layer’s position in its superlayer’s coordinate space. Animatable.
replicatorLayer1.position = self.center
// calling this method creates an array for that property and adds the specified layer to it.
self.layer.addSublayer(replicatorLayer1)
// connectng the animation to the content
// An object that manages image-based content and allows you to perform animations on that content
dot = CALayer()
// The layer’s bounds rectangle. Animatable.
dot.bounds = CGRect(x: 0.0, y: 0.0, width: 12.0, height: 12.0)
//The layer’s position in its superlayer’s coordinate space. Animatable.
dot.position = CGPoint(x: 150.0, y: 40.0)
//The background color of the receiver. Animatable.
dot.backgroundColor = UIColor(white: 0.2, alpha: 1.0).cgColor
// The color of the layer’s border. Animatable.
dot.borderColor = UIColor(white: 1.0, alpha: 1.0).cgColor
// The width of the layer’s border. Animatable.
dot.borderWidth = 1.0
//The radius to use when drawing rounded corners for the layer’s background. Animatable.
dot.cornerRadius = 5.0
//Appends the layer to the layer’s list of sublayers.
replicatorLayer1.addSublayer(dot)
// number of copies of layer is instanceCount
let nrDots: Int = 1000
//The number of copies to create, including the source layers.
replicatorLayer1.instanceCount = nrDots
// The basic type for floating-point scalar values in Core Graphics and related frameworks.
let angle = CGFloat(2*M_PI)/CGFloat(nrDots)
// The transform matrix applied to the previous instance to produce the current instance. Animatable.
replicatorLayer1.instanceTransform = CATransform3DMakeRotation(angle, 0.0, 0.0, 1.0)
// Type used to represent elapsed time in seconds.
let duration: CFTimeInterval = 10.0
// animation capabilities for a layer property.
// An object that provides basic, single-keyframe animation capabilities for a layer property.
let shrink = CABasicAnimation(keyPath: "transform.scale")
// Defines the value the receiver uses to start interpolation.
shrink.fromValue = 1.0
// Defines the value the receiver uses to end interpolation.
shrink.toValue = 0.1
// Specifies the basic duration of the animation, in seconds.
shrink.duration = duration
// Determines the number of times the animation will repeat.
shrink.repeatCount = Float.infinity
// Add the specified animation object to the layer’s render tree.
dot.add(shrink, forKey: "shrink")
// Specifies the delay, in seconds, between replicated copies. Animatable.
replicatorLayer1.instanceDelay = duration/Double(nrDots)
// The transform applied to the layer’s contents. Animatable.
dot.transform = CATransform3DMakeScale(0.01, 0.01, 0.01)
}
}
答
声明为装置的宽度的变量:
var DEVICE_WIDTH = ""
然后在viewDidLoad中:
let screenSize: CGRect = UIScreen.main.bounds
let screenWidth = screenSize.width
print(screenWidth)
// Detect the screen width (format purpose)
switch screenWidth {
case 320.0:
DEVICE_WIDTH = "320"
case 375.0:
DEVICE_WIDTH = "375"
case 414.0:
DEVICE_WIDTH = "414"
default: //320.0
DEVICE_WIDTH = "320"
}
然后在viewDidAppear:
switch DEVICE_WIDTH {
case "375": // 4/5
// according to your need
circleAnimationView.frame = CGRect(x: 20.0, y: 90.0, width: 250, height: 250)
case "414": //6
circleAnimationView.frame = CGRect(x: 20.0, y: 90.0, width: 300, height: 300)
default: //6+ (414)
// according to your need
circleAnimationView.frame = CGRect(x: 20.0, y: 90.0, width: 350, height: 350)
}
答
circleAnimationView.frame = CGRect(x: 20.0, y: 90.0, width: 300, height: 300)
而不是硬对这些数字进行编码,根据superview界限进行计算。
(但是,这将是更好的使用自动布局来定位圆动画视图。)
+0
感谢您的帮助。什么是最好的方式去使用自动布局来解决这个问题?我怎样才能让动画成为图像视图和设置布局? –
看到这个http://stackoverflow.com/questions/11251988/how-to-center-a-subview-of-uiview –