Strange animation


#1

Hi I try to look again on Animate Labels.

I put such a code in ViewController and
my Label move diagonally left!!!

What is going on?
Please help

import UIKit

class ViewController: UIViewController {
var Label1: UILabel!
var Label2: UILabel!

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.
    println("Halo-halo-halo")
    
    Label1 = UILabel()
    Label2 = UILabel()
    
    addLabel()
    }


func addLabel(){
    Label1.text = "Welcome in SWIFT"
    Label1.font = UIFont.systemFontOfSize(40)
    Label1.center = CGPoint(x: 100, y: 80)
    
    view.addSubview(Label1)
    Label1.alpha = 1
    Label1.sizeToFit()
    
    UIView.animateWithDuration(1, delay: 0.0, usingSpringWithDamping: 0.9, initialSpringVelocity: 0.0, options: nil, animations: {
        self.Label1.center = CGPoint(x: 100, y: 80 + 200)
    }, completion: nil)
    

}


override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
    println("Welcome")
}

}


#2

Hi

I found that the problem is that I put
Label1.center = CGPoint(x: 100, y: 80)
before
Label1.sizeToFit()
If I understand properly sizeToFit()
creates Label only left from CGPoint
but if I want to use CGPoint as a centre?

I found
Label1.drawTextInRect(CGRectMake(200, 80, 150, 70))
but when I replace sizeTo Fit with that code Label is not created at all

What I should do to make it working?
Thank you


#3

You are most likely creating the label, but it’s going out of the bounds of that RECT that you have created…
You are creating a rect that is 150 x 70, but positioning the label at 100,80 within that rect.
At least that’s how I feel about that, haven’t tested it myself.
You don’t have to do drawTextInRect anyway, just resize your label first, then position it wherever you need to.
sizeToFit will always push towards the left side…


#4

Thank you very much for your answer.

Could you please tell me what would you use instead ToFit?

Or maybe how would you create Label in the middle of screen with left and right equal margin?

Thank you


#5

In the middle of the iphone screen ?

Just use UIScreen.mainScreen().bounds.width / 2 and UIScreen.mainScreen().bounds.height / 2 if that’s what you meant…


#6

Thank you very much

I only just wonder if it is possible to bind code to the centre of label not the upper left corner?

class ViewController: UIViewController {
var Label1: UILabel!

@IBOutlet weak var Label2: UILabel!

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.
    println("Halo-halo-halo")
    
    Label1 = UILabel()
    
    
    //addLabel()
    
    var tapGesture = UITapGestureRecognizer(target: self, action: Selector("handleTapGesture:"))
    view.addGestureRecognizer(tapGesture)
    
    addLabel()
    }

func handleTapGesture(sender: UITapGestureRecognizer){
   println("taptup")
    addLabel()
}



func addLabel(){
    Label1.text = "Welcome in SWIFT"
    Label1.font = UIFont.systemFontOfSize(40)
    //Label1.center = CGPoint(x: 100, y: 80)
    view.addSubview(Label1)
    
    
    Label1.alpha = 1
    Label1.sizeToFit()
    //Label1.drawRect(CGRectMake(200, 80, 150, 70))?
    Label1.center = CGPoint(x: 200, y: 80)
    
    UIView.animateWithDuration(2, delay: 0.0, usingSpringWithDamping: 0.3, initialSpringVelocity: 0.0, options: nil, animations: {
        self.Label1.center = CGPoint(x: 200, y: 80 + 200)
    }, completion: nil)
    
   view.addSubview(Label2)

    UIView.animateWithDuration(2, delay: 1, usingSpringWithDamping: 0.5, initialSpringVelocity: 0.0, options: nil, animations: {self.Label2.center = CGPoint(x:UIScreen.mainScreen().bounds.width/2, y: UIScreen.mainScreen().bounds.height/2)}, completion: nil)

}


override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
    println("Welcome")
}

}

Please note that @IBOutlet weak var Label2: UILabel!
is a Label align in the centre of the screen.
I think that will be easier to use x and y directions from the centre of that button.
Is it any way to do that?

By the way how to make Label2 animated after any tap? ( in the same way as Label1 is)
view.addSubview(Label2) - didn’t help at all…

Thank you


#7

I guess you are asking about how to align the text within the UILabel ?
If that’s the case you need:

Label1.textAlignment = NSTextAlignment.Center // default one is left

Currently you have one function that does everything ( ‘addLabel()’ )
If you want to add one label per tap ( first one and on the next tap the second )
you can do something like this:
Create a flag to note if the program was just started, you could use Int or Bool, doesn’t really matter.

var whichTapIsIt: Int = 0

then inside the this:

func handleTapGesture(sender: UITapGestureRecognizer){
   println("taptup")

    whichTapIsIt++   // this is the same as whichTapIsIt = whichTapIsIt + 1
    addLabel()
}

Then inside the addLabel()

  func addLabel(){

if whichTapIsIt == 1 {

        Label1.text = "Welcome in SWIFT"
        Label1.font = UIFont.systemFontOfSize(40)
        //Label1.center = CGPoint(x: 100, y: 80)
        view.addSubview(Label1)
    
    
        Label1.alpha = 1
        Label1.sizeToFit()
        //Label1.drawRect(CGRectMake(200, 80, 150, 70))?
        Label1.center = CGPoint(x: 200, y: 80)
    
        UIView.animateWithDuration(2, delay: 0.0, usingSpringWithDamping: 0.3, initialSpringVelocity: 0.0, options: nil, animations: {
            self.Label1.center = CGPoint(x: 200, y: 80 + 200)
        }, completion: nil)
    }

if whichTapIsIt == 2 {

       view.addSubview(Label2)
    
        UIView.animateWithDuration(2, delay: 1, usingSpringWithDamping: 0.5, initialSpringVelocity: 0.0, options: nil, animations: {
self.Label2.center = CGPoint(x:UIScreen.mainScreen().bounds.width/2, y: UIScreen.mainScreen().bounds.height/2)}, completion: nil)
    
      }
   
 }

Just want to add that I just typed the code here, so I might have typos, since I have no compiler to help out :slight_smile:
Second of all if you your label2 is already positioned in the mid of the screen - your animation is trying to move it again to the middle of the screen, so nothing will happen :wink:


#8

Hi
Thank you for your answer.
I am sorry for all problems but I am beginner and it is sometimes difficult for me to be precise.

My goal was to create UILabel by using @IBOutlet weak var Label2: UILabel!
which will perform in the same way as Labels in tutorial.

Yes text of labels animated like in Paul’s tutorial after every tap.

Could you please create @IBOutlet weak var Label2: UILabel! "Welcome"
align in centre and check my code?
Text from @IBOutlet weak var Label2: UILabel! is moving diagonally left and only once…

Sorry but your code doesn’t work at all. Text on Label1 is moving. Text on Label2 doesn’t move - even once.

Could you please find a time and check it with Xcode please.

Sorry for problems
Thanks for help


#9

I am having a hard time understanding you, sorry. Can you send me a zip of your project and what exactly are you trying to achieve?


#10

Hi

Could you please tell me when to send that file?

Regarding project… In Paul Solt lesson he animate Label that he created using code
var myFirstLabel: UILabel!
but I wanted to animate any
Label from Utility board that you will see as
@IBOutlet weak var Label2: UILabel!

I wanted that both labels will behave in the same way like in Paul Solt animation lesson


#11

Just upload your project to Dropbox or Google Drive or any other service that we can download it from.
To be honest I think your animation code was OK.
The reason why it’s not animating is because to animate you have a Starting Position and a Ending Position.
In your case they both seem to be the same.
You start from the middle of the screen and you end in the middle of the screen.

Try replacing the
UIScreen.mainScreen().bounds.width / 2

with something like:

(( UIScreen.mainScreen().bounds.width / 2 ) + 100 )

See if that does anything.


#12

Hi
I put project in Google Drive - my email is mamazur@gmail.com

To clarify I wanted to create 2 labels.
1 as it is in Paul lecture
2 from utility @IBOutlet weak var Label2: UILabel!

and I wanted that both labels will animate in the same way like Paul’s
everytime when I tap

Thank you


#13

can you share it ? In google drive just go to ‘get a shareable link’


#14

I try but it said with whom I want to share it?
Please help


#15

https://drive.google.com/folderview?id=0B1Afv3mIPY3qTnlvMFM5REhkSDA&usp=sharing


#16

Try this:

//
//  ViewController.swift
//  MyLabels
//
//  Created by Dorota Mazur on 27/02/2015.
//  Copyright (c) 2015 Dorota Mazur. All rights reserved.
//

import UIKit

class ViewController: UIViewController {
    var Label1: UILabel!
    
    @IBOutlet weak var Label2: UILabel!
    var whichTap: Int = 0

    override func viewDidLoad() {
        super.viewDidLoad()
        
        Label2.hidden = true
        // Do any additional setup after loading the view, typically from a nib.
        println("Halo-halo-halo")
        
        Label1 = UILabel()
        
        //addLabel()
        
        var tapGesture = UITapGestureRecognizer(target: self, action: Selector("handleTapGesture:"))
        view.addGestureRecognizer(tapGesture)
        
        }
    
    func handleTapGesture(sender: UITapGestureRecognizer){
       println("taptup")
        
        whichTap++
        addLabel()
    }
    

    
    func addLabel(){
       
        if whichTap == 1 {
        Label1.text = "My first"
        Label1.font = UIFont.systemFontOfSize(36)
        Label1.sizeToFit()
        //Label1.drawRect(CGRectMake(200, 80, 150, 70))?
        Label1.center = CGPoint(x: 100, y: 40)
        view.addSubview(Label1)
        
        UIView.animateWithDuration(0.5, delay: 0.0, usingSpringWithDamping: 0.9, initialSpringVelocity: 0.0, options: nil, animations: {
            self.Label1.center = CGPoint(x: 100, y: 40 + 200)
        }, completion: nil)
   
        }
        
        if whichTap == 2 {
        
       
        Label2.hidden = false
        
        UIView.animateWithDuration(2.0, delay: 0.5, usingSpringWithDamping: 0.2, initialSpringVelocity: 0.0, options: nil, animations: {
            
            self.Label2.center = CGPoint(x:UIScreen.mainScreen().bounds.width/2 + 100, y: UIScreen.mainScreen().bounds.height/2 + 100)}, completion: nil)
            whichTap = 0 // reset tap counter
        }
    
    }
  
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
        println("Welcome")
    }


}

To be honest you should probably try to add both labels programmatically, rather then one through the storyboards. I did make it look the same way, and there is nothing wrong with this per say, but it just doesn’t feel right :wink: You don’t need to add Label2 to the subview btw, once you drag it on the storyboard it’s already added to the whatever view you drag it onto…


#17

Hi

Thank you for your answer

To be honest that code is not working at all!

Second Label does’t animate at all

Instead

func handleTapGesture(sender: UITapGestureRecognizer){
   println("taptup")

    whichTap++
    addLabel()
}

I put of course

func handleTapGesture(sender: UITapGestureRecognizer){
   println("taptup")

    whichTap++
   if whichTap>2{
     whichTap=1
  }
    addLabel()
}

but it is obvious when you check it on Xcode.
Please there must be a way to animate Label and other things from storyboard…
Thank you


#18

It was working on my XCode here.
Are you using 6.3 beta ?

Also I thought you wanted to make it so on the first Tap - the first label moves. On the second tap - the second label moves. So, that’s what I did :slight_smile:


#19

Ok Thank you

But my idea was to move it exactly like in Paul Solt lesson

Every tap both label animated…
But still second label is not animated on your code

Thank you very much for all posts!!
You are amazing help
Thank you


#20

It’s very simple - just think about it :wink:
The main difference in Paul’s video is that the labels start out of the screen.
Think where they need to start so they are off the screen.

Basically the center position is where they will start ( or wherever you drag them onto the storyboard )
And then inside the animation block you put the end position.

If you want to do that on each tap, this is in theory what you need to have inside the tap action:

  • remove both labels off the screen
  • add them again
  • animate them

Every time you tap, they’ll disappear, reappear and reanimate.