Updating Own Project To SwiftUI (HowManyLetters?) - Part 1

Finally getting round to this! A chance to really explore SwiftUI - just for an hour this evening. The idea is to update everything I did with 'HowManyLetters?' so it is compatible with SwiftUI. Moving forwards, it makes sense to have it all together on this. Let's give it a go!

Start Time - 19:08

OK, let's open the previous project and make a note of all we need..
*Paused for around 10 mins

Model
*I didn't actually build models of words before but it makes sense to try it again here


View
Title
Labels for score and question number
Word displayed
Click label
Click button (beagle)
Instruction label
Info button
New game button

Other view -

Title
Info on screen
Return button


Controller
Loads here....

Global variables - total, score instruction info label
Timer - seconds, timer object and time running
Wordbank of word array
All labels connected
Hide keyboard and Text field returning functions
Timer running
Updating timer
Pause timer
Reset timer
New word function - to get random number
New game, update scores, reset text box functions
Check if answer is correct

So what a cool, fully functioning app! Let's start with the main parts of the view today...

I've just opened Bullseye to get the code for the view etc.

Right, after a lot of playing around, here's what we have for the view!





Not bad eh!

Code wise, quite a bit....

mport SwiftUI  

struct ContentView: View {
    
@State var alertIsVisible = false
    
    var body: some View {
        
        VStack {
            HStack {
                Text("Score:")
                .padding(.leading, 10)
                Text("0")
                Spacer()
                Text("Question:")
                Text("1")
                .padding(.trailing, 10)
            }
        Spacer()
        
        VStack {
            Text("How Many Letters?")
                .font(.largeTitle)
        }
            Spacer(minLength: 40)
    
            VStack {
                Text("30")
                    .font(.title)
            }
            
    Spacer(minLength: 120)
            
        VStack {
        Button(action: {
            self.alertIsVisible = true
            
        }) {
            Text("Click Here To Check!")
        }
        Spacer()
        
        VStack {
            Text("Longest word to go here")
                .font(.title)
        }
            
        Spacer()
            
        VStack {
            TextField("", text: /*@START_MENU_TOKEN@*//*@PLACEHOLDER=Value@*/.constant("")/*@END_MENU_TOKEN@*/)
                .frame(width: 50.0, height: 50.0)
        }
        
        Spacer()
            
        VStack {
            Text("Enter the number of words in the box!")
                .multilineTextAlignment(.center)
                .padding(.horizontal, 120.0)
        }
        
        Spacer()
        VStack {
        HStack {
            Button(action: {
            self.alertIsVisible = true
                    
                }) {
                    Text("Info")
                }
            .padding(.leading, 10)
            Spacer()
            Button(action: {
            self.alertIsVisible = true
                    
                }) {
                    Text("New Game")
                }
            .padding(.trailing, 10)
            
            }
            .padding(.bottom, 20)
            }
            
        }
    }
}
    
}
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }

}



Still quite a bit to do but that's all I am for now. Mostly, it's getting the text field to be shown as it is actually there! That will be a job for another time - some help online needed. 

Anyway, a good effort. View is done for now. Next job will be the Model, then the Controller. Then the jazzing up of the view with the various elements. This will be a project for at least a week but it will be time well spent!

Things I've picked up already - 

When you have a button, the stacks can get a bit cramped. To specify the spacing, you can do an alternative Spacer with a parameter of minLength. That helps out a bit. 

You can click on padding options for which edge you want to include, as well as size of objects. So it doesn't all have to be hard code basically - this is good for trying things out. 

Finish Time - 20:42 (approx 1 hour 20 minutes)

Comments

Post a Comment

Popular posts from this blog

*Xcode Project Entry 2* F1 Quiz - part 1

Image
It's Christmas Eve and time to code! To think, a year ago, I was plodding along with some eBook, blindly convincing myself that I was on a steady road to coding greatness. Really, it was from June where I made the decision to start again, humbling as that may seem. It would have been comforting to have completed endless 'beginner' courses but branching out and applying the theory is the key thing, which brings us to this entry. Yes, my second Xcode OWN project! I thought about doing an educational one, as there is certainly a lot of scope and relevance for that, being a teacher and all. However, making a quiz makes sense, for various reasons.  First off, I have made this before through Angela's excellent tutorial. No offence to Sandra, but hers is not even close to the elegance and effectiveness of Angela's project. The one thing to take from Sandra is the stack views. Definitely something I will use from now on. This is one of the great things about learning from...
Read more

Angela Yu Course Part 10 (up to lesson 112)

Image
It's unlikely that I'll be able to do any Swift tomorrow as I'm going to Eastbourne today, for the weekend. So I can give half an hour now, maximum! Coding Challenge - Destini App! Choose your own adventure books! I used to ADORE these. Angela explains that these have had some sort of revival through the Lifeline games. It's very binary - yes/no mostly. I have my own experience of this based on WDC... Now the challenge is to complete the game! Having followed the first few instructions, which I found a bit confusing it must be said, I was about to surrender and see the answer. Then I managed to stop myself - I CAN do this, or at least have a good go! Even if I don't get the correct answer, it will be good practice to put what I know into practice. This is my weakness, which I keep coming back to - that when some problem solving is required, I fold far too quickly. So here is what I need to do: Let's break this down... I need to use the...
Read more

Angela Yu Xcode 12 Course - Part 7 (lectures 74 to 79)

Image
No time to waste! Only got a short amount of time now so going to get a few minutes or so in! Start Time - 20:14 Conditionals If statement for 'love calculator' example. So a simple example for this. The idea will be that conditionals are used to show that the print statement will do it differently for whatever the number is. With updated Swift, I would use the Int.random(0...100). Easy fix that would be. Also no UIInt32 needed but just an Int. So with the if statements, it would be a STRING being returned.   Linked to the whole choose your own adventure - if/else for each choice. BMI Challenge No need to do this - easy enough to be honest. Just skimming through. BODMAS principles... So something I picked up on before is not needing the greater than AND less than value for the middle line (for the else if bmi > 18.5) A better solution, which Angela is already explaining before I could say it is returning a string instead of a Double. So the...
Read more