隨著智慧型手機普及,任何人都輕易的在隨時隨地都瀏覽網站。所以開發者通常會使用響應式設計,或建立一個app,方便使用者在手機也能瀏覽。然而,在開發app部分,可以自己動手寫,或利用 Cordova這類工具開發並協助發佈app。可是網站如果已經寫好,卻又沒時間轉換成app的話,該怎麼辦呢?就利用 Android webview寫一隻簡單的瀏覽器程式,瀏覽網頁吧![2017/05/26 更新]


開發準備

  • 下載 Android Studio
  • 使用模擬器,或準備你的 Android手機進行測試

開啟新專案

在 Android Studio之中開啟一個新專案,選擇 Empty Activity

開好專案後,你就會看到目錄下有這些檔案。而待會要修改這四個地方:AndroidManifest.xml、activity_main.xml、MainActivity.java、style.xml


1. 加入網路權限

在 AndroidManifest.xml之中加入以下 Permission

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


2. 修改 Layout

開啟 activity_main.xml,把原本的內容清除,放上webview物件,這麼一來 app打開就只能瀏覽網頁





3. 修改主程式

編輯 MainActivity.java檔案

  • 需要import webView,WebSettings 與 webViewClient。
  • 直接使用 WebView會開啟瀏覽器瀏覽,想要在 app內開網頁要使用 webViewClient。
  • 為了讓 Javascript能順利執行,需要加入呼叫 setJavaScriptEnabled


package com.example.jerry.myapp2;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.WebView;
import android.webkit.WebSettings;
import android.webkit.WebViewClient;

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

WebView webview = (WebView) findViewById(R.id.webview);
WebSettings webSettings = webview.getSettings();
webSettings.setJavaScriptEnabled(true);
setContentView(webview);
webview.setWebViewClient(new WebViewClient());
webview.loadUrl("https://jerrynest.io/");
}
}


4. 最後一步,移除標題欄

修改 style.xml檔案,設定為 NoActionBar



測試結果

拿傑瑞窩測試 ,比較一下有無隱藏標題列,右邊就清爽許多囉!


Troubleshooting

測試過程中,若跳出 adb server didn't ack,有可能是其他程式占據 adb.exe的port 5037,kill掉即可解決。
已下是 windows指令,找使用 port 5037的程式

$ netstat -aon | findstr "5037" | more

例如某程式 PID為1234,檢查該程式的名稱

$ tasklist /FI "PID eq 1234"

可以透過工作管理員或用指令 kill掉 PID為1234的程式

$ taskkill /F /PID 1234

Reference