From the course: Make SwiftUI Playgrounds Applications
First steps - Swift Tutorial
From the course: Make SwiftUI Playgrounds Applications
First steps
- [Instructor] Swift Playgrounds 4 changes the game if you want to get into programming on the iOS and iPadOS platforms. Today, we start a series that takes you from knowing nothing about programming to writing apps, one step at a time. We'll use the Swift programming language and the SwiftUI framework for user interfaces. Along the way, we'll introduce plenty of programming concepts you can transfer to learning other programming languages. All you need is Swift Playgrounds 4. You don't need any experience programming. However, Swift Playgrounds 4, as of this writing, has a few requirements of its own. The app runs on iPads with iOS 15 but I'd suggest 15.4 or later for best results you can get the app in the app store for free. And so I have it already here and I've already gotten it downloaded, so you can just go ahead and download it and then we're ready to open it and get into the application. Swift Playgrounds can use the onscreen keyboard. If you have one, I do suggest using an external keyboard for faster workflow. Usually I'll be working on an iPad Pro with magic keyboard as I go through this, that'll give you more clarity in seeing the code and not the keyboard. As we go through the series, I'll show you how to use that onscreen keyboard in case you don't have the external keyboard, including some cool tricks for editing. In this first lesson, I'm going to be using that onscreen keyboard. So, let's go ahead and get in here. And you can see I've got a whole bunch of apps already here. Our big two buttons that we're going to be looking at are the ones in the lower left and you'll see one that says App and one that says Playground. We're going to be using the one that says App. I may talk about the playground a little later. But I have an entire course on that one on LinkedIn learning if you are interested in finding out more. So go ahead and hit the App button and that creates a small icon on the top. And mine now says My App copy 4, yours is probably going to say something different. And then go ahead and tap into that And that gets you into some code. All right. And we'll see up here on the top that it has a little button with a little sidebar on it, go ahead and hit that. And it'll show you all of the code that you have available to you. So we have two pages of code right now. One called ContentView and one called My App. And above that you have the App Settings. And we're going to go into there now and change the name of our application. So here where it says Name, it says My App, I'm going to tap that, and now I can change the name of my app to Hello Pizza. And I'll hit done. And now I can also change my icon. And you'll see we've got a place holder and a custom. If you have images, you can put a custom image in. But we're just going to use the placeholder for now. And I'm going to use the monoculars and I'm going to try one of the bluer colors here. So let's go pick this one here for mine. And you can pick whatever color you'd like whatever you want to do. There's other things here but those are the only two we're going to be playing with for now. So go ahead and hit done. And now we've got our Hello Pizza app settings. So if we actually hit the X on the top here you'll see that our icon now changes. I can also change the name here. So I'm going to tap over here on top of my app copy 4 and type in Hello Pizza. And you'll notice those little clouds on these icons those are ones that are being stored in iCloud. The ones without the clouds are the ones that you have available to you right now. Now let's go back into Hello Pizza. And I can close up that sidebar. We're not going to be needing it we're going to be using Content View which is the one I have tabbed. If you have my app that shows up first go ahead and tap the content view. If you have two of them up you'll notice you get two tabs up on top two for navigation. We're going to stay in content view for most of this and you can hit that sidebar button so that you have more room. And we're ready to start writing some code here. If you tap the little button all the way on the right you'll get your app preview if it's not showing up here and you can hide it by doing the same thing. I'm going to go put it up here. And we have a little program that's already running here that says Hello world on it. Okay, we'll discuss all of this code as we go through the series, but for now I want to point out to you line nine. Text is a function a command that tells the iPad to do something. In this case, text tells the iPad to display the phrase "hello world", text will display anything found within those quote marks, quote marks and the characters it contains are called a string. You could change the string by typing in the quotes. So I'm going to tap after the D and then I'm going to go back a couple things. I'm going to change this to guitars. Okay, and so now I've got guitars here. And you'll notice over in the preview that it's now changed to guitars. So let's try typing a different phrase. So let's put this one up on top and we'll make a new text. So I'm going to scroll up here to just after where it says V stack, hit return. And I'm going to type in shift TEX For text. And you can see what's known as auto complete and auto complete will guess what you're trying to type. So it makes it easier for you to type things in. So you only type a few letters and say, oh that's what I want. And you can scroll through these if you want and see which ones they're available to you. But we really want that first one. You'll notice on the right of text it actually has a little return key there, meaning okay if you want this one, all you have to do is hit return. So I'm going to hit return and that gets me text and it fills that in. I then get a little message. Those are what are known as error messages. Often you'll get error messages when you either have an incomplete statement or you have a statement that's wrong. Right now it's still wrong, so that's why it's doing that. Next I'm going to use my keyboard here and add. So parentheses. Now, if you haven't done this before, you'll notice that there are parentheses above the J key here. I'm going to drag down with my finger from the upper corner where the parentheses is down towards the comma, and that will get me my parentheses and it automatically puts in the second parentheses so I don't have to do it twice. Then I'm going to do the same thing with the L and just drag it down to get quotes. And now I can type something else in here. And now I have set up what I need for my string which is going to go inside the quotes. And so then I'll put Hello comma space Pizza. And I'll do the same thing with my exclamation mark. Once I have done that, you'll see the result on the side at preview where it says Hello Pizza. Now let's change the globe. We have an image function on line seven. Sometimes functions have different ways of working and when they do, there will be parameters inside the parentheses. This one has a system name parameter. System name wants a string of a system image what Apple calls an SF symbol. Now you can see these, by the way, if you go to plus on the top there and go to the star with the circle. And here is a whole bunch of different ones and there are a ton of these guys here. We can find specific ones by using the search. And then we can see we've got guitars, for example. Alright, I'm going to tap outside of all that 'cause I don't necessarily need that reference 'cause I know exactly what I want and that's guitar. So I'm going to go here and tap in where it says Globe. And because I tapped directly on top of it it actually selected all of it. So I can go straight into typing guitars And the symbol changes to guitars. Well, this may not seem like it's going to be the next video game sensation. You've actually modified the application to be your first program. Basically, that's all there is to programming putting down statements containing functions like image and text to tell a user what to do. Of course, there's a lot of other statements and you will need to store data, make decisions and do the same thing over again multiple times In this series we'll learn that and a lot more about user interaction. So stay tuned for more fun next time as we learn about constants, some math and adding strings together.
Contents
-
-
First steps8m 56s
-
(Locked)
Constant and calculations7m 57s
-
(Locked)
Functions, methods, and modifiers7m 14s
-
(Locked)
HStack, VStack, and layout9m 41s
-
(Locked)
Create new files and views4m 50s
-
(Locked)
Add images10m 10s
-
(Locked)
Learn about Swift types9m 32s
-
(Locked)
Variables and scope10m 33s
-
(Locked)
Using if{}else{}8m 24s
-
(Locked)
More if{}else{}12m 46s
-
(Locked)
Create custom functions7m 58s
-
(Locked)
Structs and classes10m 55s
-
Models and views10m 37s
-
-
-