[Swift 1] Day 3 - Code Exercise Solution


#1

Did you make something cool with the Playground?

Please share your code or answers with your classmates for the Day 3 Code Exercise and related Notebook Activity questions.

Day 3 Course Videos
Day 3 Code Exercise

Share code using

http://gist.github.com
http://dropbox.com (ZIP the Xcode project folder and share the link)


#2

Another day in paradise.
Here is my playground code :

var secondImageView = UIImageView(image: UIImage(named: "biggreen.png"))
secondImageView.center = view.center
view.addSubview(secondImageView)

var myLabel = UILabel()
myLabel.text = "Playground is fun !"
myLabel.frame.origin = secondImageView.frame.origin
myLabel.frame.origin.y += secondImageView.bounds.height
myLabel.sizeToFit()
view.addSubview(myLabel)

view

#3

What does the “big green.png” image look like?


#4

Load a 2nd picture in your Playground file.
Add a UILabel to the view variable in the playground from the tutorials.

Code
http://pastebin.com/RStQ0YyT

Result :smiley::

Did you encounter any deal breaking issues?

Not deal breaking issues, but sometimes this Playground thing acts erratic and I have to close / reopen.
I hope Apple fixes these issues because I’m in love with the Playground. :heart_eyes:

Do you have an error that you can’t figure out?

Not at this time.


#5

Here is my code. I also experimented a bit with the font size and color.

// Exercises Lesson 3.7

// 1. Load a 2nd picture
var horrible = UIImage(named: "drhorrible.jpg")
var view2 = UIView(frame: CGRect(x: 0.0, y: 0.0, width: 320, height: 480))
var horribleView = UIImageView(image: horrible)
var centerImage = CGPoint(x: 320/2, y: 200)


view2.backgroundColor = UIColor.redColor()
horribleView.center = centerImage
view2.addSubview(horribleView)

// 2. Add labels
var quoteLabel = UILabel()
var nameLabel = UILabel()
var labelColor = UIColor.whiteColor()
var centerQuote = CGPoint(x: 320/2, y: 200 + 85)
var centerName = CGPoint(x: 320/2, y: 200 + 85 + 20)
var quoteFont = UIFont.italicSystemFontOfSize(14)
var nameFont = UIFont.systemFontOfSize(14)

quoteLabel.text = "\"The world is a mess and I just need to rule it.\""
quoteLabel.textColor = labelColor
quoteLabel.font = quoteFont
quoteLabel.sizeToFit()
quoteLabel.center = centerQuote

nameLabel.text = "- Dr. Horrible"
nameLabel.textColor = labelColor
nameLabel.font = nameFont
nameLabel.sizeToFit()
nameLabel.center = centerName

view2.addSubview(quoteLabel)
view2.addSubview(nameLabel)

Here’s the picture I used:

The result is an approximately centered picture on a red background, with a white quote under it.


#6

Nice work Matt!

This is fun!


#7

here is the screen, the grey icon was my firstImageView, the bigGreen the one in the center.


#8

Based on Ryan’s idea, I would add a color pocker to fill the shape.

About Playgrounds I have a question, Is the requirement to create FRAME?

Ex. UILabel labelOne = var (frame: CGRectMake (10,10,200,100))

All items will be added to a VIEW must be created with a FRAME?


#9

If you don’t give it a frame (i.e. position and size) you won’t see it.

If I give you a paper and scissors and ask you to cut out a square of 0x0, you won’t do anything, because it’s not a valid size for a piece of paper (i.e. it’d be nothing).

You could create some UIButtons with colored backgrounds, and add logic to change the shapes color based on the last button pressed.


#10

If you don’t set the frame when you make the UILabel, you can set it later.

labelOne.frame = CGRect( … )


#11

Thanks Paul
Can I create a label, assign a text, then the frame size like or similar to “Size to fit content”?


#12

Yes. Just like on Day 1.


#13

//1. Load a 2nd picture in your Playground file. Tip: Close Xcode when making changes.

//2. Add a UILabel to the view variable in the playground from the tutorials.

//.1
var image = UIImage(named: “sosage1.jpg”)
var view = UIView(frame: CGRect(x: 0, y: 0, width: 320, height: 480))
view.backgroundColor = UIColor.blueColor()

var imageView = UIImageView(image: image)
view.addSubview(imageView)

var point = CGPoint(x: 320/2, y: 220)
imageView.center = point
view

var second = UIImage(named: “sosage2.jpeg”)
var view2 = UIView(frame: CGRect(x: 0, y: 0, width: 320, height: 480))
var secondView = UIImageView(image: second)
view2.backgroundColor = UIColor.greenColor()
var centerImage = CGPoint(x: 200, y: 200)
secondView.center = centerImage
view2.addSubview(secondView)
view2

//2.

var myLabel = UILabel()
myLabel.text = "Playground is confusing"
myLabel.font = UIFont.boldSystemFontOfSize(29)
myLabel.sizeToFit()
view2.addSubview(myLabel)
var newCenter = CGPoint(x: 170, y: 200 + 150)
myLabel.center = newCenter
view2


#14

Here we go:

var image = UIImage(named: “pacnew.jpg”)
var image2 = UIImage(named: “RUU_0014.jpg”)
view.backgroundColor = eyeColor
var textLabel = UILabel()
var textColor = UIColor.yellowColor()

var imageView = UIImageView(image: image)
var image2View = UIImageView(image: image2)

view.addSubview(imageView)
var point = CGPoint(x: 320 / 2, y: 150)
imageView.center = point

view.addSubview(image2View)
var point2 = CGPoint(x: 320 / 2, y: 350)
image2View.center = point2

textLabel.text = "This is a test."
textLabel.font = UIFont.boldSystemFontOfSize(32)
textLabel.sizeToFit()
textLabel.center = CGPoint(x: 320 / 2, y: 50)
textLabel.textColor = textColor
view.addSubview(textLabel)

And the output looked like this:

Actually kinda fun playing around in here and seeing immediate results / updating in the window without rerunning.


#15

// Playground - noun: a place where people can play

import UIKit

var str = “Hi Aldo!”

println(“Hi Aldo!”)

var eyeColor = UIColor.grayColor()

for i in 1…20 {
i
}

var image = UIImage (named: “pic.jpg”)
var view = UIView (frame: CGRect (x: 0, y: 0, width: 1024, height: 720))
view.backgroundColor = eyeColor

var imageView = UIImageView (image: image)
view.addSubview (imageView)

var point = CGPoint (x: 1024 / 2, y: 720 / 2)
imageView.center = point
// This only to rebuild the view
view

// create a new image

var secondImage = UIImage (named: “pic2.jpg”)
imageView = UIImageView (image: secondImage)

view.addSubview(imageView)

var label = UILabel ()

label.text = "Here is a bigger Picture"
label.font = UIFont.boldSystemFontOfSize(20)
label.sizeToFit()
label.center = CGPoint (x: 1024 / 2, y: 20)
label.textColor = UIColor.redColor()

view.addSubview(label)
view


#16

Bit late but here is mine…

//to do a custom view; in this case creating an iphone 3G which has 320 by 480 pixels
var view = UIView(frame: CGRect(x: 0, y: 0, width: 320, height: 480))

//lines of code in iPhone app project
var image = UIImage(named: “happycat_Happy Bday.jpg”)
view.backgroundColor = eyeColor

var imageView = UIImageView(image: image)

//add image to the view
view.addSubview(imageView)

var point = CGPoint(x: 320/2, y: 300)
imageView.center = point

//for playground mode only, need to add another “view” to update the view
view

//changing background with a method instead of through the variable - changed from red to yellow
view.backgroundColor = UIColor.yellowColor()

//Adding a label to the canvas
var myLabel = UILabel()
myLabel.text = "Happy Cat"
myLabel.font = UIFont.boldSystemFontOfSize(32)
myLabel.sizeToFit()
myLabel.center = CGPoint(x: 320/2, y: 50)
view.addSubview(myLabel)

//adding a second image to the canvas
var image2 = UIImage(named: “673-emoticon-grin@2x.png”)
var imageView2 = UIImageView(image: image2)
view.addSubview(imageView2)
imageView2.center = CGPoint(x:320/2, y:95)
view


#17

Catching up with the course. Took me a while to figure out how to resize pictures. After scratching my head for a good hour it clicked, using frames to resize.

// Playground - noun: a place where people can play

import UIKit

var str = “Hello, playground”

//Set Screensize
var view = UIView(frame: CGRect(x: 0, y: 0, width: 320, height: 480))

//Background Colour
var backColour = UIColor.blueColor()

view.backgroundColor = backColour

//Set picture 1
var imageTop = UIImage(named: “Sweet.JPG”)
var imageView = UIImageView (image: imageTop)
imageView.frame = CGRect(x: 0, y: 0, width: 300, height: 150)
var placeImageTop = CGPoint(x:160, y:100)
imageView.center = placeImageTop
view.addSubview (imageView)

//Set picture 2
var imageBottom = UIImage(named: “Dude.JPG”)
var imageView2 = UIImageView (image: imageBottom)
imageView2.frame = CGRect(x: 0, y: 0, width: 300, height: 200)
var placeImageBottom = CGPoint(x:160, y:350)
imageView2.center = placeImageBottom
view.addSubview (imageView2)

//Set Label
var label = UILabel()
label.text = "Here fishy fishy"
label.font = UIFont.boldSystemFontOfSize(32)
label.textColor = UIColor.orangeColor()
label.sizeToFit()
label.center = CGPoint(x: 150, y: 200)
view.addSubview(label)
view


#18

Good work on figuring out how to resize. Playing with the code and exploring is very important to learn how to do things in apps.


#19

Hi,

made some changes to your example to keep the aspect ration.

jvc

//Set picture 1
var imageTop = UIImage(named: “Sweet.JPG”)
var imageView = UIImageView (image: imageTop)
imageView.frame = CGRect(x: 0, y: 0, width: view.bounds.width, height: view.bounds.height)

let widthImage = imageTop!.size.width
let heightImage = imageTop!.size.height
let widthFactor = widthImage / imageView.bounds.width
let heightFactor = heightImage / imageView.bounds.height

var width : Int
var height : Int

if(widthFactor >= heightFactor) {
width = Int(widthImage / widthFactor)
height = Int(heightImage / widthFactor)
} else {
newWidth = Int(widthImage / heightFactor)
newHeight = Int(heightImage / heightFactor)
}

var placeImageTop = CGPoint(x:newWidth/2, y:newHeight/2)
imageNewView.center = placeImageTop
imageNewView.contentMode = UIViewContentMode.ScaleAspectFit

view.addSubview(imageView)


#20

println(“hi mate”)
var eyeColour = UIColor.blueColor()
var buttonColour = UIColor.redColor()
var labelColour = UIColor.whiteColor()

// Iphone screen 3g

var view = UIView(frame: CGRect(x: 0, y: 0, width: 320, height: 480))

// lines of code in iphone app.

var image = UIImage(named: “image.jpg”)
var image2 = UIImage(named: “image2.jpg”)

view.backgroundColor = eyeColour

var imageview = UIImageView(image: image)
var imageview2 = UIImageView(image: image2)

view.addSubview(imageview)
view.addSubview(imageview2)

var point = CGPoint(x: 320/2, y: 100)
var point2 = CGPoint(x: 320/2, y: 350)
var labelPoint = CGPoint(x: 320/2, y: 215)

imageview.center = point
imageview2.center = point2

var tutorialLabel = UILabel()
tutorialLabel.frame = CGRectMake(0, 0, 200, 40)
tutorialLabel.backgroundColor = UIColor.whiteColor()
tutorialLabel.center = labelPoint
tutorialLabel.textAlignment = NSTextAlignment.Center
tutorialLabel.text = "I’am a test label"
tutorialLabel.textColor = UIColor.redColor()
tutorialLabel.shadowColor = UIColor.blackColor()
tutorialLabel.font = UIFont(name: “HelveticaNeue”, size: CGFloat(22))
view.addSubview(tutorialLabel)

//show the view updates
view