*Consolidation Entry* 2nd Basic App Part 1

Having finished the second Coursera course and not feeling remotely inclined to go through another of the dated and, frankly, not-well-structured content, it's time to consolidate! Then I'm back with what I paid an annual subscription on - raywenderlich.com.

The point of this is to a) put into practice the elements of @IBDesignable and the calculation/display element of things from Mark's course, b) do something I actually want to see on an app - the suntan idea and c) get more versed with Storyboard. SwiftUI is neat and whizzy but it's important to know the old interface. As always, here is my list of what to do...

Get the background image, use image resizer and add to the assets

For the view, get the UITextFields and get all of the layout sorted, with constraints

Get the @IBDesignable class, specifically for the UITextField bits

Get the functions to calculate and display what is needed

All the other bits and pieces!

This looks like several hours worth, at least. But that's what I need. To approach it proactively, borrowing and understanding better ideas from before! Let's start with the image...

OK got the background image - done! Now onto two...

Two is done! Got two UITextviews, two labels and a button. Not doing any constraints just yet, until I know what to do with it all! Looking at 3, I don't think I actually need to do this, yet. I'm instead going to look at what to do to get calculator up etc. then the main functions.  All outlets/buttons etc. connected. 

OK something I missed from Mark was that he did a separate class for the UIButton. Makes sense to keep it from the main code. So I've used the same for this. 

class CalculateButton: UIButton {

    

 override init(frame: CGRect) {

     super.init(frame: frame)

     backgroundColor =  colorLiteral(red: 1, green: 0.5917804241, blue: 0.0205632858, alpha: 1)

     setTitle("Calculate", for: .normal)

     setTitleColor(.white, for: .normal)

 }

 

 required init?(coder: NSCoder) {

     fatalError("init(coder:) has not been implemented")

 }

To break this down, the frame: CGRect is what is needed for changing anything for the UIButton. The backgroundColor is just the usual choosing a colour (orange) and then the setTitle properties. The required init is a general thing put in - don't fully understand the syntax there but no worries. 

So that's general stuff for making properties of a button programmatic. 

All constraints done - nice and simple! Also put the two nearby sets of labels/text fields into stacks. Cool.

Now, the top two labels look a bit garish, and don't look like the bottom 'clear calculator' button. Let's use the properties Mark did before, but let me try on my own first. New custom class file...

backgroundColor =  colorLiteral(red: 0.9959436059, green: 0.9896478057, blue: 1, alpha: 0.25)

        layer.cornerRadius = 5.0

        textAlignment = .center

        

        clipsToBounds = true

        

        if let p = placeholder {

            let place = NSAttributedString(string: p, attributes: [.foregroundColor:  colorLiteral(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0)])

            attributedPlaceholder = place

            textColor =  colorLiteral(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0)

        }

    }

Again - a lot of code I've just copied and pasted, which is all about the programmatic properties for the TextField. I'm getting used to this, in terms of where to select it on the interface. I put in @IBDesignable before the code too, so that it will come up on the Storyboard. 

Used most of the properties so the button at the bottom matches completely. Neat! Background changed so all looks clearer. 

Ok, what else to do... Yes, getting rid of text once the text field is clicked on...

Yes, it works! I've used more code from Mark's projects for the calculating, what is hidden then appears... it's basic stuff at the moment but the main thing is it does work!

Next time I need to figure out why the placeholder doesn't disappear when clicked on - need to check the settings. I also need some code for when the value is less than 60 minutes, and putting it in minutes or hours and minutes. That is something I will do next time. Then it's been successful! Also, next time, I want to go through every single line of code, just to make sense of it all. Cool!