1. Home
  2. Training Library
  3. Programming
  4. Programming Courses
  5. Introduction to Android Studio, Kotlin, and Basic App Layouts

Project Completion

Start course
Overview
Difficulty
Beginner
Duration
3h 39m
Students
1
Description

This course begins by downloading Android studio - make sure you watch the appropriate video depending on whether you're on Mac or Windows. Then, we'll take a tour off the Android Studio interface and see how apps are put together. You'll learn about text views, buttons, and images to build a user interface for our app, and we'll also write some code to make our apps interactive.

Then we'll move onto a practical project in which we make a temperature converter app, which converts temperatures from Fahrenheit to Celsius. You'll be able to follow, building the app, and then running it on your system.

Intended Audience

This course is intended for beginners to Android app development or anyone who wants to master coding in Kotlin.

Prerequisites

Since this is a beginner level course, there are no requirements, but any previous experience with coding would be beneficial.

Transcript

Hello and welcome back. In this video, we'll put it all together. And I have my code copied over from the playground which we covered in the last video as comments so we can follow along. And the formula that I have over here is to convert toCelsius from Fahrenheit which is what this method toCelsius is going to do. So, if you are going to implement this for the toFahrenheit method, remember to change the formula. All right, let's get started. The first step here, we had declared the string my input value and in this case we have to capture this from our app. So right here, this is our edit text view and this is where the user is going to input, right here, the temperature to convert. And then once they 'click' on this toCelsius button, we should be in this method. 

So, let's go ahead and create a reference to this. I'm going to get rid of this log statement right here. So, I'll say val Fahrenheit and I'll just reference it as the view and I will set it to binding; we have our binding variable. Remember, we had enabled view binding over here, dot and the ID for that edit text view. If you look at it, that's right here. Edit text number decimal. So, it should pop up once I start typing this. There you go. Edit text number decimal. So, now we have a reference to the view. And this is the view itself. Now we have to get the string to get to this step where we have the temperature, but the string value of it and we'll save that as Fahrenheit value. So, val fahrenheitvalue and we'll set it to fahrenheitView.text. But remember this text property of our view, this returns an editable type. That's not a string. So, it's not a string that we can convert to a number later on. Right. So,

to get the string, we have to convert this to string. So, I'll say toString. Okay. So, now we have the Fahrenheit value in this state. So, the next step is simple enough, we're going to go to our conversion. But before we do that, let's make sure we're on the right track and everything is working. So, I'll enter in a log here, Log.i. I'll say, "entered Fahrenheit value" and the message will be Fahrenheit value. Since we're converting this to string already, this should work. Okay. I have a red here, I don't know, logging tag can be at most 23 characters. All right. It's just too big. So, I'll change this to  [Author Typing] Fahrenheit value. There we go. All right. Let's run our app and make sure everything is working. [no audio] We'll pull up the emulator. 

I'll also pull up the log screen, right here. [no audio] All right, here we go. So, let's enter a temperature here. I'll enter in 75 Fahrenheit. Okay, and then if I "Click" on toCelsius, I expect to see 75 displayed over here. So toCelsius, there you go. Fahrenheit value 75. Perfect. So, we're on the right track. Now, back to our code. Actually before we do that, I want to get back to my emulator. Let me bring back the log screen. I want to show you something. Here, if I actually leave this empty, if I get rid of this and then "Click" on toCelsius, you see nothing happens, right? Because I don't have anything here. Because I haven't entered anything. But if I tried to use this formula that references that and try to do multiplication or division or whatever else with it, that's going to throw an error. 

So, I have to make sure that the user is entering something here and that string is not empty. All right. So, we need to use an "if else" condition to make sure the string is not empty. We'll do that right here. I'll get rid of this log and the condition will go like this. If string not empty and I'll write this out later. But for now I'm just leaving that there, open curly brace, close curly brace, then do something and then else if the string is empty then we want to notify the user that they need to enter a value to convert. So, I'll do this with a toast. So, I'll say Toast.makeText, the context is this and then within quotes, I'll say, "you must enter a value to convert" and then toast dot I'll say length long and then obviously with toast we have to show it, so dot show. All right. 

Now, let's come back to this condition right here. For now I'll say, if false, here I'll say do something. But what is the condition? How do we test that the string is empty? Well, there are a few ways to check if the string is empty and what we'll do to make this easy is we Google it. This way you also get to see how, when you don't know how to perform a step, you can quickly look it up. I'll say, "Kotlin test if string is empty." [no audio] All right. Use isEmpty when you want to test that a string is exactly equal to the empty string. Use isBlank when you want to test that a string is empty or only consists of whitespace. We can also use isNullOrBlank. Let's use isBlank, back here. So, I'll say if fahrenheitValue.isBlank right there. But what will this return? This will test for if it isBlank. I don't want to test for if it's blank, I want to make sure to enter this block if it's not blank. 

So, how do you test for the opposite of the condition that you're checking. You can do that by simply entering an exclamation mark before the condition. This turns it into the opposite test. So, now it's checking if not blank. Okay. So, if Fahrenheit value is not blank, then I want to perform the calculation. So, let's try this out. I'll simply copy this over here, command C and paste it back here. So, val, my converted value equals my input text. Well, I don't have my input text, I have fahrenheitValue and dot toDouble since we want to convert the string to a double and there is the formula. And the next part you see is to make this user friendly by converting it to string but with two decimal digits. So, let's use this, command C, command V. 

Now instead of toPrint, I'll say celciusValue string format, all this is okay. All right. So, now that I have this value, let's let the user know. So, Toast.makeText, context will be this. And what is the text that we want? Well, we can use string interpolation or template string over here and say fahrenheitValue. Fahrenheit is dollar sign celsiusValue degrees Celsius. Okay. And then I'll go to the next line after the comma toast, let's use length long and then dot show to display it. Okay, and that is it for the code. Now that was a lot of code. So, I would recommend if you had confusion about any of the steps to take a look at it again. Also, if you have any confusion about any of the steps we took to do our calculation or conversion, then look at the previous video where we came up with this solution. Right. Why these steps were important, but because we did that, we were able to directly plug it in over here. 

Okay. So, let's test it out at this point and see if it works. Let's run it.  [no audio] All right, looks like it worked. Let's pull it up. There's our emulator. Let's enter our temperature say 75 then toCelsius. There you go. 75 Fahrenheit is 23.89°C. Great. Let's try 32. This should give us zero. There you go. 32 Fahrenheit is 0°C. Now, let's try the case where we don't enter anything and then 'click' toCelsius, you must enter a valid value to convert. Fantastic. So, that completes the code for toCelsius and as you can see toFahrenheit would be almost exactly the same except for the value calculation. The formula would be different and the string would slightly be different as well. So, my recommendation is you give toFahrenheit a try by yourself and try to make it work. 

Again, the functionality would be exactly the same as here. All right, good luck. And with that, we come to the end of the first section of android development. Congratulations on having made it this far. We've built several apps in this section and got them to work and hopefully you now feel reasonably comfortable with android studio and how it all fits together to create layouts, how to integrate code and all that good stuff. And in the next section, we're going to jump into working with media, some basic animation, sound, and more fun projects. I hope you're excited. I'll see you in the next section.

 

About the Author

Mashrur is a full-time programming instructor specializing in programming fundamentals, web application development, machine learning and cyber security. He has been a technology professional for over a decade and has degrees in Computer Science and Economics. His niche is building comprehensive career focused technology courses for students entering new, complex, and challenging fields in today's technology space.

Covered Topics