1 00:00:00,173 --> 00:00:01,463 (upbeat music) 2 00:00:01,463 --> 00:00:02,835 (swoop) 3 00:00:02,835 --> 00:00:05,330 (typing) 4 00:00:05,330 --> 00:00:06,680 In this section we're going to create 5 00:00:06,680 --> 00:00:09,480 a basic calculator, as you can see on the screen, 6 00:00:09,480 --> 00:00:11,220 and that's gonna give us a chance to practise 7 00:00:11,220 --> 00:00:13,110 what we've learned about layouts 8 00:00:13,110 --> 00:00:15,620 with a more complex example and we'll also be 9 00:00:15,620 --> 00:00:17,353 connecting code to a lot more buttons 10 00:00:17,353 --> 00:00:19,573 than in our previous button click app. 11 00:00:20,780 --> 00:00:21,830 In this section, we're gonna look at 12 00:00:21,830 --> 00:00:24,810 working with groups of widgets to see how we can do things 13 00:00:24,810 --> 00:00:28,340 like constraining them to be positioned as a group, 14 00:00:28,340 --> 00:00:29,960 as well as setting common properties 15 00:00:29,960 --> 00:00:32,780 for multiple widgets at the same time. 16 00:00:32,780 --> 00:00:35,110 And we'll also show a slightly different approach 17 00:00:35,110 --> 00:00:37,160 to creating on OnClickListener, 18 00:00:37,160 --> 00:00:40,670 so that the same method can be used by multiple buttons. 19 00:00:40,670 --> 00:00:43,470 Now this app as you can see is a basic calculator 20 00:00:43,470 --> 00:00:46,070 and it will let you enter numbers using the app's buttons, 21 00:00:46,070 --> 00:00:48,590 then perform the calculation when any of the 22 00:00:48,590 --> 00:00:49,810 operation keys are pressed. 23 00:00:49,810 --> 00:00:52,720 The plus, minus, multiply and divide. 24 00:00:52,720 --> 00:00:55,170 Now the stock Android calculator builds up the 25 00:00:55,170 --> 00:00:57,630 calculation on the screen, and doesn't actually 26 00:00:57,630 --> 00:01:00,650 evaluate it until you press the equals sign. 27 00:01:00,650 --> 00:01:02,690 But ours is going to evaluate each sum 28 00:01:02,690 --> 00:01:05,069 as soon as you press the next operator, 29 00:01:05,069 --> 00:01:07,040 just like early calculators did. 30 00:01:07,040 --> 00:01:08,440 And we'll have two lines for display 31 00:01:08,440 --> 00:01:09,580 so you can see though, 32 00:01:09,580 --> 00:01:12,230 so you will be able to see both numbers at once 33 00:01:12,230 --> 00:01:14,110 and won't have to remember the previous one, 34 00:01:14,110 --> 00:01:16,450 like you did with those early calculators. 35 00:01:16,450 --> 00:01:19,520 And also, unlike the early calculators, it'll show you 36 00:01:19,520 --> 00:01:21,730 which operation it will perform next, 37 00:01:21,730 --> 00:01:23,350 so you don't lose track. 38 00:01:23,350 --> 00:01:26,270 Pressing equals will update the display with the result. 39 00:01:26,270 --> 00:01:29,170 It can also be used to start a new calculation 40 00:01:29,170 --> 00:01:32,320 by transferring the entered number up into the result, 41 00:01:32,320 --> 00:01:33,950 ready to use in the next calculation. 42 00:01:33,950 --> 00:01:36,870 First let's have a quick demonstration here 43 00:01:36,870 --> 00:01:39,480 of this calculator app to see how it actually works. 44 00:01:39,480 --> 00:01:41,500 So I can enter a number like by clicking on it, 45 00:01:41,500 --> 00:01:42,333 nine 46 00:01:43,750 --> 00:01:48,273 and multiply three equals 27. 47 00:01:49,510 --> 00:01:51,010 Then I can also continue with that 48 00:01:51,010 --> 00:01:52,690 by putting 10 49 00:01:54,470 --> 00:01:56,060 multiplied 50 00:01:56,060 --> 00:01:58,100 and you can see the value's getting updated there, 51 00:01:58,100 --> 00:02:00,300 and we can clear it by just pressing equals, 52 00:02:01,430 --> 00:02:03,990 and I can type in something like 20 53 00:02:03,990 --> 00:02:05,220 plus 54 00:02:05,220 --> 00:02:07,660 to add 20 to it so I've got the value of 290. 55 00:02:07,660 --> 00:02:09,220 And the other thing that we're gonna be doing 56 00:02:09,220 --> 00:02:10,669 in this section of the course is working with 57 00:02:10,669 --> 00:02:13,160 both portrait and landscape versions. 58 00:02:13,160 --> 00:02:15,410 So if I'm going to serve it to landscape now, 59 00:02:18,460 --> 00:02:21,260 and you can see we've got a slightly different result there. 60 00:02:21,260 --> 00:02:23,750 We've got the layout looking a little bit different 61 00:02:23,750 --> 00:02:26,540 to take advantage of landscape mode. 62 00:02:26,540 --> 00:02:28,690 So we'll be learning how to do that as well. 63 00:02:28,690 --> 00:02:30,493 I'll just move that back to portrait. 64 00:02:32,413 --> 00:02:35,210 And then also I've got the value that we've been using 65 00:02:35,210 --> 00:02:37,272 stayed there when we moved from landscape 66 00:02:37,272 --> 00:02:40,400 back to portrait, and then from portrait to landscape. 67 00:02:40,400 --> 00:02:42,410 And we'll also be showing you how to do that 68 00:02:42,410 --> 00:02:44,610 in this section of the course as well. 69 00:02:44,610 --> 00:02:46,720 And later in this section, we're going to have a look 70 00:02:46,720 --> 00:02:50,650 at guidelines, which can be used in a constraint layout 71 00:02:50,650 --> 00:02:53,160 to a link which is either vertically or horizontally 72 00:02:53,160 --> 00:02:55,220 so that you can anchor widgets to them. 73 00:02:55,220 --> 00:02:57,600 Right, so let's move back now to Android Studio 74 00:02:57,600 --> 00:02:59,500 and we can start work on this project. 75 00:03:00,960 --> 00:03:03,380 So let's get started now creating a new project 76 00:03:03,380 --> 00:03:05,440 and then in the next video we're gonna look 77 00:03:05,440 --> 00:03:08,060 at the actual layout of our calculator. 78 00:03:08,060 --> 00:03:10,230 So start Android Studio and we're gonna click on 79 00:03:10,230 --> 00:03:12,373 start a new Android Studio project. 80 00:03:13,550 --> 00:03:15,413 Now I'm gonna call this calculator, 81 00:03:15,413 --> 00:03:17,550 (typing) 82 00:03:17,550 --> 00:03:20,350 I'm going to leave the company domain name the same, 83 00:03:20,350 --> 00:03:21,840 learnprogramming.academy. 84 00:03:21,840 --> 00:03:25,130 Now Android Studio's suggesting a suitable location, 85 00:03:25,130 --> 00:03:27,910 project location, ending with a care calendar directory 86 00:03:27,910 --> 00:03:30,840 and you can store the project somewhere else if you want. 87 00:03:30,840 --> 00:03:33,530 But Android Studio normally remembers where you've told it 88 00:03:33,530 --> 00:03:35,540 to create projects so only the 89 00:03:35,540 --> 00:03:37,480 fallout directory name changes. 90 00:03:37,480 --> 00:03:40,210 So I'm gonna leave it as the default onscreen there, 91 00:03:40,210 --> 00:03:42,100 and there's another important option we have to select 92 00:03:42,100 --> 00:03:44,330 on the screen, and that's this option down here to 93 00:03:44,330 --> 00:03:46,310 include Kotlin support. 94 00:03:46,310 --> 00:03:48,550 Now remember to tick that box if you wanna generate 95 00:03:48,550 --> 00:03:51,260 Kotlin code and make sure it's unticked 96 00:03:51,260 --> 00:03:52,660 if you want Java code. 97 00:03:52,660 --> 00:03:54,470 In my case, I'm going to leave it ticked 98 00:03:54,470 --> 00:03:55,520 and click on next 99 00:03:56,650 --> 00:03:58,350 and we're gonna continue to use the minimum 100 00:03:58,350 --> 00:04:01,410 STK of 17 and you can see this API 17 101 00:04:01,410 --> 00:04:03,150 is already selected here. 102 00:04:03,150 --> 00:04:04,980 So you wanna make sure that that is checked 103 00:04:04,980 --> 00:04:07,190 and leave everything else unchecked 104 00:04:07,190 --> 00:04:08,853 and then click on next again. 105 00:04:10,870 --> 00:04:13,230 Now we're not going to have a menu in this application, 106 00:04:13,230 --> 00:04:15,520 so empty activity which is selected here 107 00:04:15,520 --> 00:04:17,700 for me automatically is our best choice 108 00:04:17,700 --> 00:04:18,670 for the template to use, 109 00:04:18,670 --> 00:04:20,300 so make sure you select that 110 00:04:20,300 --> 00:04:21,942 and click on next again. 111 00:04:23,200 --> 00:04:25,220 And once again we're just going to accept the names 112 00:04:25,220 --> 00:04:28,150 that Android Studio has suggested for both the 113 00:04:28,150 --> 00:04:30,380 activity name and the layout name, 114 00:04:30,380 --> 00:04:34,260 and just make sure that both the generate layout file 115 00:04:34,260 --> 00:04:37,030 and backwards compatibility AppCompact check boxes 116 00:04:37,030 --> 00:04:39,593 are checked and then click on finish. 117 00:04:41,210 --> 00:04:42,480 So that's the project created, 118 00:04:42,480 --> 00:04:44,920 I'm gonna leave it just building 119 00:04:44,920 --> 00:04:47,080 and in the next video we'll actually start producing 120 00:04:47,080 --> 00:04:49,200 the layout for our calculator app. 121 00:04:49,200 --> 00:04:50,900 So I'll see you in the next video.