반응형 플로터4 [.3] 플러터-Flutter WebView 를 이용한 플로터 하이브리드 앱 프로젝트 Flutter WebView 하이브리드 앱 개발중이던 반응형 웹 사이트를 안드로이드 앱에서 서비스해보기 위해 플로터 웹뷰(WebView)를 이용한 하이브리드 앱을 만들어 보려고 합니다. 예제 코드는 구글(codelabs.developers.google.com, docs.flutter.dev)가이드를 스터디하며 진행된 결과 입니다. 1. Create Flutter New Project 안드로이드 스튜디오 New Project 에서 빈 프로젝트를 생성 합니다. 프로젝트 생성시 추가해야할 플로터 웹뷰(WebView) 관련 옵션은 없습니다. 프로젝트 생성 후 main.dart 까지 확인~ 2-1. Flutter WebView 플러그인 종속 추가 안드로이드 스튜디오 하단 [Terminal] 텝을 선택하고 프로젝트.. 2022. 11. 4. [.2] 플러터-(Flutter) - Android Studio AVD 가상 디바이스 설치 Android Virtual Device(AVD) 생성 Flutter WebVIew 테스트를 위해 Android Virtual Device(AVD) 를 생성 합니다. 안드로이스 스튜디오 메인 화면에서 오른쪽 상단에 Device Manager (클릭) 드로이드가 빼꼼 나와 있는 아이콘 보이시죠? ^^ 테스트할 안드로이드 기기를 선택 합니다. 여기서는 Nexus 6 1440px 2560px 을 선택 했습니다. 안드로이드 API Level 을 선택 합니다. 앞서 Flutter 프로젝트 생성 후 Android -> app -> src -> build.gradle 에서 확인해 보니 API 33 을 자동으로 잡아와서 여기서도 33 버전으로 다운로드를 받았습니다. 다운로드가 완료 되면 화면 하단에 [Next] 버튼이.. 2022. 11. 1. [.1] 플러터-(Flutter) 안드로이드 스튜디오 IDE - 플로터 프로젝트 생성 플로터(Flutter) 네이티브 앱 만들기 Dart 와 첫 만남 1. 안드로이드 스튜디오 IDE 실행 2. 안드로이드 스튜디오 앱 프로젝트 생성 안드로이드 스튜디오 실행 후 Welcome to Android Studio 팝업창에서 "New Flutter Project" 를 선택 합니다. New Flutter Project 선택 후 New Project 팝업 왼쪽에 Flutter 를 선택합니다. 만약 Flutter SDK path: 가 비어 있으면 [...] 버튼을 눌러 SDK 설치 폴더를 선택해 줍니다. Flutter SDK 는 안드로이드 스튜디오와 별도로 직접 설치했던 폴더 입니다. SDK 폴더 선택 후 [ OK ] 클릭 Flutter New Project 창에서 프로젝트 설정을 합니다. 안드로이드 스.. 2022. 10. 30. [.1]구글 플러터-(Flutter) 크로스플랫폼 개발 환경 설정 Android Studio 구글 플로터는 어떤 IDE 를 지원 하는가? 플로터는 모든 텍스트 에디터와 커멘트라인 도구를 지원 한다고 합니다. 하지만 좀더 낳은 개발 환경을 위해 에디터 플러그인을 지원하는 에디터 사용을 권장 하네요. 공식 추천은 Android 스튜디오 혹은 VS Code 에 플러그인 추가 라고 합니다. 저는 Android Studio를 사용하겠습니다. 안드로이드 스튜디오가 많이 무겁기는 합니다. 노트북에서 개발 중인데 팬돌아가는 소리가 @@ 누가 보면 게임 하는 줄 알겠어요 ㅠㅠ Why? 팔은 안으로 굽는 다고 ㅎㅎ 또한 VS Code 는 이미 프론트/퍼블리싱용으로 사용 중이라 거기에 또 이런저런 SDK 설치가 꺼려지네요 ^^;;; 먼저 Flutter SDK 설치 https://docs.flutter.dev/ Fl.. 2022. 10. 4. 이전 1 다음 반응형
