1
00:00:00,420 --> 00:00:01,440
Welcome back.

2
00:00:01,600 --> 00:00:07,350
In this chapter, we are going to build a calculator and I want to show you what the calculator can

3
00:00:07,350 --> 00:00:08,750
do and what it can do.

4
00:00:08,760 --> 00:00:10,670
So there are some limitations here.

5
00:00:10,680 --> 00:00:16,440
And the idea behind this calculator is that you learn to build complex UI, so to speak.

6
00:00:17,630 --> 00:00:23,600
So a complex user interface, which means the graphical user interface that we can see all of those

7
00:00:23,600 --> 00:00:29,000
buttons positioned correctly with the right distance to each other and so forth, because, as you can

8
00:00:29,000 --> 00:00:31,190
see, they are all equally distant to each other.

9
00:00:32,189 --> 00:00:37,050
And detectives are all the same size and so forth, so this is something that you have to take into

10
00:00:37,050 --> 00:00:42,750
consideration when building such a way that it looks good and it's really a rather boring example.

11
00:00:42,750 --> 00:00:47,700
Of course, calculators are super boring, in my opinion, because it's just an app that everybody has

12
00:00:47,700 --> 00:00:49,320
on his phone anyways.

13
00:00:49,530 --> 00:00:52,710
But it's a very good example for building such a UI.

14
00:00:52,920 --> 00:00:58,050
And it's also something that you probably get quite a lot at university.

15
00:00:58,050 --> 00:01:03,780
So if you ever go to university and have it there or programming, then it's very likely that they will

16
00:01:03,780 --> 00:01:08,460
ask you to build a calculator or you build a calculator at one point and university.

17
00:01:09,030 --> 00:01:14,070
And because this is a rather early stage in the course, we're not going to use third party libraries

18
00:01:14,070 --> 00:01:14,490
for this.

19
00:01:14,490 --> 00:01:16,410
We're just going to use basic code.

20
00:01:16,410 --> 00:01:24,300
And that will also limit the functionality of our calculator because we cannot use super large numbers

21
00:01:24,300 --> 00:01:26,810
and we cannot use super precise numbers either.

22
00:01:27,000 --> 00:01:31,340
So dividing is going to be a huge problem for our calculator.

23
00:01:31,590 --> 00:01:36,780
For example, if we divide a value here, you can see this is the result that we get.

24
00:01:36,960 --> 00:01:44,070
And now if I want to do any additional calculations afterwards, it won't work because the application

25
00:01:44,070 --> 00:01:49,000
is limited to 12 values here or to 12 digits, so to speak.

26
00:01:49,560 --> 00:01:50,060
All right.

27
00:01:50,070 --> 00:01:53,550
And if I clear and then I do some other.

28
00:01:54,590 --> 00:01:59,940
Operations, you can see I can do multiple operations after another.

29
00:01:59,960 --> 00:02:00,890
It's no issue.

30
00:02:01,870 --> 00:02:10,990
And all of them work fine, but as soon as I have a huge number or a very long entry, as you can see

31
00:02:10,990 --> 00:02:13,330
here, then it gets limited.

32
00:02:13,360 --> 00:02:15,910
So now I cannot do anything with it anymore.

33
00:02:15,910 --> 00:02:18,280
At that point, I have to clear my calculator.

34
00:02:18,290 --> 00:02:21,130
So that's just a limitation of the data types that we have as well.

35
00:02:21,400 --> 00:02:27,610
So, for example, the doubled in DeLong's, all of those data types that we're using, they are limited

36
00:02:27,610 --> 00:02:34,240
to a certain amount of digits and that's what we have limited to to just 12 to make sure that everything

37
00:02:34,240 --> 00:02:35,100
is still going to work.

38
00:02:36,590 --> 00:02:42,470
Of course, we have to be careful, dividing by zero is always a problem, so we get the result of infinity.

39
00:02:43,520 --> 00:02:49,820
All right, so at this point, you can try to build this, you are yourself and many things could go

40
00:02:49,820 --> 00:02:51,760
wrong, but that's no problem.

41
00:02:51,800 --> 00:02:54,170
If you want, just go ahead and try to build this.

42
00:02:54,170 --> 00:02:56,210
You are just an advice from my side.

43
00:02:56,540 --> 00:03:01,500
Use linear layouts, so don't use the constraint layouts where you just drag stuff in there.

44
00:03:01,520 --> 00:03:06,650
Of course you can do that and it might work as well, but it's going to be a pain to make everything

45
00:03:06,650 --> 00:03:10,150
equally far from each other and really well positioned.

46
00:03:10,370 --> 00:03:14,430
So I would really recommend to go ahead and use linear layouts.

47
00:03:14,660 --> 00:03:15,920
So how are we going to do it?

48
00:03:15,920 --> 00:03:17,240
Is the whole thing.

49
00:03:17,990 --> 00:03:20,800
The whole app is going to be within a linear layout.

50
00:03:21,200 --> 00:03:25,160
Then we have a TextField here at the top, which takes quite some space.

51
00:03:25,430 --> 00:03:28,100
Then we have a linear layout for all the buttons here.

52
00:03:28,140 --> 00:03:33,560
So for one row or each row will be a linear layout which contains the individual buttons.

53
00:03:33,860 --> 00:03:38,360
And then we have a linear layout which contains all of the different rows.

54
00:03:38,810 --> 00:03:40,820
So that's pretty much it.

55
00:03:41,330 --> 00:03:49,430
In order to get to double width here for a button, what you can do is you can use a functionality called

56
00:03:49,430 --> 00:03:49,990
weight.

57
00:03:50,000 --> 00:03:52,430
So layout underscore weight.

58
00:03:52,640 --> 00:03:54,560
That's the property that you have to work with.

59
00:03:54,830 --> 00:03:59,930
So, for example, the zero button has a layout weight of two, all of the individual buttons, they

60
00:03:59,930 --> 00:04:02,920
have a layout weight of one and the equal sign.

61
00:04:03,110 --> 00:04:08,120
You could think that it has a layout way to four, but it actually also has a layout weight of one because

62
00:04:08,300 --> 00:04:11,180
it's the only element in that role here.

63
00:04:11,190 --> 00:04:16,160
We can see there are three elements of the zero has a weight of two and each of those buttons has the

64
00:04:16,170 --> 00:04:16,790
weight of one.

65
00:04:16,790 --> 00:04:22,400
So the zero will be as big as or as wide as two other buttons.

66
00:04:22,820 --> 00:04:25,100
The same goes for the individual rows.

67
00:04:25,100 --> 00:04:27,310
So each row is equally high.

68
00:04:27,350 --> 00:04:29,930
So they all have a layout weight of one.

69
00:04:30,110 --> 00:04:33,860
So they are equally poll or equally high.

70
00:04:34,490 --> 00:04:34,820
All right.

71
00:04:34,820 --> 00:04:36,500
So this is just a little side note.

72
00:04:36,740 --> 00:04:38,840
If you want, you can go ahead and try it yourself.

73
00:04:38,960 --> 00:04:40,450
If you do, then good luck.

74
00:04:40,460 --> 00:04:43,940
And if you don't want to do it, you just want to watch the videos, then of course, you can do so

75
00:04:43,940 --> 00:04:44,360
as well.

76
00:04:44,390 --> 00:04:50,060
And then the next video, I'm going to show you how to build that where I will show you one way of building

77
00:04:50,060 --> 00:04:50,170
it.

78
00:04:50,180 --> 00:04:56,630
Of course, there are multiple different ways of building this UI and maybe you have a even nicer version

79
00:04:56,630 --> 00:04:57,490
or something at that.

80
00:04:57,740 --> 00:05:02,840
So I hope you enjoyed this little exercise and this little app and see you in the next video.