Adding UITextField in SpriteKit?

I'm just learning Swift and I'm having some trouble with adding a UITextField. This is currently what I have in my GameOverScene.swift file:



import SpriteKit
import UIKit

class GameOverScene: SKScene{

    let gameOver = SKLabelNode(fontNamed: "I pixel u")
    let submitScore = SKSpriteNode(imageNamed: "button")
    let submitScoreText = SKLabelNode(fontNamed: "I pixel u")
    let submitScoreTextShadow = SKLabelNode(fontNamed: "I pixel u")
    let highScoreText = UITextField(frame: CGRectMake(self.frame.width/2, self.frame.height/2+20, 320, 40))

    override func didMoveToView(view: SKView) {
  
        self.backgroundColor = UIColor(hex: 0x80D9FF)
        highScoreText.center = CGPointMake(CGRectGetMidX(self.frame), CGRectGetMidY(self.frame))
  
        highScoreText.borderStyle = UITextBorderStyle.RoundedRect
        highScoreText.textColor = UIColor(hex: 0x000000)
        highScoreText.placeholder = "Enter your name here"
        highScoreText.backgroundColor = UIColor(hex: 0xFFFFFF)
        highScoreText.autocorrectionType = UITextAutocorrectionType.Yes
        highScoreText.keyboardType = UIKeyboardType.Twitter
        highScoreText.clearButtonMode = UITextFieldViewMode.WhileEditing
        highScoreText.autocapitalizationType = UITextAutocapitalizationType.AllCharacters
        self.view!.addSubview(highScoreText)
  
      }

    override func touchesBegan(touches: Set<NSObject>, withEvent event: UIEvent) {
        for touch: AnyObject in touches {
            let location = touch.locationInNode(self)
            if self.nodeAtPoint(location) == self.submitScoreText{
                highScoreName = highScoreText.text
        }
    }
    }

}


I'm getting "'GameOverScene -> () -> GameOverScene' does not have a member named 'frame'" on line 08 where the TextField is defined. Not quite sure what I'm doing wrong and I can't seem to figure out a fix for it. Any idea how I could handle this properly?

Accepted Reply

Hi Cilerba,

The UITextField is added as a subview of your UIView.

self.view!.addSubview(highScoreText)


The GameScene is also presented by the view in the GameViewController.

When you present a new scene, the same view is presenting the new scene.


You will need to remove the UITextField subview manually when you change your scene.

highScoreText.removeFromSuperview()


Cheers

Jim

Replies

Hi Cilerba,


Try this...


// add the UITextFieldDelegate to your GameScene class
class GameScene: SKScene, UITextFieldDelegate {

    let gameOver = SKLabelNode(fontNamed: "arial")
    // let submitScore = SKSpriteNode(imageNamed: "button")
    let submitScoreText = SKLabelNode(fontNamed: "arial")
    let submitScoreTextShadow = SKLabelNode(fontNamed: "arial")
    var highScoreText: UITextField!

    override func didMoveToView(view: SKView) {
        // changed to SKColor, but UIColor will work the same way. No Hex value.
        backgroundColor = SKColor(red: 0.53, green: 0.85, blue: 0.99, alpha: 1)
    
        // create the UITextField instance with positions... half of the screen width minus half of the textfield width.
        // Same for the height.
        highScoreText = UITextField(frame: CGRectMake(view.bounds.width / 2 - 160, view.bounds.height / 2 - 20, 320, 40))

        // add the UITextField to the GameScene's view
        view.addSubview(highScoreText)
     
        // add the gamescene as the UITextField delegate.
        // delegate funtion called is textFieldShouldReturn:
        highScoreText.delegate = self
    
        highScoreText.borderStyle = UITextBorderStyle.RoundedRect
        highScoreText.textColor = SKColor.blackColor()
        highScoreText.placeholder = "Enter your name here"
        highScoreText.backgroundColor = SKColor.whiteColor()
        highScoreText.autocorrectionType = UITextAutocorrectionType.Yes
       
        highScoreText.clearButtonMode = UITextFieldViewMode.WhileEditing
        highScoreText.autocapitalizationType = UITextAutocapitalizationType.AllCharacters
        self.view!.addSubview(highScoreText)
    
        submitScoreText.fontSize = 22
        submitScoreText.position = CGPoint(x: size.width / 2, y: size.height * 0.7)
        submitScoreText.text = "your text will show here"
        addChild(submitScoreText)
    }


    // Called by tapping return on the keyboard.
    func textFieldShouldReturn(textField: UITextField) -> Bool {
        // Populates the SKLabelNode
        submitScoreText.text = textField.text

        // Hides the keyboard

        textField.resignFirstResponder()
        return true
    }

}


I hope this helps.

Jim

Thank you! That did the trick, but when I switch scenes the TextField still appears for some reason.

Hi Cilerba,

The UITextField is added as a subview of your UIView.

self.view!.addSubview(highScoreText)


The GameScene is also presented by the view in the GameViewController.

When you present a new scene, the same view is presenting the new scene.


You will need to remove the UITextField subview manually when you change your scene.

highScoreText.removeFromSuperview()


Cheers

Jim