[Android] 안드로이드에서 웹뷰로 자신이 만든 웹사이트 띄우기

이번에는 안드로이드 웹뷰를 통해서 자신이 만든 개인 홈페이지를 핸드폰에 띄우는 방법을 한번 알아보도록 하겠습니다. 자기가 만든 홈페이지가 아닌 네이버나 다음 같은 사이트도 띄울 수 있습니다. 우선 자신이 안드로이드 상에서 띄울 웹사이트가 있어야겠죠? 웹사이트가 반응형이라면 자신의 핸드폰 해상도에 맞게 웹사이트의 컴포넌트가 자동으로 재배치되기 때문에 반응형 웹으로 만들어 놓으시면 더더욱 좋습니다. 저는 BootStrap을 활용하여 간단하게 웹페이지를 제작해봤습니다. (BootStrap에서 반응형 웹을 지원하거든요) BootStrap을 활용하실 분들은 앞선 포스팅을 참조해주세요.

스프링에서 부트스트랩 적용하기

 

※반응형웹이란? :

반응형 웹 디자인을 기반으로 다양한 디바이스(PC, 태블릿 PC, 스마트폰, 스마트 TV 등)에 대응하는 웹을 말합니다. 반응형 웹은 기기의 해상도에 따라 레이아웃이 반응하여 웹페이지를 나타냅니다. 따라서 어떤 해상도의 디바이스로 접근하더라도 레이아웃이 최적화된 사이트를 볼 수 있어 사용자 입장에서 사용하기 편리한 웹사이트를 제작할 수 있습니다.

 

안드로이드에서 웹뷰로 자신이 만든 웹사이트 띄우기 

1. 안드로이드에 자신이 만든 웹페이지를 띄울 수 있는 방법을 알려드리겠습니다.

우선 자신이 안드로이드 웹뷰에 띄울 웹페이지를 위와같이 하나 제작합니다.

 

Manifest.xml

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

2. 인터넷이 연결되어있어야겠죠?? manifest로 가서 인터넷 사용권한을 주도록 합니다.

 

XML

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

 <WebView
        android:id="@+id/webview_login"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</LinearLayout>

 

3. 안드로이드 XML에 웹뷰 위젯을 화면 가득 채워주세요.

 

Webview_action.java

public class Webview_action extends AppCompatActivity{

    private WebView mWebView;
    private WebSettings mWebSettings;

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

        mWebView = (WebView)findViewById(R.id.webview_login);
        mWebView.setWebViewClient(new WebViewClient());
        mWebSettings = mWebView.getSettings();
        mWebSettings.setJavaScriptEnabled(true);

        mWebView.loadUrl("http://"+ip+":80/spring_mybatis/");
    }
}

4. 안드로이드 Java에 위에있는 소스를 복사해서 붙여줍니다.

 

mWebView.loadUrl("http://"+ip+":80/spring_mybatis/");

이부분에서 ip는 자신의 ip번호:자신의 포트번호/자신의 홈페이지 주소를 써주시면 됩니다. 

저 같은 경우에는 주소가 spring_mybatis/로 되어있어 저렇게 써주었습니다. 

여기까지 하시면 완성입니다.

한번 실행시켜보도록 하겠습니다.

 

보시는 바와 같이 웹사이트가 잘 띄워졌군요 이상으로 포스팅을 마치도록 하겠습니다.