![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
|
Android関連 > JavaScriptからネイティブのUIを変更する(Android) JavaScriptからネイティブのUIを変更する(Android) †説明 †Androidではメインのスレッド以外はUIを変更する事はできない。（例外が発生する） 以下は、WebViewに表示したHTML上から、ネイティブ(Androidアプリ)側の UI を変更するサンプル。 activity_main.xml †<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp" >
<EditText
android:id="@+id/editText1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ems="10"
android:inputType="text|textUri" >
</EditText>
</LinearLayout>
<WebView
android:id="@+id/webView1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:focusable="true"
android:focusableInTouchMode="true">
<requestFocus />
</WebView>
</LinearLayout>
MainActivity.java †import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.view.View;
import android.webkit.WebView;
import android.widget.TextView;
public class MainActivity extends Activity {
private static final String START_URL = "file:///android_asset/index.html";
public Handler handler = null;
@Override
protected void onCreate(Bundle savedInstanceState) {
Log.d("DEBUG", "onCreate");
// メインViewをセット
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// WebView で JavaScript を使用可能にしておく
WebView webview = (WebView) findViewById(R.id.webView1);
webview.getSettings().setJavaScriptEnabled(true);
// JavaScriptインターフェースに 自身のインスタンスと handler を渡しておく
handler = new Handler();
MainJsInterface jsIf new MainJsInterface(this, handler);
webview.addJavascriptInterface(jsIf, "Android");
// ページ読み込み後のイベント設定
webview.setWebViewClient(new WebViewClient() {
public void onPageFinished(WebView view, String url) {
TextView text = (TextView) findViewById(R.id.editText1);
text.setText(url);
}
});
// ページ読み込み
webview.loadUrl(START_URL);
}
}
MainJsInterface.java †public class MainJsInterface {
Activity activity;
Handler handler;
MainJsInterface(Activity a, Handler h){
activity = a;
handler = h;
}
@JavascriptInterface
public void setText(final String text){
handler.post(new Runnable(){
@Override
public void run() {
TextView textView = (TextView) activity.findViewById(R.id.editText1);
textView.setText(text);
}
});
}
}
index.html †<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script type="text/javascript">
var setAndroidViewText = function(){
var text = document.getElementById('text1').value;
Android.setText(text);
};
</script>
</head>
<body>
<input type="text" id="text1" value="TEST1" >
<input type="button" onclick="setAndroidViewText();">
</body>
</html>
|
