Introduction: How to Make an Android App Using Visual Studio
In this Instructables we will be learning how to prepare and run example code on an Android phone using Visual Studio. I used a Samsung Galaxy S20, but this code will work on any Android device. We will be creating an app that turns your flashlight on by the press of a button. By the end of this Instructable you will become familiar with using the Visual Studio IDE. As well as some basic Android programming methods, such as creating elements, controlling hardware, and working with packages. These topics will teach you the basics of app development so that you can go on and learn more advanced programming topics.
Supplies
- Android Phone
- Windows Computer
- Internet Access
- USB cable to connect your Android phone to your computer
Step 1: Download Visual Studio
Go to the Visual Studio page here and select the Download Visual Studio button. The download should start shortly after. Select somewhere on your computer to save the download, I recommend saving to your desktop.
Step 2: Set-Up Visual Studio
Run the download file, it should be called vs_community__927645998.1618848418.
After running the download file, a window should pop up called "Visual Studio Installer". Select the Continue button.
A new window should appear asking you to select different workloads to download. Select the Mobile development with .NET and Mobile development with C++. After selecting these press the Install button. This process may take several minutes to download and install.
Step 3: Download Visual Studio Extensions
After the workspaces have downloaded, Visual Studio should have started. If not, press the windows button + s and search for Visual Studio and run it.
Select the Continue without code option underneath "Create a new project". A new window should load with a tool bar spanning the top of the windows. Follow these steps to install the needed extensions:
- Select the Extensions tool bar at the top of the window
- Select the option to Manage Extensions
- Search for the extension called Java Tools for Android Project (Visual Studio 2019)
- Select the download button next to the extension
- Close out of the extensions window
- Close out of the Visual Studio window
- You should be prompted with a windows called VSIX Installer, select the Modify button
- After a few seconds a new windows should appear saying "Modifications Complete", close out of that window
Step 4: Set-Up Your Android Phone
These steps are DIFFERENT depending on the phone you are using. Here is a link to the different ways to do so on different Android Versions.
These are the instructions I followed for my Samsung Galaxy S20.
First, you need to enable Developer Options on your phone.
- Go into the Settings menu
- Select the button called "About phone"
- Select the button called "Software information"
- Select the button called "Build Number" 7 times in a row
Now that Developer Options are enabled we need to enable USB debugging on your device.
- In the Settings menu select the new option "Developer Options"
- Enable the option called "USB debugging"
- A prompt should appear called "Allow USB debugging?", select OK
Now we need to connect our phone to the computer using a USB cable. If your computer doesn't already have the Android USB Driver for Windows installed, you can install it here.
Step 5: Create a Test Project
Reopen Visual Studio by pressing the windows button + s and searching for Visual Studio and run it.
Select the option called Create a new project under "Get started". It will ask you for what kind of application you would like to create.
- Under the All platforms tab select Android
- Under the All project types tab select Mobile
- Select the Android App (Xamarin) option and press the next button.
- You should be sent to a page wanting you to enter a project name, name it TestAndroidApplication.
- Select the check box next to Place solution and project in the same directory.
- Press create when done.
Now you should be prompted with what kind of template you want to use, in this example I used Single View App and selected the Android Version 9.0(Pie). The version may differ depending on what Android version you are using. Press OK when done.
Step 6: Run the Test Application
Now you should be sent to a new window with lots of code on it. Ignore the daunting looking code, all we want to do is run the code. Press the green arrow button at the top of the screen to run the code. It should have the name of the android device you are using next to it. If you don't see this. Unplug your android device from your computer and plug it back in. Once you pressed the green arrow to run the app. Wait a few seconds for it to compile. You should see a simple app running on your phone that says "Hello world".
Step 7: Create a Blank App Project
First you will need to close out of Visual Studio, then reopen it so you are sent back to the home menu. Now select the option called Create a new project under "Get started". It will ask you for what kind of application you would like to create. Under the All platforms tab select Android, and under the All project types tab select Mobile. Select the Basic Application (Android, Ant) option and press the next button. You should be sent to a page instructing you to enter a project name, name it FlashlightApp. Also make sure that Place solution and project in the same directory is selected. Press the create button when done.
Step 8: Import the Needed Packages
Now the file called FlashlightApp.java should show up on the main window. If not, you can find it in the Solution Explorer at FlashlightApp->src->com->FlashlightApp->FlashlightApp.java.
Now we need to import the write packages to get the code we use later on to work. Add the code below:
ADD THIS CODE
import android.view.View;import android.widget.Button;import android.graphics.Color;import android.hardware.camera2.CameraAccessException;import android.hardware.camera2.CameraManager;<br>
UNDERNEATH THIS CODE
import android.os.Bundle;
Step 9: Creating a Button
Now we need to delete some of the default code that's was created with the project with code that will create a button.
DELETE THIS CODE
/* Create a TextView and set its text to "Hello world" */TextView tv = new TextView(this);tv.setText("Hello World!");setContentView(tv);<br>ADD THIS CODE
// This portion of code creates the button and sets its propertiesButton button = new Button(this); // Creates a buttonbutton.setBackgroundColor(Color.BLACK); // Sets background colorbutton.setTextColor(Color.GRAY); // Sets text colorbutton.setText("Flashlight"); // Sets text to "Flashlight"setContentView(button); // Sets button size to Step 10: Add Button Logic
Now we need to create the method for what the button should do when pressed. Add this code below the code we entered for creating the button.
ADD THIS CODE UNDER THE BUTTON CODE
// This portion of code if the logic of the button press button.setOnClickListener(new View.OnClickListener() // Checks for when any button is clicked { int i = 2;// Used for button logic public void onClick(View button) // Checks for when the button called "button" is clicked { if(i%2 == 0) // When button is pressed { button.setBackgroundColor(Color.BLACK); // Sets background color to black i++; // This portion of code is for setting the camera on try { cameraManager.setTorchMode(getCameraID, false); // Sets flashlight off } catch (CameraAccessException e) { e.printStackTrace(); } } else // When button is pressed again { button.setBackgroundColor(Color.WHITE); // Sets background color to white i++; // This portion of code is for seting the camera on try { cameraManager.setTorchMode(getCameraID, true); // Sets flashlight on } catch (CameraAccessException e) { e.printStackTrace(); } } } });<br>Step 11: Add a Flashlight Controller
Now we need to add the code to get the flashlight to work.
ADD THIS CODE UNDER THE CLASS
private CameraManager cameraManager;private String getCameraID;<br>
ADD THIS CODE UNDER THE BUTTON CODE
// This portion of code initializes the flashlight on your device and then gets the IDcameraManager = (CameraManager) getSystemService(Android1.CAMERA_SERVICE);try {getCameraID = cameraManager.getCameraIdList()[0];} catch (CameraAccessException e) {e.printStackTrace();}<br>Step 12: Compile and Run the Code
Press the green arrow button at the top of the screen to run the code. It should have the name of the android device you are using next to it. If you don't see this. Unplug your android device from your computer and plug it back in. Once you pressed the green arrow to run the app. Wait a few seconds for it to compile. You should see an app called FlashlightApp running on your phone.
Step 13: Test Out the App
Press the button called Flashlight. Then color of the button should change to white, and the flashlight on your phone should turn on. Pressing the button again should change the button color back to black and the flashlight off.
Congratulations, you just created your first Android app!
Be the First to Share
Recommendations
Build a UV Level Monitoring Budgie - Using IoT and Weather Data APIs by Hey Jude in Arduino
28 2.0K
DIY Weather Station With ESP32 by Giovanni Aggiustatutto in Electronics
558 46K
Automated 35mm Slide Digitizer by rbwood53 in Arduino
123 12K
Life Sized Talking BMO From Adventure Time (that's Also an Octoprint Server!) by katzcreates in 3D Printing
87 7.5K
Plywood Contest
Back to School: Student Design Challenge
CNC and 3D Printing Contest
2 Comments
tytower
1 year ago
Can you post the complete code as a text file please (or in any editor type file). That way it can be used by many other coding programs without trying to piece together your code and picking up garbage with copy and paste.
I use Linux so I have Visual Studio Code.
Its good that you share this as its a very useful technique. Thanks.
Penolopy Bulnick
1 year ago
Thanks for sharing :)
