Flutter/10 app Weather (7) 썸네일형 리스트형 [Flutter] App Weather - 6단계 완료(indicator 추가) 오늘은 마지막으로 indicator 를 추가하여 데이터 가져오는 동안 사용자에게 기다리는 화면을 보여주는 방법에 대해서 알아보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오(Arctic Fox 2020.3.1 Patch 4), flutter 2.8.1 소스코드 위치 - Release indicator · mike-bskim/weather (github.com) Release indicator · mike-bskim/weather github.com 패치키 추가 flutter_spinkit: ^5.1.0 loading.dart 수정 - build 부분만 수정하면 됩니다. @override Widget build(BuildContext context) { return const Scaffold( ba.. [Flutter] App Weather - 5단계 추가 데이터 & 모델링 이번에는 추가 데이터(대기질 및 미세먼지) 매핑 및 해당 데이터 모델을 만드는 방법에 대해서 알아보겠습니다. 1. 미세먼지 관련 api 추가 2. 데이터 모델링 추가(참고자료 - [Flutter] App Weather - 3.5단계 model of openweathermap) 3. 코드 정리(리팩토링) 개발환경 : 윈도우11, 안드로이드 스튜디오(Arctic Fox 2020.3.1 Patch 4), flutter 2.8.1 소스코드 위치 - Release airData_Model · mike-bskim/weather (github.com) Release airData_Model · mike-bskim/weather github.com 1. current_air.dart - 미세먼지 모델링을 추가합니다. .. [Flutter] App Weather - 4단계 UI 이번에는 화면구성에 대해서 알아보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오(Arctic Fox 2020.3.1 Patch 4), flutter 2.8.1 소스코드 위치 - Release UI · mike-bskim/weather (github.com) Release UI · mike-bskim/weather github.com 오늘의 목표 화면입니다. 먼저 패키지 버전 문제로 약간의 수정이 필요합니다. 패키지 호환문제로 구글링하니 '^'를 제거하라고 해서 했습니다. google_fonts: 2.2.0 '^'를 삭제해주세요. 문제없는분들은 스킵하세요. loading.dart 수정 - api 에서 한글을 지원해서 언어설정을 추가했습니다. 안하셔도 됩니다. Network 클래스 객체 생성시, 파라.. [Flutter] App Weather - 3.5단계 model of openweathermap 이번에는 데이터 모델을 만드는 방법에 대해서 알아보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오(Arctic Fox 2020.3.1 Patch 4), flutter 2.8.1 소스코드 위치 - Release data_model · mike-bskim/weather · GitHub Release data_model · mike-bskim/weather github.com 데이터 모델을 쉽게 만드는 툴/웹/플러그인들이 있는데, 그중에서 안드로이드 스튜디오에서 추가 가능한 "JsonToDart" 라는 플러그인으로 변환작업을 하였습니다. model 폴더를 만들고 우클릭으로 "Json To Dart" 를 실행한다. 이전 블로그에서 사용한 샘플 데이터를 복/붙한다. 주의 사항))) 복/붙할때 주의 사항은 .. [Flutter] App Weather - 3단계 json from openweathermap 이번에는 실제 사이트에서 json 데이터를 가져오는 방법에 대해서 알아보도록 하겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오(Arctic Fox 2020.3.1 Patch 4), flutter 2.8.1 소스코드 위치 - Release openweathermap · mike-bskim/weather · GitHub Release openweathermap · mike-bskim/weather github.com 파일구조를 변경하였습니다. 아래와 같습니다. loading.dart 수정 import 'package:flutter/material.dart'; import 'package:weather/data/my_location.dart'; import 'package:weather/data/net.. [Flutter] App Weather - 2단계 http & json 오늘은 http & json 에 대해서 알아보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 2.8.1 소스코드 위치 - https://github.com/mike-bskim/weather/releases/tag/json Release json · mike-bskim/weather github.com 먼저 준비 작업 1. 패키지 추가 http: ^0.13.4 2. AndroidManifest.xml 파일에 permission 추가 이 부분 추가 loading.dart 파일 수정 import 'package:http/http.dart' as http; // 패키지는 가독성을 위해서 별명추가함 class _LoadingState extends State { @override void .. [Flutter] App Weather - 1단계 geolocator 8.2.0 오늘은 geolocator 패키지 사용법에 대해서 알아보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 2.8.1 소스코드 위치 - https://github.com/mike-bskim/weather/releases/tag/start Release start · mike-bskim/weather github.com 먼저 준비 작업 1. 패키지 추가 geolocator: ^8.2.0 2. AndroidManifest.xml 파일에 permission 추가 이부분 추가 main.dart 파일 import 'package:flutter/material.dart'; import 'screens/loading.dart'; void main() { runApp(const MyApp()); }.. 이전 1 다음
