목록Flutter (5)
Seung's Learning Record
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bSNqdr/btrNwCY8TTT/cwkkA9oXKlwT2YdMvBNmh0/img.png)
앱을 구동시키면 뜨는 첫 화면으로, 주로 브랜드의 포인트 컬러를 배경으로 두고 로고를 중앙에 띄우는 형식으로 만들어진다. 첫 화면을 그냥 메인 페이지로 만들려 했는데 이왕 플러터 쓰는 거 완성도 높은 앱 UI를 만들어 보고 싶어 져서 스플래시 스크린부터 만들기로 결정했다. 그리고 메인 페이지보다 만들기가 훨씬 쉬워서 만들면서 전반적으로 코드를 공부하기 좋을 거 같기도 했다ㅎㅎ. 자 그럼 거두절미하고 본론 시작. SplashScreen() 스플래시 화면은 상태의 변화를 즉각적으로 사용자가 확인할 필요 없는 화면이므로 stless로 작성했다. 어플의 로고만 띄우는 것이 아닌 이미지까지 같이 하고 싶었기에 적당한 배경 이미지 사진을 찾아 컨테이너의 배경으로 넣은뒤 자식 위젯으로 로고 이미지를 넣었다. clas..
플러터 공부를 위해 구글링을 하다 보면 여기저기서 stateless위젯과 stateful위젯의 차이를 포스팅한 글들이 튀어나온다. 그리고 그 많은 글 중에서 단번에 코알못을 이해시켜주는 글을 찾기란 생각보다 쉽지 않다. 이글 저글 다 읽어가며 한 지식 동냥한 결과를 여기에 적어둬야 까먹었을 때 다시 기억해내기 쉬울 거 같아서 포스팅을 한다. StatelessWidget statelessWidget은 말 그대로 상태를 가지지 않는 위젯이다. 플러터의 코드를 보면 UI는 build 메소드가 호출되면서 만들어진다. stateless위젯은 이 build 메소드를 화면이 생성되는 순간, 그 한 번에만 호출을 한다. 이게 무엇을 뜻하느냐 하면, 처음 화면이 생성된 후에 변수의 값이 바뀌어도 화면에는 바뀌기 전의 변..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bihnJv/btrNwFOCD0e/jJ3Byy1Dhu8Wr89wijes9K/img.png)
1. 프로젝트 구조 프로젝트의 구조를 살펴보면 여러 폴더들이 존재하는데 우리는 lib 폴더와 pubspec.yaml를 가장 많이 고칠 것이다. 2. pubspec.yaml pubspec.yaml 은 gradle이나 maven처럼 패키지 모듈을 설치하고, 버전에 의존성 등을 관리해주는 설정 파일이다. 우리가 배포하는 앱의 패키지, 의존하는 외부 라이브러리, 개발용 라이브러리, 플러터 안에서 사용되는 assetsassets을 사용하고 관리해준다. 해당 파일에 dependencies에 외부 모듈 사용을 작성하고 난 후, 프로젝트 안에서 사용하기 위해서는 반드시 pub get을 하여 수정사항을 반영해 주어야 한다. 3. main.dart 초기 프로젝트에서 앱의 전체적인 동작 내용이 코딩된 부분이다. main.d..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/KCHuG/btrNhOSSjMZ/EdXwV7vKhkaGgVEAFbVp2k/img.png)
1. 프로젝트 구조 프로젝트의 구조를 살펴보면 여러 폴더들이 존재하는데 우리는 lib 폴더와 pubspec.yaml를 가장 많이 고칠 것이다. 2. pubspec.yaml pubspec.yaml 은 gradle이나 maven처럼 패키지 모듈을 설치하고, 버전에 의존성 등을 관리해주는 설정 파일이다. 우리가 배포하는 앱의 패키지, 의존하는 외부 라이브러리, 개발용 라이브러리, 플러터 안에서 사용되는 assetsassets을 사용하고 관리해준다. 해당 파일에 dependencies에 외부 모듈 사용을 작성하고 난 후, 프로젝트 안에서 사용하기 위해서는 반드시 pub get을 하여 수정사항을 반영해 주어야 한다. 3. main.dart 초기 프로젝트에서 앱의 전체적인 동작 내용이 코딩된 부분이다. main.d..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bbAwAZ/btrNjS0Yf53/63pZUAuEPmxYMSF2JEVhG1/img.png)
이번 학기 캡스톤 디장인 수업을 들으며 하게 된 플젝에서 이 플러터를 사용하여 앱 개발을 하게 되었고, 개발을 위해 사전 공부를 하던 중 잊고 지냈던 블로그의 존재가 생각나서 정리를 하러 들어왔당..ㅎ. 학기가 시작되고 완전 잊어버렸..ㅜㅜ 플러터(flutter)는 구글에서 만든 모바일 앱 프레임 워크다. Android 앱을 만들 땐 Kotlin을, 아이폰 앱을 만들 땐 Swift를 쓰는 등 뭔가를 만들려면 언어를 공부해야 한다. 하지만 Flutter를 사용하면 Dart언어를 사용한 코드 하나로 Android와 iphone앱을 둘 다 만들 수 있다. Dart 언어의 문법은 JavaScript의 문법과 굉장히 유사해서 웹 개발만 해본 사람도 쉽게 앱 개발을 할 수 있을 것이다. 현재 내 상황에서 플러터의 ..