You are on page 1of 11

Code lines

IMPORTANT! Make sure you copy the EXACT code lines. One small mistake can cause a big
error. The code lines you need to copy in this file are always inside 2 blue lines, like this:
The code you need to copy and paste

After going through the installation process of Android Studio and setting app your app
details, you'll notice that Android Studio already created some basic files in your app. You
need to look for a file called activity_main.xml. It should be inside res->layout. Maybe it will
already be opened in your screen and if not double-click it.
If you don't see the code lines in front of you, you're probably on the design tab. Click on the
Text tab at the bottom of the screen.
Paste the next 4 lines Just before the closing tag which should be </FrameLayout> or
</RelativeLayout>.

<WebView
android:id="@+id/activity_main_webview"
android:layout_width="match_parent"
android:layout_height="match_parent" />
It should look something similar to this:

Now, move on to a file called MainActivity.Java. If you don't see it, you'll find it under
Java->your app package name->MainActivity.
Under public class MainActivity extends activity, add the next line:

private WebView mWebView;

It should look like this:

In the same file, under protected void onCreate, just before the closing tag which is this
Sign:

add this line:

mWebView = (WebView) findViewById(R.id.activity_main_webview);

It should look like this:

If you get a red word, this means that this phrase is not recognizable by Android Studio and
it's a kind of a bug - simply delete the word and type it again. Android will pop-up a few
suggestions, search for the word you need and double-click on it. This fixes the error. Repeat
this step whenever you see a red word.
If you have this code in the MainActivity.java file, delete it:

if (savedInstanceState == null) {
getSupportFragmentManager().beginTransaction()
.add(R.id.container, new PlaceholderFragment())
.commit();
}

We're almost done, just a few more codes to add.


Add the following lines under the OnCreate method, still on the MainActivity.java file, under
the previous code you pasted there:

// Enable Javascript
WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
Now move on to a file called AndroidManifest.xml.
It should be under the Manifests library and in some cases under the src->rsc library.
Add the following line just before the closing manifest tag:

<uses-permission android:name="android.permission.INTERNET" />


It should look like this:

Back to the MainActivity.Java file, add the following line inside the onCreate method and
beneath the previous code lines you pasted there:
mWebView.loadUrl("http://yourwebsiteaddress.com/");

replace the example website address with your address.


That's it, you basically finished working on the app by asking it to show your website
whenever someone opens it in their device.
Right now, the app will load your website address but ask the user WHERE to load it in
safari, chrome or any other internet browser. We don't want the user to exit the app, we
want the website to load INSIDE the app window. In order to tell the app to open the
website inside the same window, add the following code, in the main_activity.java file under
the onCreate method and under all the code you previously added:

// Force links and redirects to open in the WebView instead of in a browser


mWebView.setWebViewClient(new WebViewClient());

That's it. But wait what if you have some external links in your website which you want
your app to load in an external browser, so your readers will understand they're getting out
of your website pages? This would be a good idea, but your app still doesn't include this
option. To add it, do the following:
Go to the Java library and right-click on your app package name. Choose new->java class and
under Name type MyAppWebViewClient and Click OK:

Now open the app package library you will see your newly created class.
Double-click it and you will see some code.
Add the following code lines under the Public Class line and before the } closing tag:

@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
if(Uri.parse(url).getHost().endsWith("yourdomainname.com")) {
return false;
}

Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));


view.getContext().startActivity(intent);
return true;
}

It should look like this:

Also, add this at the end of the Public Class line itself like you see in the image above:

extends WebViewClient
Now change the URL in the code you just pasted to the one of your website. Don't include
the www or http letters, just your domain and extention, like in the image. Here you
basically tell the app to open links with your domain name and extention in the app window,
and any external link in a new browser window.
Lastly, go back to the MainActivity.java file and under the onCreate method and all your
other code add the following lines:

// Stop local links and redirects from opening in browser instead of


WebView
mWebView.setWebViewClient(new MyAppWebViewClient());
That's it, you're done with configuring your app actions! Your app now opens your website
address once someone clicks on its icon in their device!
To make sure you don't have any errors in your code, you can hit the RUN button and wait
for the execution tasks to finish working. If you get errors, go over the instructions again and
make sure you pasted all the code lines into their correct places. Remember that even ONE
wrong tag can create an error.
Move on to the next page and add the push notifications code, once your app is published in
the store.

Adding the push notifications code lines


In your Parse.com dashboard, go to Settings -> Keys and make sure you're in the settings of
the correct app. Leave this page opened and go back to Android Studio. You will need those
keys later.
Go to your AndroidManifest.xml file and add the following code immediately before the
closing Application tag:
<service android:name="com.parse.PushService" />
<receiver android:name="com.parse.ParseBroadcastReceiver">
<intent-filter>
<action android:name="android.intent.action.BOOT_COMPLETED" />
<action android:name="android.intent.action.USER_PRESENT" />
</intent-filter>
</receiver>
<receiver android:name="com.parse.GcmBroadcastReceiver"
android:permission="com.google.android.c2dm.permission.SEND">
<intent-filter>
<action android:name="com.google.android.c2dm.intent.RECEIVE" />
<action
android:name="com.google.android.c2dm.intent.REGISTRATION" />
<!-IMPORTANT: Change "com.parse.tutorials.pushnotifications" to
match your app's package name.
-->
<category android:name="com.parse.tutorials.pushnotifications" />
</intent-filter>
</receiver>
<receiver android:name="com.parse.ParsePushBroadcastReceiver"
android:exported="false">
<intent-filter>
<action android:name="com.parse.push.intent.RECEIVE" />
<action android:name="com.parse.push.intent.DELETE" />
<action android:name="com.parse.push.intent.OPEN" />
</intent-filter>
</receiver>

It should look like this (not the whole code is shown):

Look at the grey message in the code - change the


com.parse.tutorials.pushnotifications code In the line beneath the grey message

to your package name like in the image above. You can find it at the top of the
AndroidManifest file.
Now, add the following code BEFORE the opening application tag:
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission
android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.WAKE_LOCK" />
<uses-permission
android:name="android.permission.RECEIVE_BOOT_COMPLETED" />
<uses-permission android:name="android.permission.VIBRATE" />
<uses-permission android:name="android.permission.GET_ACCOUNTS" />
<uses-permission
android:name="com.google.android.c2dm.permission.RECEIVE" />
<!-IMPORTANT: Change
"com.parse.tutorials.pushnotifications.permission.C2D_MESSAGE" in the
lines below
to match your app's package name + ".permission.C2D_MESSAGE".

-->
<permission android:protectionLevel="signature"
android:name="com.parse.tutorials.pushnotifications.permission.C2
D_MESSAGE" />
<uses-permission
android:name="com.parse.tutorials.pushnotifications.permission.C2D_ME
SSAGE" />

It should look like this:

Note that here you also need to change the package name to match yours. Make sure you
leave the code right after your package name, as stated in the message. There are 2 lines
where you should do this change this time, which are right under the grey message.
Now go to the MainActivity.Jave file and add the following code right after you entered the
previous code lines inside the OnCreate method:
Parse.initialize(this, "YOUR_APP_ID", "YOUR_CLIENT_KEY");

Here is where you need to use your Parse keys. Go to the settings page on Parse and paste
your app id key and your client key into Android Studio, replace the words YOUR_APP_ID
and YOUR_CLIENT_KEY in the code to your key numbers.
Lastly, add the following code under all the other codes in the OnCreate method:
ParseInstallation.getCurrentInstallation().saveInBackground();
Run the app to make sure there are no error.
To re-publish the app you'll have to change the version number. Go to a file called
build.gradle. There are 2 files with this name, make sure you're NOT in the file that's under
the Parse library, but the one in your app library.

You should have this code inside defaultConfig, and if not simply add it before the closing
tag:
versionCode 1
versionName "1.0"
It should look like this:

Change the version code from 1 to 2 and the version name from 1.0 to 1.1.
Build the APK again and republish to Google Play Store.
Now each time you'll have to update your app, for any reason, raise the version code and
name numbers.

Adding Admob codes


The first think you'll need to do is add the Google Play Services SDK. Click on the SDK icon on
the top of the screen, here.
You might see some packages that are already chosen for you, which Android suggests you
to install. You should install them, but it's not a must. Just make sure you select Google Play
Services and Google Repository which are under Extras.
Click Install Packages and accept the terms.
If you can't install the packages, close Android Studio and search for it again on your
computer. Right-click it and choose Run As Administrator.
Then go to the SDK manager again and select Google Play Services, Google Repository and
the default packages if you want to install them too.
This time you will be able to install everything.
go to the build.gradle file of your app and add the next line under dependencies:
compile 'com.google.android.gms:play-services:6.+'

Click on the play button to run the app and make sure you don't have errors.
Move to the AndroidManifest.xml file and add these lines just before the opening Activity
tag:
<!--This meta-data tag is required to use Google Play Services.-->
<meta-data android:name="com.google.android.gms.version"
android:value="@integer/google_play_services_version" />

Add the next lines before the closing Application tag:


<!--Include the AdActivity configChanges and theme. -->
<activity android:name="com.google.android.gms.ads.AdActivity"
android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|sc
reenSize|smallestScreenSize"
android:theme="@android:style/Theme.Translucent" />

Now go to a file named strings.xml which is under the src-main-res-values libraries.


Add the next line before the closing resources tag:
<string name="banner_ad_unit_id">ca-app-pub-3940256099942544/6300978111</string>

Now go back to the page with your admob ad unit and copy the ad unit id.
It should start with the letters CA and end with a forward slash and a number.

Now go to the Main_activity.xml file and place the next line after the line which ends with
match_parent:
xmlns:ads="http://schemas.android.com/apk/res-auto"

Also, add these lines just before the closing Layour tag:
<com.google.android.gms.ads.AdView
android:id="@+id/adView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
ads:adSize="BANNER"
ads:adUnitId="@string/banner_ad_unit_id">
</com.google.android.gms.ads.AdView>

The last file you'd need to modify is MainActivity.java.


Add the next lines under the import line:
import com.google.android.gms.ads.AdRequest;
import com.google.android.gms.ads.AdView;

And the next lines under the onCreate methos and all your previously added lines:
AdView mAdView = (AdView) findViewById(R.id.adView);
AdRequest adRequest = new AdRequest.Builder().build();
mAdView.loadAd(adRequest);

Run your app to make sure you don't get any errors,
Before republishing the app, go to the build.gradle and change the versionCode and
versionName.
Click on Build- Generate Signed SDK and enter your keystore details. Once your APK is
created, republish it to Google Play Store and you're done!