SOURCE CODE
MainActivity.java
package ng.com.onlinemedia.tourguide;
import android.app.Activity;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
public class MainActivity extends Activity {
private WebView mWebView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mWebView = (WebView) findViewById(R.id.activity_main_webview);
// Force links and redirects to open in the WebView instead of in a browser
mWebView.setWebViewClient(new WebViewClient());
// Enable Javascript
WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
// Use remote resource
// mWebView.loadUrl("http://example.com");
// Stop local links and redirects from opening in browser instead of WebView
//mWebView.setWebViewClient(new MyAppWebViewClient());
// Use local resource
mWebView.loadUrl("file:///android_asset/www/index.html");
// Prevent the back-button from closing the app
@Override
public void onBackPressed() {
if(mWebView.canGoBack()) {
mWebView.goBack();
} else {
super.onBackPressed();
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
return super.onOptionsItemSelected(item);
Activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/activity_main_webview"></WebView>
</LinearLayout>
AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="ng.com.onlinemedia.tourguide">
<uses-permission android:name="android.permission.INTERNET" />
<application
android:allowBackup="true"
android:icon="@drawable/icon"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
Index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,
minimum-scale=1, user-scalable=no, minimal-ui">
<meta name="mobile-web-app-capable" content="yes">
<meta name="theme-color" content="green">
<title>Tour Guide</title>
<!-- Path to Framework7 Library CSS-->
<link rel="stylesheet" href="css/framework7.material.min.css">
<link rel="stylesheet" href="css/framework7.material.colors.min.css">
<!-- Path to your custom app styles-->
<link rel="stylesheet" href="css/app.css">
</head>
<body class="theme-green">
<!-- Status bar overlay for fullscreen mode-->
<div class="statusbar-overlay"></div>
<!-- Panels overlay-->
<div class="panel-overlay"></div>
<!-- Left panel with reveal effect-->
<div class="panel panel-left panel-reveal">
<div class="content-block">
<div class="list-block">
<ul>
<li>
<a href="map.html" class="item-link close-panel">
<div class="item-content">
<div class="item-inner">
<div class="item-title">
Map
</div>
</div>
</div>
</a>
</li>
<li>
<a href="gallery.html" class="item-link close-panel">
<div class="item-content">
<div class="item-inner">
<div class="item-title">
Gallery
</div>
</div>
</div>
</a>
</li>
<li>
<a href="history.html" class="item-link close-panel">
<div class="item-content">
<div class="item-inner">
<div class="item-title">
History
</div>
</div>
</div>
</a>
</li>
<li>
<a href="about.html" class="item-link close-panel">
<div class="item-content">
<div class="item-inner">
<div class="item-title">
About Groove
</div>
</div>
</div>
</a>
</li>
<li>
<a href="project.html" class="item-link close-panel">
<div class="item-content">
<div class="item-inner">
<div class="item-title">
About App
</div>
</div>
</div>
</a>
</li>
<li>
<a href="help.html" class="item-link close-panel">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Help
</div>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
<!-- Views-->
<div class="views">
<div class="view view-main">
<div class="pages navbar-fixed">
<div data-page="index" class="page">
<div class="navbar navbar-fixed">
<div class="navbar-inner">
<div class="center">Groove Guide</div>
<div class="right"><a href="#" class="open-panel link icon-only"><i class="icon
icon-bars"></i></a></div>
</div>
</div>
<div class="page-content">
<div class="content-block-title">Welcome To Osun Osogbo Groove Guide</div>
<div class="content-block-title">Check Out The List of Centers</div>
<div class="list-block">
<ul>
<li><a href="yemo.html" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Yemoo house</div>
</div>
</div></a></li>
<li><a href="totoise.html" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Flying Tortoise</div>
</div>
</div></a></li>
<li><a href="sea_goddess.html" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Sea goddess</div>
</div>
</div></a></li>
<li><a href="yard.html" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title">The Yard</div>
</div>
</div></a></li>
<li><a href="pav.html" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Pavilion</div>
</div>
</div></a></li>
<li><a href="concotion.html" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Concoction</div>
</div>
</div></a></li>
<li><a href="bridge.html" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title">The Suspension Bridge</div>
</div>
</div></a></li>
<li><a href="mapo.html" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Iya Mapo</div>
</div>
</div></a></li>
<li><a href="ela.html" class="item-link">
<div class="item-content">
<div class="item-inner">
<div class="item-title">Ela</div>
</div>
</div></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!--views-->
<!-- Path to Framework7 Library JS-->
<script type="text/javascript" src="js/framework7.min.js"></script>
<!-- Path to your app js-->
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>