每个屏幕尺寸的中心动画

问题描述:

我在屏幕的中心创建了一个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) 
    } 
} 
+0

看到这个http://stackoverflow.com/questions/11251988/how-to-center-a-subview-of-uiview –

声明为装置的宽度的变量:

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

感谢您的帮助。什么是最好的方式去使用自动布局来解决这个问题?我怎样才能让动画成为图像视图和设置布局? –