Swift 创建无限背景从右向左滚动
我正在尝试创建一个动画来创建一个移动对象的幻觉。因此,对象将保持在相同的位置,但比屏幕宽度更宽的背景图像视图将无限移动。我的代码不是很流畅Swift 创建无限背景从右向左滚动,swift,uiview,uiviewanimation,Swift,Uiview,Uiviewanimation,我正在尝试创建一个动画来创建一个移动对象的幻觉。因此,对象将保持在相同的位置,但比屏幕宽度更宽的背景图像视图将无限移动。我的代码不是很流畅 let backgroundView = UIView() backgroundView.backgroundColor = UIColor.blueColor() backgroundView.frame = CGRect(x: 0, y: 120, width: 50, height: 50) self.view.addS
let backgroundView = UIView()
backgroundView.backgroundColor = UIColor.blueColor()
backgroundView.frame = CGRect(x: 0, y: 120, width: 50, height: 50)
self.view.addSubview(backgroundView)
let options = UIViewAnimationOptions.Repeat | UIViewAnimationOptions.CurveLinear
UIView.animateWithDuration(2.0, delay: 0.0, options: options, animations: {
backgroundView.frame = CGRect(x: 420, y: 120, width: 50, height: 50)
}, completion: nil)
更新答案: 要像您在评论中提到的那样制作动画,一种方法是为背景图像创建一个无缝模式,并在屏幕上移动它。例如,在屏幕上移动image1,跟随image2,将image1移回原始位置,将image2移回原始位置,然后重复。可能有一种更简单的方法来实现这一点,这取决于您实际使用它的目的,但这只是一个示例。我已经为这个例子做了一个例子,请随意使用它
func animateBackground() {
let animationOptions = UIViewAnimationOptions.Repeat | UIViewAnimationOptions.CurveLinear
let backgroundImage = UIImage(named:"backgroundPattern.jpg")!
var amountToKeepImageSquare = backgroundImage.size.height - self.view.frame.size.height
// UIImageView 1
var backgroundImageView1 = UIImageView(image: backgroundImage)
backgroundImageView1.frame = CGRect(x: self.view.frame.origin.x, y: self.view.frame.origin.y, width: backgroundImage.size.width - amountToKeepImageSquare, height: self.view.frame.size.height)
self.view.addSubview(backgroundImageView1)
// UIImageView 2
var backgroundImageView2 = UIImageView(image: backgroundImage)
backgroundImageView2.frame = CGRect(x: backgroundImageView1.frame.size.width, y: self.view.frame.origin.y, width: backgroundImage.size.width - amountToKeepImageSquare, height: self.view.frame.height)
self.view.addSubview(backgroundImageView2)
// Animate background
UIView.animateWithDuration(6.0, delay: 0.0, options: animationOptions, animations: {
backgroundImageView1.frame = CGRectOffset(backgroundImageView1.frame, -1 * backgroundImageView1.frame.size.width, 0.0)
backgroundImageView2.frame = CGRectOffset(backgroundImageView2.frame, -1 * backgroundImageView2.frame.size.width, 0.0)
}, completion: nil)
// Have something in the foreground look like its moving
var square = UIView(frame: CGRect(x: 0, y: 0, width: 50, height: 50))
square.frame.origin = CGPoint(x: self.view.frame.origin.x + 25, y: self.view.frame.size.height - 75)
square.backgroundColor = UIColor.darkGrayColor()
self.view.addSubview(square)
// Animate foreground
UIView.animateWithDuration(0.5, delay: 0, options: animationOptions, animations: {
square.transform = CGAffineTransformMakeRotation(33)
}, completion: nil)
}
您将得到如下动画:
原始答案:
我不完全确定您想要实现什么,但从我收集的信息来看,您希望视图在重复每个动画时不要跳回起始位置。您可以通过将ui视图的起点设置在视图的左侧,终点设置在视图的右侧来实现这一点
func animateSquare() {
// Create our square with size of 50x50
var square = UIView(frame: CGRect(x: 0, y: self.view.frame.height / 2, width: 50, height: 50))
// Set its origin just off the left of the screen so it is not visible
square.frame.origin = CGPoint(x: 0 - square.frame.size.width, y: self.view.frame.height / 2)
square.backgroundColor = UIColor.blackColor()
self.view.addSubview(square)
// Setup animation and repeat
let animationOptions = UIViewAnimationOptions.Repeat | UIViewAnimationOptions.CurveLinear
UIView.animateWithDuration(2.0, delay: 0, options: animationOptions, animations: {
// Offset our square's frame by the width of the view + the width of the square
// This way it moves off the screen to the right completely
square.frame = CGRectOffset(square.frame, self.view.frame.width + square.frame.width, 0.0)
}, completion: nil)
}
您将得到如下动画:
对于Swift 5.0+,请使用以下功能
func animateBackground()
{
let backgroundImage = UIImage(named:"bgImage")!
// UIImageView 1
let backgroundImageView1 = UIImageView(image: backgroundImage)
backgroundImageView1.frame = CGRect(x: self.view.frame.origin.x, y: self.view.frame.origin.y, width: self.view.frame.size.width, height: self.view.frame.size.height)
backgroundImageView1.contentMode = .scaleAspectFit
self.view.addSubview(backgroundImageView1)
// UIImageView 2
let backgroundImageView2 = UIImageView(image: backgroundImage)
backgroundImageView2.frame = CGRect(x: self.view.frame.size.width, y: self.view.frame.origin.y, width: self.view.frame.size.width, height: self.view.frame.height)
backgroundImageView2.contentMode = .scaleAspectFit
self.view.addSubview(backgroundImageView2)
// Animate background
UIView.animate(withDuration: 6.0, delay: 0.0, options: [.repeat, .curveLinear], animations: {
backgroundImageView1.frame = backgroundImageView1.frame.offsetBy(dx: -1 * backgroundImageView1.frame.size.width, dy: 0.0)
backgroundImageView2.frame = backgroundImageView2.frame.offsetBy(dx: -1 * backgroundImageView2.frame.size.width, dy: 0.0)
}, completion: nil)
}
对不起,我的代码从左向右移动,而不是相反。我正在尝试实现一些动画,如你所见,它是移动背景和前景来创建一些动画。再次感谢您的帮助。@mean老师,我更新了我的答案,为您提供了一个如何实现您在评论中提到的目标的示例。还需要做更多的工作才能使其更加完美,但逻辑是一样的。非常感谢!这对我真的有很大帮助。我想将其用于刷新控件。因此,我会改变大小等,但你的回答真的把我在正确的轨道上。我再次感谢你,先生。