Build Calculator in SwiftUI for Beginners (Xcode 12, 2023, iOS, SwiftUI 2.0)

Build Calculator in SwiftUI for Beginners (Xcode 12, 2023, iOS, SwiftUI 2.0) - Beginners

Рет қаралды 55,414

Күн бұрын

In this video we will learn to build a full working calculator app in SwiftUI. This is an excellent place to start for beginners in SwiftUI. Creating the view and wiring up observable data are some of the fundamentals of SwiftUI that every developer should master. You will get a first glimpse of buttons and stacking, in addition to wiring up functionality that a calculator has.
💻 Source Code: / iosacademy
🎥 Subscribe for more: kzfaq.info?su...
😎 Like my teaching style? Check out some of my most popular courses! courses.iosacademy.io
Project Code: github.com/AfrazCodes/SwiftUI...
#swift #swiftUI #calculator
** Like my teaching style? Check out some of my most popular courses!
ios-academy.teachable.com/p/b...
Join this channel to get access to perks, code, groups, and more:
Building TikTok: / @iosacademy
SwiftUI for Beginners: ios-academy.teachable.com/p/s...
Join the iOS Academy Community: iosacademy.io/
** Get Skillshare free for 2 Months and learn iOS
www.skillshare.com/r/user/afraz
** Manage all your investments from app earnings on Betterment!
bit.ly/3eBwlI9
** Grow your own KZfaq tech channel with TubeBuddy:
www.tubebuddy.com/iosacademy
Timestamps
0:00 Introduction SwiftUI Calculator
1:04 Create Xcode Project
2:06 ZStack
4:10 Button Enum
11:42 Button Sizing
15:00 Button Colors
17:29 Button Actions
20:00 Updating Value
22:00 Calculator Operations
29:09 Finished SwiftUI Calculator
30:55 Review
33:00 Wrap Up

Пікірлер: 76

@holiscan Жыл бұрын

Wonderful! Really enjoyed the video. It is exactly what I needed to kick-start me. Happily this works in iPad Playgrounds as well, with only minor modifications. Thank you!

@iOSAcademy Жыл бұрын

Glad it helped!

@dev_jeongdaeri 3 жыл бұрын

Awesome!

@ingko1073 2 жыл бұрын

pedagogically sound, as additional concepts incrementally implemented. I have learned how to generate layout with proper styling.

@AlbCaphalor 2 жыл бұрын

Your calculator can run only with Int so if you try 1/3 = wrong result // change from = 0 to 0.0 to create double (decimal numbers) @State var runningNumber = 0.0 and self.runningNumber = Double(self.value) ?? 0.0

@gregohb 3 жыл бұрын

thanks. good example. to actually put decimal places I think you need to change the scheme a bit to using floating point numbers etc.

@iOSAcademy 3 жыл бұрын

Yep, thats correct

@gregohb 3 жыл бұрын

@@iOSAcademy is there any way to break the code up into smaller files (but still in the project) rather than having everything in that one file? This program is not too long, but if it were more complicated, it would be great to encapsulate some of it .... for example putting the enums in their own files, or suppose you had several sets of buttons each in its own file.

@denisblack9897 2 жыл бұрын

@@gregohb there are dozens, its up to you)

@alejandrogdea9530 Жыл бұрын

How do you make the font smaller depending on the characters?

@JerrysTechCorner 2 жыл бұрын

Thanks this video is very useful

@iOSAcademy 2 жыл бұрын

Youre welcome

@MiaomiaoShi 9 ай бұрын

This is amazing.

@iOSAcademy 9 ай бұрын

Youre amazing

@apekshaparmar6880 Жыл бұрын

Can you please make a video on how to make a scientific calculator using SWIFTUI? Because there are lot of videos and tutorials available on internet regarding this vertical calculator, but I haven't found a single tutorial or video of how to make vertical calculator (Which is scientific calculator). Lot of facing the issue in it and do not know how to build it. It would be appreciable if you make it. Thank You! :)

@rswierczynski 2 жыл бұрын

I won't lie, my dream is still to know how to program smoothly like butter, just like you do in the video. I spent like 3 hours trying to make a calculator app in SwiftUI that barely works and looks really ugly

@a7xxd Жыл бұрын

Keep Trying. You will get there one day!

@DwpSplicer 3 жыл бұрын

Excellent tutorial

@iOSAcademy 3 жыл бұрын

Thank you

@GucciJohanne 2 жыл бұрын

how did you do the button tap animation?

@lukepurcell 2 жыл бұрын

Alternate title: SwiftUI Calculator App Speed Run

@iOSAcademy 2 жыл бұрын

Lol you can slow it down

@raselmohammad8498 2 жыл бұрын

great video. i am getting error on self. value line, it says " cannot find value scope"

@jaguar9679 2 жыл бұрын

how do i implement a () Button? And i also have problems whit the % button. How could a solution looks like? and where in the code should it be? Thank you und great Video btw.

@sharkcoding2435 3 жыл бұрын

Can you make the other buttons work !? 33:00

@gregh528 2 жыл бұрын

Great video thanks. I have a problem on line 59. I keep getting the error message "Value of type 'CalcButton' has no member rawValue" Any suggestions please??

@xx-pk1uf 2 жыл бұрын

Add a type String to an enum of CalcButton -> enum CalcButton: String { ...

@mirkodiazzi4377 3 жыл бұрын

Excellent video!!! Good job! Just a quick tip… To use get decimal numbers by operations you can change : - @State var runningNumber = 0 ---> @State var runningNumber = 0.0 - Self.runningNumber = Int(self.value) ?? 0 ----> Self.runningNumber = Double (self.value) ?? 0 - Case .add: self.value = “\(runningValue + currentValue)” ----> Case .add: self.value = “\(runningValue + Double(currentValue))” i've tried this code and it's corect but i don't know if i have done a mistake writing it here so let me know if it works. Thanks!

@iOSAcademy 3 жыл бұрын

Thanks!

@kevinprandini 2 жыл бұрын

hey i tried your methode and got the error Switch must be exhausted by the part where i change Case .add: self.value = “\(runningValue + currentValue)” ----> Case .add: self.value = “\(runningValue + Double(currentValue))” any suggestions to fix this?

@peaxoop Жыл бұрын

Important note. this only works fully if you set up a new iPhone App. UIScreen is only available in IOS and not in cross platform apps.

@SteveBeaudoin 3 жыл бұрын

Thanks, wath is the method to have a decimal in divide? Thank!

@iOSAcademy 3 жыл бұрын

Youre welcone & support floats

@user-hy5xp5jj2k 5 ай бұрын

i keep getting this error "UIScreen is not in scope" but in your video it seems to built in so i'm not sure how to achieve this same look

@legengamer4864 Жыл бұрын

I keep getting a "Closure containing a declaration cannot be used with result builder 'ViewBuilder' and Struct 'ViewBuilder'" at the "struct ContentView_Previews: PreviewProvider {" PLS HELP

@nursultanyelemessov480 3 жыл бұрын

Thank you for a tutorial. i Have 2 question. Question 1 how can we divide displayed string on every 3 digits apearance. Like in apple authentic calculator if you will check it out and try to put 100000000 it will appear as 100 000 000 but not 1000000000. Any thoughts how to make this seperation? Question 2) How can i remove the last digit apeared in the displayed string like in apple calculator when you are swipe from left to right it automatically remove the last digit. For example 1000 swiped from left to right 100 swiped again from left to right 10 Any thoughts?

@iOSAcademy 2 жыл бұрын

You’re welcome. You’ll want to use for matters

@ReflectingMe2024 3 жыл бұрын

Another excellent video Afraz! Thanks. PS: Just reached out to you in email... hope this is OK.

@iOSAcademy 3 жыл бұрын

Thanks! Yep, I saw. Ill be getting in touch soon

@ReflectingMe2024 3 жыл бұрын

@@iOSAcademy Awesome, many thanks Afraz!

@stevenkirchner 2 жыл бұрын

What with Line 132/133?

@Draik0Ultima 3 жыл бұрын

The calculator does not work correctly. 1. Results do not show decimals. (Try 1/3) 2. Line 140, remove ".decimal, " to make the decimal button work. Then Add/Substract/Multiply/Divide any values containing a decimal, and you don't get results. Thank you for the effort and the code on github. That was helpful to test and help understand swift & xcode.

@sharkcoding2435 3 жыл бұрын

0:00 👍

@iOSAcademy 3 жыл бұрын

Glad you liked it

@sharkcoding2435 3 жыл бұрын

👍

@iOSAcademy 3 жыл бұрын

Thanks

@rayeasom 2 жыл бұрын

23:34 rather than using if then else for each type of operator button could you not just use “ if button == . equals { … } Else { currentOperation = Button … }

@RyanKearney0 2 жыл бұрын

9:16 / is a forward slash, not a back slash.

@pawelpow 3 жыл бұрын

23:50 If you want to mutate a property inside a struct, you need to mark the method “mutating” ;)

@pawelpow 3 жыл бұрын

But of course, You should of course be using the @State property wrapper. Especially if it is affecting the UI, which it is.

@iOSAcademy 3 жыл бұрын

Yep!

@bci. 3 жыл бұрын

Can you help me to add the decimal and negative?

@bci. 3 жыл бұрын

Probably in an other video?

@bci. 3 жыл бұрын

Also percentage?

@Oisinkelly308 3 жыл бұрын

@@bci. negative is self.value *= -1 Percentage is self.value /= 100 With decimal i think where he puts int(expression) you would have to put float instead. I havent tried these so i am not sure

@osmala 3 жыл бұрын

Do we're going to have a second part? 100% finished? =]

@iOSAcademy 3 жыл бұрын

Possibly

@rowansimpson4449 Жыл бұрын

6:28

@maxquidity 3 жыл бұрын

I wouldn't say that this is for beginners

@pawelpow 3 жыл бұрын

Well, It’s definitely not complex. Perhaps the thing that you may be struggling with is tutorial hell. This is pretty easy but I would say if your are just learning Swift UI, I would suggest completing actual courses and building your own projects. This is because by just watching these tutorials you are simply over whelming yourself, and not learning.

@natgenesis5038 Жыл бұрын

@@pawelpow exactly copy past isn’t worthy

@krystalmoore6138 2 жыл бұрын

is the preview not working for anyone else?

@iOSAcademy 2 жыл бұрын

Xcode previews are flakey

@tariqAlmazyad 3 жыл бұрын

I bet you enjoy cuddling with SwiftUI ✌️😜

@iOSAcademy 3 жыл бұрын

sometimes ;)

@sharkcoding2435 3 жыл бұрын

...

@abhaydesign1396 8 ай бұрын

how can this possibly be for beginners?

@user-fq9qe9wc3n 3 жыл бұрын

what aboun .negative? or .dot? It isn't work. Not real calculator

@iOSAcademy 3 жыл бұрын

You can always extend it

@boekenbuis 2 жыл бұрын

Your app doesn’t multiply due to a typo: mutliply

@k20df66 11 ай бұрын

Apple can't make a calculator for the iPad anyway xD

@adityapowar2707 3 жыл бұрын

Hand cam would have been better.Otherwise 👍

@iOSAcademy 3 жыл бұрын

thanks

@adityapowar2707 3 жыл бұрын

@@iOSAcademy I am getting an error called 'Cannot find 'item' in scope' . What shall I do to resolve it ? (77th line in your video)

@tanavsharma7558 2 жыл бұрын

can you or someone in the comments explain the "UIScreen.main.bounds.width - (5*12)) / 4" code ?

@yoonsw12 Жыл бұрын

He is subtracting the padding (12 pt) five times from the width to calculate the width available for four circles to fit. And dividing it by 4 to get the width of the circle to fit in perfectly.