웹앱은 웹코드를 이용하여 앱을 만드는 방법입니다.
이번 시간에는 안드로이드 스튜디오를 이용하여 웹앱 프로젝트를 생성하여 간단히 테스트하는 과정을 살펴보겠습니다.
주의사항
운영체제 계정명에 한글이 포함되어 있으면 진행시 문제가 발생합니다.
새로운 계정을 생성 후 진행하는걸 추천합니다.
사전준비
안드로이드 스튜디오 설치(참고링크)
1. 안드로이드 스튜디오 프로젝트 생성하기
- 안드로이드 스튜디오 실행(설치 후 첫 화면) 후 Start a new Android Studio project 클릭
- Empty Activity 클릭 후 Next 클릭
- 프로젝트 항목들을 입력 후 Finish 클릭
Name : 앱 이름
Package name : 패키지명
Save location : 저장 위치
Laguage : 언어로 Java 선택
2. 웹앱을 위한 소스코드 수정 및 html 파일 추가
- app 폴더 > java 폴더 > 패키지명 폴더 > MainActivity 클릭
- 기존 코드를 다음 코드로 수정
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | package com.example.myapplication; import androidx.appcompat.app.AppCompatActivity; import android.os.Bundle; import android.webkit.WebChromeClient; import android.webkit.WebSettings; import android.webkit.WebView; import android.webkit.WebViewClient; import android.widget.LinearLayout; public class MainActivity extends AppCompatActivity { WebView web; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); LinearLayout layout = new LinearLayout(this); layout.setOrientation(LinearLayout.VERTICAL); web = new WebView(this); WebSettings webSettings = web.getSettings(); webSettings.setJavaScriptEnabled(true); webSettings.setUseWideViewPort(true); webSettings.setBuiltInZoomControls(false); webSettings.setAllowUniversalAccessFromFileURLs(true); webSettings.setJavaScriptCanOpenWindowsAutomatically(true); webSettings.setSupportMultipleWindows(true); webSettings.setSaveFormData(false); webSettings.setSavePassword(false); webSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN); web.setWebChromeClient(new WebChromeClient()); web.setWebViewClient(new WebViewClient()); web.loadUrl("file:///android_asset/index.html"); layout.addView(web); setContentView(layout); } } | cs |
- 메뉴에서 File > New > Folder > Assets Folder 클릭
- Finish 클릭
- assets 폴더 우클릭 > New > File 클릭 후 index.html 입력
- index.html에 테스트 코드 입력 : 기본 html로 작성된 코드를 입력합니다.
샘플 다운로드 : 
index.html
3. 에뮬레이터 설치
- 메뉴 Tools > SDK Manager 클릭
- Android SDK > SDK Tools > Intel x86 Emulator Accelerator (HAXM installer) 체크 후 OK 클릭
- 에뮬레이터가 사용할 RAM 크기를 설정. 보통 Recommended로 할당하면 됩니다.
4. 가상 장치 생성
- 메뉴 Tools > AVD Manager 클릭
- Create Virtual Device.. 클릭
- 가상 장치 종류 선택(원하는 장치가 있으면 선택하면 됩니다.) Phone > Pixel 2 선택
- Pie 옆에 Download 클릭(아래 이미지에는 미리 설치되어 있어 Download 버튼이 안보입니다.)
- 가상 장치 이름(AVD Name) 설정 후 Finish 클릭
5. 테스트
- 메뉴 Run > Run 'app' 클릭
- 실행 결과 화면
이상으로 웹앱 프로젝트 생성 및 테스트 과정을 살펴봤습니다.
