Flutter 21

[flutter 2.0] 13~14강 | 날씨앱 만들기 01

✅ 날씨앱 만들기 이번 포스팅에서는 전부 다 강의를 듣지 않고 중간에 우선 스탑하기로! ✅ my_location.dart import 'package:geolocator/geolocator.dart'; class MyLocation { double latitude2; double longitude2; Future getMyCurrentLocation() async{ try { Position position = await Geolocator.getCurrentPosition( // 위치와 경도 가져온다. desiredAccuracy: LocationAccuracy.high); latitude2 = position.latitude; longitude2 = position.longitude; print(po..

[flutter2.0] 12강 | Future-async 심화

✅ 이번 시간에는 Future-async에 대해서 알아볼 예정이야. 중간에 생략된 것은 for문과 while문이라서 뛰어넘었음. ✅ Dart에서 Thread란? 다트는 싱글 쓰레드로 이루어져 있다. Event loop가 존재해서 처리해. 안드로이드 치면 Looper와 같은 개념. ✅ Future란? 1. 다트에 의해 future 객체가 내부적인 배열에 등록 2. future관련해서 실행되어야 하는 코드들이 이벤트 큐에 등록 3. 불완전한 future객체가 반환 4. Syncronous 방식으로 실행되어야 할 코드 먼저 실행 5. 최종적으로 실제적인 data값이 future로 전달 ✅ Async method 1. 메소드를 통해 나오는 결과물은 future 2. Await 키워드를 만날 때까지 synchro..

[flutter2.0] 8강 - 1 | Future, async, await 이해하기

✅이번 시간에는 Future, async, await에 대해서 알아보자. 플러터를 공부하면서 느낀것이 전반적으로 RxSwift와 비슷한 느낌을 갖는다는 것이다. 그럼 한번 다시 보도록 할까? 코드 작성은 플러터 프로젝트의 - test - widget_test.dart에 작성한다. ✅가장 기준이 되는 코드 import 'dart:io'; void main() { showData(); } void showData() { startTask(); accessData(); fetchData(); } void startTask() { String info1 = '요청 수행 시작'; print(info1); } void accessData() { String info2 = '데이터에 접속중'; print(info2)..

[flutter2.0] 3~5강 | 로그인과 주사위 앱 만들기

✅이번 시간에는 로그인과 주사위 앱 만들기에 대해서 알아볼 예정이야. 뭔가 생각보다 새로이 보는 것들이 많았고, 디자인 패턴이나 클린 코드에 대해서 플러터는 상당히 중요할 것 같다는 생각이 확 들었어. 코드를 보면서 그럼 함께 보도록 하자. 플러터 개발에 있어서, 코드를 쭉 읽어보면서 지나가자 ✅플러터 화면 중 일부 ✅main.dart // main.dart import 'package:flutter/material.dart'; import 'dice.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp(..

[flutter] 23강 | Navigator 와 pushName 메소드 이해하기

✅ 이번 시간에는 배운게 많은 시간이었다. 특히나 오타로 슬래시랑 역슬래시 오타로 인해서 한참을 헤매었는데 찬찬히 살펴보도록 하자. 또한 파일을 드디어 나누어서 작업했는데 이 부분도 눈여겨볼 부분이다. 파일을 나누면 import를 또다시 해주어야한다. 💡 생각할 점 import가 너무 많으면 관리가 불편하니까 헤더파일 처럼 모을 수 있는 방법이 있는지 알아보기 ✅ 코드 리뷰 - main.dart // main.dart import 'package:flutter/material.dart'; // 데스크탑, 앱 등에 고루 UI를 적용할 수 있게 해주는 구글이 제공해주는 패키 import 'package:untitled/ScreenA.dart'; import 'ScreenB.dart'; import 'Scre..

[flutter] 22강 | Navigator 이해하기

✅ 이번시간에는 네비게이터를 이용해 화면 전환하기 + 컨텍스트에 대해서 알아볼 예정이야 ✅ Navigator 및 포스팅의 순서 1. Route의 개념 - 스마트폰에서 보여지는 하나의 페이지 화면 ! 2. Navigator의 정의와 push, pop 함수, stack 자료구조 - stack ( FILO ) - push 데이터를 넣기 - pop 데이터를 빼기 - Route(페이지) 는 Navigator라는 위젯이 담당하고 그 구조는 스택 구조이다. 3. MaterialPageRoute위젯과 context - 화면전환할 때, 바로 class 입력해서 이동하는 것이 아니라 화면을 지정해주면서 이동한다. 4. 페이지 이동 기능 구현 완성 ✅ 코드 리뷰 import 'package:flutter/material.d..

[flutter] 21강 | Column, Row 위젯

✅ 이번 시간에는 Column 위젯과 Row 위젯에 대해서 알아볼 예정이야 쉬우니까 쓱 보기 ⭐️ 레이아웃을 학습이나 급할 때, 테스트 하지 않고 이렇게 되는걸 확인할 수 있는 좋은 사이트가 있다. https://medium.com/flutter-community/flutter-layout-cheat-sheet-5363348d037e Flutter Layout Cheat Sheet Do you need simple layout samples for Flutter? I present you my set of Flutter layout code snippets. I will keep it short, sweet and simple… medium.com ✅ Columns 위젯은 세로축의 가능한 모든 길이를 갖..

[flutter] 20강 | 컨테이너 위젯 (container widget) 되짚어 보기.

✅ 드디어 여기부터는 순한맛을 벗어나 조금 매운맛 강좌이다 ㅎ..ㅎ 무료 강좌인데 진짜 이렇게 좋을 수가 없음... 유튜브 코딩쉐프님 강좌를 무한히 추천한다. ✅ 이번시간부터는 컨테이너 위젯에 대해서 알아볼 예정인데, 차근차근 봐보자. 우선 플러터 공식 홈페이지 가서 레이아웃 위젯을 확인하는 것도 좋은 방법이겠지? https://flutter-ko.dev/docs/development/ui/widgets/layout#Single-child%20layout%20widgets Layout widgets flutter-ko.dev 플러터의 컨테이너의 공식 문서를 보면 "Containers with no children try to be as big as possible" childern이 없을경우 컨테이너가 ..

[flutter] 19강 | 빌더 위젯 없이 스낵바 만들기 및 토스트 메시지

✅ 이번 시간에는 스낵바와 토스트 메시지에 대해서 알아보자. 스낵바의 경우에는 패치강의에서 보았다. 그래서 ScaffoldMessenger를 이용해서 스스로 강의의 오류를 수정할 수 있었어 강의에서는 2개로 나눠서 강의를 진행하는데 ScaffoldMessenger와 Toast메시지로 나눠어서 발표한다. 특히, 토스트 메시지 쪽에서 error가 있었어서 error 해결하는 것까지 적어두었으니 꼭 보기 ✅ ScaffoldMessenger 사용하기 import 'package:flutter/material.dart'; // 데스크탑, 앱 등에 고루 UI를 적용할 수 있게 해주는 구글이 제공해주는 패키 void main() => runApp(MyApp()); class MyApp extends Stateless..

[flutter] 27강(패치강좌) | 플러터 2.0 버튼

✅ 이번 시간에는 버튼에 대해서 알아볼 예정이야. 패치강좌가 1,2로 연속해서 있어서 18강 이후에 들으면 좋아 RaisedButton -> ElevatedButton FlatButton -> TextButton OutlineButton -> OutlinedButton 강의가 길었지만 전체적으로 어려운건 없었어. 🔸주요 특이점🔸 - TextButton에서 background속성이 존재하지만 다른 버튼에는 백그라운드가 없어서 styleForm안에서 color를 사용해서 백그라운드를 설정해야 한다. ✅ 코드리뷰 및 이해 import 'package:flutter/material.dart'; // 데스크탑, 앱 등에 고루 UI를 적용할 수 있게 해주는 구글이 제공해주는 패키 void main() => runA..