서비스를 해야할 일이 있어 앱을 만들까 하다가 웹 페이지를 만들어서 웹과 모바일 양쪽에서 사용 하는게 좋을것 같아 간단한 테스트를 해봅니다.

 

일단 껍데기만 있는 앱을 하나 만들어 봅니다.

 

1. 프로젝트 생성


android_webview


이런! 만들고 나니 WebWEb으로 하였군요.  아무리 구상 단계지만 너무 성의가 없네요.


android_webview


어째든 샘플이니까 그냥 계속 진행 합니다.


android_webview


Empty Activity를 선택하고 나머지는 그냥 Next 버튼을 클릭 합니다.

 


2. 레이아웃 수정

 

Layout을 수정할 차례군요.


android_webview


기본으로 생성되는 Hello World는 삭제하고


android_webview


좌측 Palette에 있는 WidgetsWebView를 찍어서 우측에 넣어 줍니다.


android_webview


단순하지만 원하는 모양 입니다.

 

 

3. 코딩

 

이제 코딩을 시작 합니다.


3.1 AndroidManifest.xml


인터넷을 사용하려면 권한이 있어야 하니 권한을 추가 합니다.

 

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

 

3.2 activity_main.xml


Layout에 추가한 WebViewID를 생성해 줍니다작업할 때 생성했으면 넘어갑니다.

 

<WebView
   
android:id="@+id/webvw"
   
android:layout_width="match_parent"
   
android:layout_height="match_parent"
   
tools:layout_editor_absoluteX="8dp"
   
tools:layout_editor_absoluteY="8dp" />

 

3.3 MainActivity.java


마지막으로 웹 페이지가 나오도록 코딩을 완료 합니다.

 

webView = (WebView) findViewById(R.id.webvw);
webView.setWebViewClient(new WebViewClient());

webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);

webView.loadUrl("https://copycoding.tistory.com");

 

 

4. 결과

 

https://copycoding.tistory.com를 호출한 결과를 볼까요?


android_webview


 

잘 나오는 군요. 가상 서버에서 작업 중인 로컬 웹 서버를 호출해 보았습니다.

 

webView.loadUrl("http://192.168.1.118:8080/tistory/");

 


android_webview

 

예쁜 이미지만 입히면 되겠습니다.  이제 열심히 일만 하면 되겠군요.

 


5. 전체 소스

 

5.1 AndroidManifest.xml

 

<?xml version="1.0" encoding="utf-8"?>
<manifest
xmlns:android="http://schemas.android.com/apk/res/android"
   
package="copycoding.tistory.mobileweb">

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

    <application
       
android:allowBackup="true"
       
android:icon="@mipmap/ic_launcher"
       
android:label="@string/app_name"
       
android:roundIcon="@mipmap/ic_launcher_round"
       
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>

 

 

5.2 activity_main.xml

 

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
   
xmlns:app="http://schemas.android.com/apk/res-auto"
   
xmlns:tools="http://schemas.android.com/tools"
   
android:layout_width="match_parent"
   
android:layout_height="match_parent"
   
tools:context=".MainActivity">

    <WebView
       
android:id="@+id/webvw"
       
android:layout_width="match_parent"
       
android:layout_height="match_parent"
       
tools:layout_editor_absoluteX="8dp"
       
tools:layout_editor_absoluteY="8dp" />
</android.support.constraint.ConstraintLayout>

 

 

5.3 MainActivity.java

 

package copycoding.tistory.mobileweb;

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

public class
MainActivity extends AppCompatActivity {

   
private WebView webView;
    private
WebSettings webSettings;
   
@Override
   
protected void onCreate(Bundle savedInstanceState) {
       
super.onCreate(savedInstanceState);
       
setContentView(R.layout.activity_main);

       
webView = (WebView) findViewById(R.id.webvw);
       
webView.setWebViewClient(new WebViewClient());

       
webSettings = webView.getSettings();
       
webSettings.setJavaScriptEnabled(true);

       
webView.loadUrl("https://copycoding.tistory.com");
   
}
}



+ Recent posts