Convert a Website into Android Application with Navigation Drawer Layout

In this Article I will teach you how to make Professional looking Android WebView Application with Navigation drawer Layout. And i also provide you the source code of my application which i show you in video.

Features of App:
  1. Navigation Drawer Layout
  2. Dedicated progress bar
  3. Two dedicated menu
  4. Advance webview integration
  5. External link opening in browser
Android Studio


Steps:

1. Create a New Project in Android Studio like the screenshot and choose your desire Appame and Package Name. 

New Project in Android Studio

2. Select the SDK to Minimum like me or you can choose yours own too.

Android Studio

3. Now in third step select "Navigation Drawer Activity", You can choose any of activity but because we are creating navigation drawer so it is easy to choose navigation drawer.

Android Studio Navigation Drawer


4. Now Here not change anything, just click on Finish and after that actual work begins.

Android Studio

5. Now Navigate to MainActivity.java and double click on it

Android Studio Main Activity

6. Now Copy and Paste below Code into MainActivity.java file. Replace my package name with your's in first line of code. In Line No 65 replace "http://www.kknlive.com" with your URL. Don't add anything special paste in same same format you are looking. Next Change the URLs of Menu button from line 111 to 121. After that again change the URL in line number 132 and after that if you want to change the progress bar text then you can change it on line number 149 and 150.


Now we are done with Java Files. If android studio shows any errors ignore them. All errors will be gone by the end of this tutorial.

7. Now Scroll to Layout Folder and there you find many .xml files. So, now paste the below code on "activity_main.xml"

8. Now Paste the below code in "app_bar_main.xml

9. Now Paste below code in "content_main.xml

10. Now paste below code in "navigation_header_main.xml"


11. Now Scroll to Menu Folder and Open "activity_main_drawer.xml" and paste the below code there, you can edit the details of menu as per your requirement.

12. Now Paste the below code in "main.xml", this is for secondary menu. 

Now we have completed the xml files. 


13. Now we just have to give the permission of internet access in Manifest.xml file, Now paste the below code after the package name and above the application activity in "AndroidManifest.xml


By this we had finished all coding Part. Now you can run your app in emulator or on your phone now in next article i will explain you how to change the icon and how to add splash screen and many more things and for this i had also made separate video which is embeded with this article if you have any problem to understand this article you can watch the video, i explain everything in that video.


Hope you like this tutorial article, if you want more articles like this please do comment your feedback in comment section and share this with your buddies and loved ones.









Post a Comment

0 Comments