분류 전체보기85 Flutter 앱 개발 4 : Material App 생성 플러터 UI 는 위젯으로 시작해서 위젯으로 끝난다. 심지어 앱 자체도 MaterialApp 위젯이다. 일단, 프로젝트의 lib/main.dart 에 아래 소스를 붙여 넣어 보자. import 'package:flutter/material.dart'; void main() { runApp(MaterialApp( title: 'Space Daily', home: FlutterLogo(), )); } 실행 결과부터 보고 소스 설명을 해보자. 중앙에 플러터 로고가 나온다. :) 간단한 소스지만, 중요한 포인트를 설명해 보자면, 1) runApp() 함수 플러터 앱은 runApp 함수 호출로 시작된다. runApp 호출 시, 넘겨주는 위젯이 앱의 루트 위젯이 된다. 코드 자체는 간단해 보이지만, 내부적으로 플랫폼.. 2021. 1. 2. Flutter 앱 개발 3 : 앱 아이콘 추가 아이콘을 1024 x 1024 크기로 준비한다. InkScape 로 공돌이 갬성으로 그려서 PNG 파일로 export 했다. 안드로이드 앱 아이콘은 폰 해상도별로 다양한 크기로 준비해 줘야 한다. 직접 만들기 귀찮아서 App Icon Generator 라는 사이트를 활용했다. 사이트에 만들어둔 이미지를 추가 한후 'Generate' 라고 적혀있는 파란색 버튼을 누르면 AppIcons.zip 파일이 다운로드 된다. 파일의 압축을 풀고 AppIcons > android 아래에 있는 모든 디렉토리를 프로젝트의 android > app > src > main > res 아래에 복사하면 아이콘 준비가 끝난다. :) # 다운로드 폴더 에서 unzip AppIcons.zip cd AppIcons cp -r AppIc.. 2021. 1. 2. Flutter 앱 개발 2 : 프로젝트 생성 패키지 ID를 com.drogrammer.apod 로 하는 프로젝트를 생성해보자. flutter create --org com.drogrammer apod 결과적으로, 아래와 같은 디렉토리 구조가 생성된다. 시작은 쉽다. ㅎㅎ; . └── apod ├── android │ ├── app │ │ └── src │ │ ├── debug │ │ ├── main │ │ │ ├── java │ │ │ │ └── io │ │ │ │ └── flutter │ │ │ │ └── plugins │ │ │ ├── kotlin │ │ │ │ └── com │ │ │ │ └── drogrammer │ │ │ │ └── apod │ │ │ └── res │ │ │ ├── drawable │ │ │ ├── mipmap-hdpi .. 2021. 1. 2. Flutter 앱 개발 1 : 기획 (Space Daily) 최근 취미로 천문 사진 관련 안드로이드 앱 'Space Daily' 를 출시 했다. 이 앱을 기반으로 플러터 개발 및 출시 과정에 대해서 공유하고자 한다. Space Daily - Apps on Google Play Every day, you can see stunning photos of the universe with brief descriptions from astronomers. In addition, you can save high-quality photos to your phone's gallery. All photos and information are provided through the NASA Astronomy Picture of the Day (A play.google.com 1. 목.. 2021. 1. 2. Flutter 는 왜 Declarative UI 를? Flutter 공식 페이지에도 소개되는 내용이지만 한번 더 소화해서 정리해 보자. Introduction to declarative UI Explains the difference between a declarative and imperative programming style. flutter.dev Imperative vs. Declarative 일단 Imperative 와 Declarative 의 차이부터 알아보자. Imperative는 명령형 Declarative는 선언형 을 의미한다. 뭔 말이지? 아래 Flutter 공식 사이트에 나오는 예제로 이야기해 보자. 배경색을 노란색에서 빨간색으로 변경하고 ViewB 타입의 b에 있는 ViewC 타입의 c1과 c2를 없애고 대신 ViewC 타입의 c3 를.. 2020. 12. 31. Flutter 첫 어플리케이션 뭔지 몰라도 일단 한번 만들어보자! 1. 패키지 생성 커맨드 라인 상에서 com.mycompany.hello_flutter 패키지를 생성해 보자. 참고로 --org 옵션을 사용하지 않으면 패키지 이름이 com.example.hello_flutter 가 되어 나중에 출시 시점에 귀찮아 지므로 미리미리 설정해 두자. flutter create --org com.mycompany hello_flutter 참고로 VS Code 에서 Ctrl + Shift +p 로 command pallete 를 열고 "Flutter: New Application Project" 를 실행하여 GUI 상에서 프로젝트를 생성할 수도 있다. 하지만, 패키지 이름 prefix가 com.example 로 하드 코딩 되므로 추후 귀찮게 바.. 2020. 12. 31. 이전 1 ··· 7 8 9 10 11 12 13 ··· 15 다음
