How to make a 2D Unity 3D calculator using UGUI

okay hello my name is Dan mcfinn ski this is my first video tutorial and what I'm hoping to do here is to teach people a little bit about the unity UI system as you can see here I have unity open and I have a project where I've created a calculator in unity using the unity UI system completely now this calculator does work it's not the greatest calculate in the world but it does do some simple arithmetic you can see six well that's not going to work actually this is a problem here 6 & 5 6 minus 5 equals 1 2 minus 9 is negative 7 9 times 654 great so you can see this calculator here has some really basic functionality it scales with the window here which is kind of nice and it's all done in 2d so if you look here in the editor you can see that this is just a flat 2d ui canvas there's no difference in the z space on any of these objects and they're simply rendered in the order they are in the hierarchy now I'm going to go ahead and start a scene from scratch it kind of will lead you through this whole process that I just went through to build this now of course I've already done this so some of these things I don't have to search for any of the functionality but I can't say that this is something I was able to do on with one-pass has took me a little bit of research and I think just about every project will take a little bit of research some projects as you get more experienced may not take a lot of research some projects will depends on what you're trying to get done so I'm going to go ahead and name this video calculator tutorial I'm going to put in my unity tutorials calculator directory here unity gives you the option of this is the first screen you get when you start unity by the way the unity gives you the option of selecting 2d or 3d on startup I generally start with three being I never really pick 2d but since I'm making a calculator right now I'm going to go ahead and pick the 2d set up let me move this screen out of the way now you see unity gives you a basic empty project empty projects can often seem quite daunting because you don't know where to start so first I'm going to go through just a quick overview of some of the important aspects of the unity interface I'd say the most important aspect is this scene window scene window gives you a view on everything that's in your scene now unity works based on scenes you can have many different scenes in your project and each scene can contain a lot of different content and then you can load those scenes progressively or you can load and unload scenes or you can just use one scene a lot of the projects that I work on only have one scene and they load content in or dynamically instance prefabs and you may not know what all that means right now I'm assuming that people watching this we beginners but if you're not a beginner then you might know some of this stuff and you might be able to fast-forward through some of this video I'm going to try and keep this to half an hour if I go over well then I go over but I'll try and keep it to half an hour and I'll try and explain as best I can as I'm working I might get I might go through a little fast and some parts certainly feel free to leave me comments or send me an email if you want more information I'm more than happy to try and help people get up to speed and learn what they want to learn to do with unity okay so just like every program you've got your list of dropdowns up here I'm gonna let you explore these on your own but they're pretty they're pretty self-explanatory there's something's in here that that you might use on a more regular basis build settings build and run you know I clearly save a new scene all that kind of stuff it's pretty common this Windows tab kind of helps you open different windows that you might need I use the profiler sometimes profilers a nice tool that lets you see how your project is doing you know whether it's eating up all the RAM whether it's graphics card CPU intensive or GPU intensive so you can see all sorts of things happening here and really right now as beginner here this is not really something you need to dive into but anyway so there's there's there plenty of things up here to look at and I encourage you as a beginner or even as a nominees to go up here and explore this area and this long can be extended with unity editor scripts but again this tutorials I can go into that so the next really important thing here is this toolbar here you've got five buttons each button does something differently something different so you've got the scrub which lets you bottom so I pan lets you pan around your 3d scene you've got the transform tool which lets you move objects so I'm moving this camera that has really long a really long viewport here so it looks kind of weird it has the clipping plane is set to 1000 but it's size is only 5 anyways just to just make this simpler I'm going to throw a cube in the scene and you can see I throw Cuban by right-clicking and just hitting the 3d object cube button here and then I'm going to zoom in on the cube by hitting F in the scene view hit F my keyboard I like using my keyboard alts and left-click lets you rotate around an object right click this rotates the camera around middle-click if you have most three buttons pans and then f again centers you so if you're really far away from your object F bring it back so then you have so you've got this transform tool so you can move objects around and you can see you have a transform gizmo so you can see which access you're moving on you can lock it to one axis you can grab two axes xes and then you can go up here and you can rotate now you can rotate on all axes there you go you can rotate on one just like you can with the transform tool and of course control Z undoes everything so you can rotate it's kind of nice then you've got this scale tool so this is if you're a 3d modeler 3d animator anything that works for the 3d package then some of these things will seem very familiar your non-uniform scaling a uniform scaling in the middle and then you have this inspector panel over here where you can edit these things as well now this tool this last tool here this is a tool that was built for the for the 2d system I believe more than anything else but it does work on just about every object but you can see I can grab I can grab handles here I have a little bit more of a visual gizmo to to modify my objects then I kind of switches depending on how I'm viewing an object so that's kind of nice the other nice thing about this toolbar up here is that they all correlate to keyboard shortcuts so Q is pen W is transform YZ rotates R is scale and T not sure exactly what this stands for sometimes if you just mouse over button and well doesn't matter tell you Attie does a lot of things transform translates it scales there's all types of things so ok so that's that toolbar there the next thing you have is this little toolbar here lets you modify an object from its global or local position so this object is at 0 0 if I were to move it to 0 0 1 and its local position is actually 0 0 from from it's actually from the camera this is local and global position would be zero zero negative one now this may not make sense right now but basically the thing to be aware of is that every object has a global or world position and then a local position so its position depends on its its its membership in a hierarchy if it's transformed from the hierarchy then it's local position would be subtracted from its parent and so you just have everything zeroed out and you have whatever the parents transform is Plus that objects transform or minus out so you can see it's zero and zero zero negative one whereas the main camera is zero zero negative ten so this object is really zero zero negative 11 anyway that's not that important to know right now but it is helpful in the future if you work with 3d games or you know you can complex 3d Interactive's in necessarily have to be games the pivot point clearly is a good point of the object that you're working with if you select multiple objects I think you can change the pivot point Center in the pivot so this one is the center pivot for the parent in the hierarchy this one is the pivot for the child in the hierarchy and you can see I can rotate around this guys clip it if I change it back to pivot then rotating my camera's pivot anyway these are things you can explore as I said on your own time in the future and I'll probably go over it in other tutorials when I do something related to 3d stuff so okay so there we have the scene view the scene view also has this nice drop-down that lets you look at objects and shaded wireframe shade wireframe so if I drop another 3d object here let's draw a sphere you can see the sphere using a swimming into it Alt + left click I can I can pan around it I can look at it in the wireframe view the shaded view shaded wireframe and then there are other kind of dropdowns that or options that can be more more interesting here this would be the alpha channel if there's any overdraw if there's another object over here so you can see the red kind of red the dark red gives you an idea of what's being overdrawn we turn off this shaded if you can see that in overdraw you can see when it over draw see dark red mint maps so as you get farther and closer away object objects maps can be you can have unity Auto generate mid maps so that the texture maps all be they update to lower res versions as you pull away so they're not trying to render versions that really can't be rendered their full resolution up again I think I'm getting a little in the weeds here this is not really important for what we're going to do here so I'm going to go ahead and talk about the camera so as a as a scene that has a calculator in it it's going to be all 2d we're not going to use a 3d camera so we're going to use an orthographic camera this is a 2d projection camera it basically gives you a box plane now I'm going to assume that we're going to be making an interactive for an HD resolution screen which is 10 1920 by 1080 so 1920 pixels wide by 10 by 1080 pixels high so this game window by the way it'll park this over here like that you can see this is another nice thing about unity is that you can grab your windows and you can drag them anywhere you want you can you can kind of dock them in any way that's convenient to you and once you've done that unity will save that preset or the the that layout automatically but you can also save it in in the layouts drop-down on the top right which is kind of nice so that you can pull it up with other projects somebody says the shapes a project with a layout you don't normally use it might load might load a default layout if you don't have it or it might try to load their layout if they didn't send it to you you might want to use your own and of course he already has some default layouts that you can also use which sometimes these can be kind of nice I usually just stick with my own I like having the hierarchy menu right next to the inspector panel in case I need to drop objects into slots in the inspector panel and we'll see a little bit about that later so finally the law so I didn't really discuss the inspector panel this inspector panel gives you all the information related to any object that you have selected so if if the object lives in 3d or 2d space it has a transform or rect transform so all objects have this right this transform will rect transform they live somewhere in 3d space this object which is a cube just happens to have a cube mesh filter and it has a cube model assigned to the cube mesh filter then it has a box Collider assuming that we might use this in a physic system or we might use the box Collider to check for collisions and just have custom reactions it also has the mesh renderer so I can mess it can render the mesh that's defined here and then finally it has the default material and you can create your own material and drop it in the slide but all objects and Unity game objects basically they're there at their core they have this transform unity goes through and finds anything else it's attached to an object and and runs a script so these are all scripts that are components that are run on top of the transform so unity will run through and it's update loop final objects in your scene and then find all their components and run their update loop as part of its update loop so the game engine has an update loop and is running through every object running their update loops or whatever life cycle method that needs to run it at any given time whether the object is being closed or activated or deactivated or destroyed you can have methods that run when when certain things happen on your game objects just as an example I can get rid of all of this all this cube component and then suddenly we have an empty game object you can see this is no longer a cube there's nothing rendering here there's nothing displaying on the screen because nothing here so this is an empty game object it's like a it's a it's just basically a label that lives in 3d space and I can add anything I want here I can make this a a 2d image object and now it's a 2d image object it's not rendering because 2d images require a canvas so this is what we're going to look at a little later but I have this canvas I made the cubic canvas element or an image so now you can see it's right there now to the image we're actually looking backwards here so now it's a 2d image in my threes in my section 2d space because I have a game object or my camera set to work the graphic and canvas is a 2d system ok so I'm going to go ahead and just kind of start from scratch here so the project window down here is where I would start so the project window manages all of your assets your scripts graphics audio anything that you have that's going to be part of your project it's going to be here in the assets folder and you can also download data dynamically and add it to your project through resources directory or an asset bundle but we're not going to get into that then you have your console which this is used for debugging this is a really useful window once you start writing scripts we'll get into a couple scripts right now the first thing I'm going to do is I'm going to create a couple directories I'm going to create a scenes directory I'm going to create a scripts directory and I'll leave it at that right now fiends and scripts and I'll go ahead and see this so I'm going to save this in the scenes directory i might call this calculator done now you can see there's a calculator seen in here if i save another scene i could modify this hierarchy and then save it on the scene and then i could switch between the two and you can see a difference right now we're going to stick with a calculator scene and the first thing i'm going to do is i'm going to create a UI element the way i like to create things by right-clicking the higher panel going down and finding the appropriate thing I want to create the appropriate category and just dropping it in so I'm going to create I can create a panel and this will automatically create a canvas or I'll create a canvas first just so you see this canvas here is an element that's 2d what it does is tells unity that we want to render something 2d and anything below this canvas is going to render it as part of the 2d canvas system canvas has a rect transform which is a 2d transform element and while it does have a Z position on it it doesn't necessarily always use it you can set it to use it to be or the Z positioning by changing it to world space once I change it to world space you can see the Z position opens up and this becomes a 2d canvas in 3d space that may sound confusing but it's very useful for many different reasons but again we're going to get into that so I'm going to go ahead and switch to just screen space overlay this allows you to do pixel perfect which means that if you make all under assets in Photoshop you can bring them into unity and you can basically keep everything one to one so all of your pixels are exactly the same in unity as they are in Photoshop you don't lose any quality by doing this or you don't have any strange effects happen when you start resizing windows so then you could set constant pixel size in this canvas scaler or you can set scale with screen size or constant physical size I do scale with screen size usually and when I set my screen size I know this is going to be a 1920 by 1080 scene so I go ahead and do that and that means that if I drop anything in this scene so I'm going to go ahead and drop a UI image element drop it in the scene now you can see this section set the 4k else at this bit HD if I change the size of this screen it's actually scaling my object up and down now if I this might be more apparent if I scale it up so I'm going to go ahead and change the size screen you can see it stays the same size relative to the screen sighs if I didn't have this scaler set constant physical size you can see it's not scaling my object it's keeping it same size which makes it a little hard to you to work with in the editor but if you were certain that you're going to be in 1920 by 1080 and you have a screen that maybe was a little bigger you can see everything in the editor at that size and never have to worry about the screen resizing here but I'm going to go ahead and use scale with screen size okay so this will be my calculator background we can make this any color we want this is just an image script which means it's an image that has a size of 100 by 100 has a scale of 6 6 6 which I'm going to go ahead and change and I'm going to make this maybe 500 pixels wide by 8 pixels tall there you go I'm going to make background done or maybe a slight gray and I'm going to change something past these then it's kind of like a transparent calculator so that's kind of nice so now that I have that done basically the way that the canvas system works is that I can start dropping in more objects here I want to drop in a button so their button is your pre-made you have this on click event associated with them and you can basically add a script into this slot here after hitting the plus and then you can pull down and tell it to execute a function every time this button is pressed but the first thing I want to do with this button I want to give it a an interesting work or maybe not interesting is going to be all that interesting but I'm going to at least try and decide someone so I'm going to go ahead and make it 100 by 100 pixels and align it to the left and this will be my 1 button and I'll go ahead and drop one in the textile button is a component that has an image it has a button the script and then below it it always creates a text component on you object so this text because it's a separate object it can be offset it can be put anywhere you want but it automatically comes aligned to the button component unfortunately unity has some strange issues going on with the rendering of text in the editor here you can see it's rendering fine in the game window there are other components out there assets that you can buy like text most Pro which is really nice in terms of getting text in in your game and making sure it stays a really high quality I highly recommend text much pro I use it in just about every project I work with but I'm not going to go I'm not going to get into that right now so this will be my first button or we name it by hitting F to call it one so that's my first button now before I go ahead and make a bunch of buttons I'm going to make a script here I want to make this really simple so I'm going to go and select the scripts directory right click on the right side there go up to create go to c-sharp script I'm gonna call this calculator go ahead and double click on the calculator in the slope and Visual Studio okay so we've got Visual Studio open you can see Visual Studio creates a class if you don't know what a class is don't worry about it then important right now but the class is called calculator the class the semicolon here means that this class calculator is derived from this monobehaviour class and if you just roll over things and kind of see their descriptions about that Mona behavior is a base class every script derives from so calculator is derived from model behavior which means that unity knows how to call this script and executes its lifetime method so birth lifecycle methods so start is one of the lifecycle methods there are two things that happen when when unity first starts there's an awake method that's called on a script I could add that take one awake and like a debug log debug log is a nice way to get information into the control panel calculator just woke notice just a wake method is usually called to initialize you can see it brings us comment in automatic before you use this for initialization well maybe that wasn't for the wake method but nonetheless you can use a wake to initialize a component debug log help you later just started so just started today and then if I put a debug log in here you'll see I'm going to spam my console window calculator is updating so I'm going to span my console window like this because when you hit play on unity it starts a loop and it never ends that loop so it just keeps playing that loop first thing it does is calls all the awake in the start methods and then it calls update on every month on every object that's in the scene that's active I'm going to go ahead and drop an object in here I'm going to make it empty I'm going to call it a calculator I'll put it up here just to keep it in the canvas and you know what just for the heck of it I call this a calculator canvas I'll kill your canvas so now we have our calculator object I'm going to drop our calculator script on it I'm going to go open the Contin console like clearing the log you sleaze when you play boom now you can see it's just spamming this console window there 200 300 400 just got tons of comments in here now I'm going to go all the way to the top and you can see calculator just woke up calculator just started and then calculator is updating and it just says updating updating constantly so this is how a game engine works in general game engines basically start a game loop and they continue to execute things in the game loop sometimes when you pause things they just don't execute the update for a game until Yun pause them you know depending on how it works and let the game engines work in different ways and you can certainly change the way that you pause something in unity if you're using a physic system you would just pause time if you're using if you're using your own kind of update loop or if you're just using the Unity update loop then you might have flags or you might have properties or States for objects and you check in the update loop if the objects set those States then you don't update them anyways that's above and beyond again but you can see the basic functionality in this calculator script and how it's called in its lifecycle here so we are not going to use most of these things we're going to develop this calculator kind of like a Windows application which is going to be more event-driven which unity doesn't lend itself well to making event-driven applications because unity is always trying to update the window whereas a Windows application just tries to update any portion of the window that gets dirty so it spends a lot less a lot of your resources updating an application like word or or the calculator application you know the calculator application basically doesn't do anything until it receives an event whether it's a mouse-over event whether you're adding a number or whatever you're doing it doesn't it doesn't necessarily do anything to the screen until it receives an event that something changed and then it just updates that portion of the screen unity is constantly updating the entire screen the event system the UI system tries to update portions on the screen but it's still a 3d engine and it's still trying to update everything else on the scene so it's not the most efficient tool to use for something like a calculator although you can create a calculator and you can drop it into your game so if somebody needed a 2-d calculator attached to the wrist of a character or or attached to some object as a texture and you can make a 2-d calculator and you can drop it in it can be part of a 3d game anyways it's going to be on again ok so now we have a calculator gutter script we've got a calculator background we've got our number one button well we want to know how we can sense when somebody touches this number one button so if I hit play right now and this I encourage you do to do often is just hit play as often as you can just check your scene make sure your your your projects working that your your console logs or pouring the right information out hopefully not spamming the console log like I'm doing right now but once you once you kind of get through that get everything set up you do want to check and make sure that play works a lot of times if you've written your code and it's not really and it's got errors or the logic is wrong then you'll see it immediately in your game here that something doesn't work if anyway so this one has a an on click method on it you can see that the one response when I click on it already because this button script has some functionality for clicks it changes the colors and you can change all these properties to make it click look more interesting I'm not going to do that but I can drop an object here in this slot which we have an object with a script on it called calculator so I'm going to drop my calculator object here and you can see there no functions here and go down here to calculator which is a class that we created and I can look for a function there's no function in here so what I can do is I can create a function in here I'll call it I'll make it a public or public method function and Method are kind of the same term method is a class it's basically a set of instructions in a class it can be called by my name so I'm going to make this a public method it's not going to return anything so that's the second the second property to any any function or method it's whether you're going to return a value when the method is done and I'm going to call this button press now this is not the most common way to write a button event handler but I'm doing it this way because it's a lot less code right now and we can look at other ways to write an event learn the future so let's see here so one thing that you can do in unity is you can pull the event system and you'll see that I can't really just call it right now like this because I'm not using unity event system namespace now that I am using the unity event systems namespace by adding this using statement up here I can call event systems and you'll see why I'm doing this in a second event system turn on current event system and I can currently selected game object you can see that Visual Studio is providing me with tips so now I got the currently selected object I want its name so I'm going to just debug long list real quick to see what it returns now I've got this one button in here so I'm going to play I'm going to look down my log nothing's happening why is nothing happening well because I didn't hook up the calculator class button pressed method so now if I do that one thing to note is that I'm in play mode and I just change some properties over here in this inspector panel that means that when I turn off play mode these changes are going to disappear go ahead and hit that you can see all the sudden unity is returning a one okay great okay so that means that I know somebody's pressing the one that's fantastic so maybe what I want here is I want the ability to add a bunch of different buttons well so since I've already created this one it's already hooked up to this calculator script I'm going to go ahead and reassign it to the button pressed I'm going to save this just so I don't lose it ctrl s to save now I'm going to go over here and I'm going to duplicate this one one to recall this button to I'll call this bump 3 3 I'm going to load button 2 over and now if I hit T to move something you can see it starts giving me these these alignment tools which is really nice so I'm going to use T to move things from now on keep depressed so I might not give me a press but I'm just going to leave it in that state and hopefully it will align 150 so I'm going to name this I'm going to go back down I'm going to change the text string in the button so this is a three this one is a two okay so I've got these three buttons I'm going to duplicate them by hitting ctrl D you can also right click on them and go to the duplicate now I'm going to move them down because I just want to move them down so if I hit shift it will lock it on a Nexus now this is going to be four this is going to be five it's just going to be six so I'm going to get in here just for this to five this to six now ultimately we'd want to create these dynamically and so instead of doing this all by hand but again for the tutorials sake I'm just doing this by hand so you can get a feel for the editors you can get though for how things are set up and then once you get a better feel for these things I think just start to understand how to do more interesting things by script there we go get that so now let's go ahead and put the text on these and they'll transmit some 3ds without much okay good okay the other thing we're going to need is a plus - let's just do plus and minus for this pictorial here 3:9 and duplicate those will bring those two down nine will actually be plus seven well minus one bedroom there - that's plus - okay so we need one more button unfortunately I didn't leave a lot of space I'm going to try and move this all up and I'm going to add you submit or the equals button right there this buggy here change the text field equals okay so we have an equals button isn't that lined on that long CD okay all right so the last thing we're going to add is a an input field so you can see what's going on go ahead and just make one of these buttons input field and nice way to do this is to delete button script we don't need a button on this so now we have this I'll call it input field and has a little text field under there now our calculator will want to take any button that you press and update the text field with that button so that if you hit one two three shows up up here and then we want to know if you hit plus or minus it has to show up with one plus and then you hit 3 1 plus 3 and then hit the equals and it can either say 1 plus 3 equals and the result or it could just flip to the result depending on how you want to do it of course you can make this any way you want but just for the sake of this I'm going to try and make this quick here because we're already 38 minutes in okay so stop fooling around with that so let's go ahead and add a field to our calculator that we can access externally or in our editor so we want what you use the Year D text so you can see I can't I'm going to add a field then I have to in unity while in c-sharp in order to add field or add a property to your class well this is the system you filled the class you have to start off with the type of object or the type of of element your field is going to be in this case or fields going to be a text element let's just really a text class and you can do a deeper dive on these things and I can teach you how to do that later but this is going to be a text class I'm gonna call this the input field and I'm just going to go ahead let's save now you can see I've updated the script and nothing has happened up here well there are two reasons or the two ways that I could fix that one if I can make this serialize field once I say that I look here or you compile and now you see there's an input field here another way I can do this is I can make this a public field move that and you can see it's still here so it's I find it better to make a serialize field unless you really need to access this text input field outside of this class in this case we don't need to do that from another class not from the inspector but from another class in this case we're not going to do that so it's not important if you did need to do that you could either make this public or you could add a getter setter property which which then could modify this and this could be private but again that's the topic for another day so here we go we've got our field I'm going to drag in my text field and now these two are linked so I have set a reference to my text field in my info field now just really quick we know that we get string from this input then system we're getting a string value side equal to that and then we're going to call our input field we're going to send text equals button okay so now let's go ahead and let that compile you can see down at the bottom right every time you pop into unity after modifying a script it has a little wheel once that wheel finishes means that you can start you can run your project so now I can go ahead and hit any number any symbol and I get that in the input field up here if you wanted to save every button those hits or some kind of history you want to define this outside of your methods so I can define again a new field button value maybe you don't want to call this button value maybe you want to call this input value or input string then you can say input string and actually capitalizing this signature why I'm doing that it's best practice to make fields that aren't public lowercase or camelcase basically they always start with the lowercase character and then any new word in that in a variable as an application I'm gonna go ahead and put strings and put string plus equals value so let's see let's go ahead and play on that Wow that's six nothing's happening there but you can see I have an error here there's no reference exception wonder why I'm getting that exception it's interesting when I click on this I can app calculator selected is it going to select calculator there no it's not but it is saying input field is null it's interesting so it says here no reference no reference exception object reference not set to an instance of an object on calculator button press that calculator line 21 and if I double click it it'll take me the line 21 which is this one so I have a null reference to this input field if I go back here and I get my calculator script you can see that my input field is empty I must have assigned it while I was in play mode again I'm in play mode right now let me turn off play mode let me assign this text field here back to play mode 6 5 4 3 3 2 1 that's interesting it is still just displaying the text up there the reason it's doing that is because I still have my button my input field text equal to my button value that's my input string so I'm going to go ahead and change that so it's my input string I'm going to save it come back in here let it compile and then hit play 1 2 3 or well look at that I sign these backwards 6 5 4 7 8 9 minus 0 plus equals that's everything and if I keep going it does have a history of everything in there but you can't see it all go in here you can see I'm still adding characters all right look quick let's see so now we've got this going on this is kind of nice does is it is starting to look like a I do really have to update this four five six you can see four so my problem isn't that I have them set in wrong place but I just had my sign concert is four five six this six missed four and just just for keeping this consistent I'm going to move that up there okay there we go and hit save just to keep this project updated okay so unique rashes unity does like to press one once in a while okay so back to our script now I can start acting on this data now that I know I have it the first thing I'd want to do is I want to find out whether whether the input that's coming in is an integer so I'm going to go ahead and get the button value and set it to an int so the int data type is the data type that stores any whole number negative or positive and in unity well if you sharp perform functions on anything that comes in and try and convert that data that's coming in to an integer so there's I basically called the class and there's a step there's a set of static methods here that I can call so in tryparse is one of the methods that that you can use to try and parse an object or an incoming string into an integer so I'm going to go ahead and use this one tryparse tryparse returns a boolean value so if you look over here tryparse returns a boolean value you give it a string and then you give it a result I'm going to go ahead and type in tryparse I give it a string which is button value I'm going to say value or argh now argh isn't define some of the fine art here and I'm going to play out argh so if it successfully parses our button value into an integer then I'm going to perform some kind of operation on it or I'm going to save it that's what I'm going to do I'm going to go ahead and save it so in order to save it we're going to need what's called an array which is basically a variable of it's a variable that stores multiple variables so the way we define an array of integers just like this we do integer or int and then open closed bracket numbers equals new int so new int allocates space for this integer array and we're only going to allocate two spaces so I'm going to assume that we're just going to do arithmetic on two numbers and they're going to be single-digit numbers as you get more complicated you learn more programming techniques feel free or if you already know them feel free to make this calculator is fancy as you want I'm also going to make a string for our operator symbol call this operator again lowercase operator symbol so if we're successfully parsing this to an injury I'm going to store this number our integer into our array here now interestingly enough here we don't when you call an array you give it a script bus you give it a number so which refers to the slot in the array so this is an easy road base the first slot is number zero the second slot would be number one if I had more than two objects and ranked number two number three I can keep going in this case since we only have two I'm going to set I can set the first one for the number say we're done there but now then the second number that comes in is also going to be set to zero I don't that happened so I'm going to define another integer going to call this I and set it to zero and then here we're checking I is greater and 1 and I equal zero and then down here one increment I so I plus plus and commence it I plus equals one will add 1 to I or I equals I plus 1 all of these statements are basically the same I equals I plus 1 increments it I'll leave it like that just for simplicity sake ok so anybody gets confused with the other methods here so now I'm going to change this to I so the first time you press a button it's going to come in it's going to say is it a bet is it an integer if it is store it in this argh integer variable then come down here check if I is greater than 1 if I is greater than 1 so to 0 then set number slot 0 to the number or a set number slot 1 to the number and then increment I and then I'll continue going down here so now we have number I we have our numbers stored now we also need to know if integer doesn't parse our argument or button value then we do something else because we're clearly trying to either set an operator or tell this method that we want to get the arithmetic results so button the value I'm going to perform a switch on the button value if the button value is plus then our operator symbol equals plus right well you can just set it equal to bottom value break out of this if our operator is a minus and operators equal value really you can see these two things do the same thing so maybe there's a way to simplify that if our operator is an equals and we don't want to set our operators in anything what we want to do is get the results once that results equal to number zero we'll be number zero well so here we could do another switch if we're for doing so this is going to get a little complicated up here I'll do another switch and we'll switch our operator symbol so we'll switch here say is the case plus is then you our result will be our result because I haven't defined result of the variable the visual studio doesn't know exactly what's returned to me our result will be number zero plus number one for each I'm going to go ahead and define result of here as an integer notes so then our next case is a subtraction so equals number zero minus number one break break and actually don't want to break yet what we do want to do is want to set our input field to your input string input string could be button value could be plus button value and then if result is an empty also add string equals results results nothing or I guess you can do result equals nothing and it's not equal nothing that input string input string plus plus get mesh that up a bit okay so after the results and we also want to clear want to clear the you want numbers equal mu into sorry number so that will reset our numbers so here this is now this is this is a complicated looking line the reason I wrote it like this is well what this is is an if statement basically so you can see if an integer tryparse model I than this then do this else do all this well this is an if statement in one line so this says if the result is not equal to nothing or an empty string then add result to the input string variable or just return the input string variable will probably want space here maybe an equal sign plus result okay like I said it's good to jump in and out and test your project regularly so let's test this one equals zero well that doesn't look right that does not look right so that doesn't look right why does it look right because it looks like this statement here is confusing it's confusing unity so let's just say pronounce it simplify it let's actually just set input string to the result so what we'll do is we'll set input string to the button value first and then if somebody hits equals we'll just set input string and put string equals result go back here and see we have an error cannot implicitly convert us an integer to a string so result is an integer input string clearly a string so let's convert this there's a nice method on integers you just hit dot you get a static method to convert to straight do that and solve that problem now as you're learning to program in C sharp and unity you will come up with errors quite often and troubleshooting them it's extremely important so there you go 7 plus 7 equals 14 I didn't clear the input string so you can see I didn't clear the text the the input field so maybe we want to do that after after we have displayed the results so one way we could do that as we've had a bland bland display X equals false now after our input field after we've hit the equals button so here with the case where we hit equals button we just say basically display results equals true and then the next time we come in here the first thing we do is check if displayed results equals true write this out you could just check display results then input field text equals nothing or a blank string there we go okay so one plus three equals four four plus five equals nine okay you can see there's still an error so I hit nine I hit five I forget my result it didn't clear nine let's stop come back in here display results and now displayed results has equal false because we've we've already reset them let's see is that the air 2 plus 9 is 11 0 that's not the air plus 9 is 9 so the error here is that our input string equals button value plus equals a' button value here input field equals the input string so we also need to clear the input string and there we are we set everything 1 plus 5 equals 6 8 plus 9 equals 17 3 plus 5 equals 8 straight 7 minus H negative 1 7 minus 0 so I would need 1 minus 2 late one all right great so you can see this working now now you can build this and you can make your own little application you can send it off to your friends and be really proud about the calculator that does basic arithmetic but anyway so I hope this gave you a good overview of first off unity editor and kind of the things that you would need to learn to work with the editor a little bit about unity UI system and a little bit about unity programming in C sharp now again I don't think that anybody has to worry about learning everything we just went through here and memorizing anything these are things that you can you can learn with experience or things that you can research online let's pull up the unity scripting reference which I highly recommend doing unity comes with a lot of great information in their website community you need 3d and I can type anything I want I can click the reference you can see the unity 3d reference comes up is the first thing scripting API click there and you get all sorts of great things I want to know what's going on either the engine one of the Unity scripting that's reviews there are all sorts of things here some classes interfaces interfaces is also very interesting topic and we can go to that in the future but so I'm going to leave it there for now there's there's quite a lot to learn unity and you can do tons and tons of things that are really interesting kind of the sky's the limit because it's a 3d engine and you can basically create your own world do whatever you want this it's all about imagination you will and and kind of sacrificing some frustration at times but often getting some really interesting results like I said I mean this thing is a 2d calculator it's probably not that interesting most people I can easily change this to a 3d calculator by setting it to a world space well not 3d but I calculated it lives in 3d space the very least so my main camera this is something I also didn't talk about my main camera set to 5 540 make sure it's centered then my canvas now that I set it to world space lives in this 3d camera space or lives in my 2d camera space I can since I set it to a world space camera world space canvas I can now rotate this thing and it's flipping through the camera plane there yeah but I can rotate it do some interesting things and no matter how I rotate this thing see ya put it back like that I play bring this up here it's bigger I just rotated camera it's rotated that yeah 2 plus 23 plus some things not 6 plus 9 but now I have a calculator that's rotated and I can use it at a perspective which is kind of interesting so you can maybe start thinking of some really interesting things you could do with the rotations again this is just by setting it to world space we go back to screen space let's set as a flat 2d Toodee calculator okay so I'm gonna leave it there and I hope people got something out of this I look forward to any constructive comments and certainly send me emails requests for requests for different tutorials if you want I'd really like to make more tutorials I feel like it helps me kind of bacon some of the things that I I do on a regular basis and formula formalize my my terminology which is something I really need to do okay I'll see you next time I'm going to try and do one of these tutorials at least once a week and hopefully get better at them I'm sure I have plenty to improve upon here okay take care

Channel: D mak20

Views: 18,224

Keywords: Unity3D, Training, UGUI, Tutorial, C#

Id: GkHmp8xj2O0

Length: 64min 14sec (3854 seconds)

Published: Sun Jan 15 2017