🕊 Flutter/강의 6

날씨 어플 만들기

관습적으로 폴더 분리할 때, services는 데이터 처리, screens는 UI를 담당한다. 기초 개념 class는 청사진이다. flutter에서 거의 모든 것을 만들 때 이 청사진을 사용한다. object는 실제 만들어지는 제품이라고 생각하면 된다. class는 두가지 중요한 것이 있다. 바로 properties와 method이다. 차로 비유하면 properties는 차의 색깔, 좌석수 이런 것이고, method는 drive(), break() 같은 것이다. class Car { int numberOfDoors = 5; void drive (){ print('wheels start to turing'); } } 변수도 class안에 들어가면 property라고 불리고, 함수도 class안에 들어가면 ..

🕊 Flutter/강의 2022.04.21

주사위 어플 만들기

우선, 처음 main.dart 파일안에 들어가는 파일은 다음과 같다. import 'package:flutter/material.dart'; void main() { return runApp( MaterialApp( home: Scaffold( backgroundColor: Colors.red, appBar: AppBar( title: Text('Dicee'), backgroundColor: Colors.red, ), body: DicePage(), ), ), ); } class DicePage extends StatelessWidget { @override Widget build(BuildContext context) { return Container(); } } 처음 알았다. body: DicePag..

🕊 Flutter/강의 2022.04.08

5강 Flutter 박스 디자인 하는 법

맥에서 안드로이드 스튜디오 자동완성 기능 사용하기 설정 => 키보드 => 입력소스 => 입력 메뉴에서 다음 소스 선택 탭을 체크한다. 이제 control + space를 누르면 자동완성이 잘 되는 것을 확인 할 수있다. 지난 과제 1. appBar 디자인 하는 법 위에 이미지처럼 appBar안에 텍스트를 적어야한다. 그냥 Text('내용') 으로 적으면 오류가 난다. AppBar()안에 적으려면 title 이라는 친구를 적어야한다. 또한 자동으로 가운데로 배치가 되기 때문에, centerTitle: false로 해주어야한다. 2. bottomNavigationBar 디자인 구글링 한 결과 이런식으로 코드를 작성하라고 했다. 밑에 자식들을 쓸 경우에는 거의 대부분 [ ] 가 들어가는 느낌이였다. 나 같은 ..

🕊 Flutter/강의 2022.03.09

4강 기본 앱 레이아웃 만드는 법

※주의 항상 child를 모든 위젯이랑 쓸 수 있는 건 아니다. 맞는 위젯이 있으니 확인해가면서 익힐 것. 이번에는 Material App() 에 대해서 살펴볼 것이다. 이 친구도 결국엔 위젯이다. 여기엔 디자인 및 기본 세팅 값이 들어있기에 커스터마이징 하더라도 써야한다. 없으면 코드가 늘어나버린다. 상중하로 나눠주는 Scaffold 위젯 상단은 appBar 중간에 들어갈 내용은 body bottomNavigationBar 로 하단을 만들어준다. 여러 위젯 가로로 배치하는 법 - Row(children: [ ])위젯 사용 [ ] array 자료 형태로 써주면 된다. 가로 배치가 잘 되는 것을 확인할 수 있다 :) ※여기서 잠깐! eslint 때문에 밑줄이 그어지는 것을 볼 수있다. 이는 analysis..

🕊 Flutter/강의 2022.03.08

3강 Flutter 기본 위젯 넣는 법

맥에서 한글 작성시 오류 typo 해제하는 법 Android Studio => Preferences(설정) => Inspection => Profile: Default 설정 => Proofreading 체크 해제 Lint 잠시 끄는 법 rules 쪽에 내용들 추가하면 됨. 초보 때는 끄고 하는 것도 좋은 방법임. main.dart 파일 기본 코드 분석 main.dart 파일에서 stless를 치고 탭 키를 누르면 이렇게 뜨는데, 앞에 MyApp을 붙여준다. return Container()를 return MaterialApp( home: )으로 바꿔준다. 각각의 코드를 살펴보자. import 'package:flutter/material.dart'; 이것은 다른 파일이나 패키지 가져오는 문법이다. voi..

🕊 Flutter/강의 2022.03.06
1