앱 프로그래밍/Flutter24 [오류 해결]flutter: 'package:flutter/src/widgets/navigator.dart': Failed assertion: line 5082 pos 12: '!_debugLocked': is not true. 해결 기존 Navigator.of(context).pushReplacement( MaterialPageRoute(builder: (context)=> TabBarPage()),); 코드를 아래와 같이 수정해 딜레이를 주었다. Future.delayed(Duration.zero, (){ Navigator.of(context).pushReplacement( MaterialPageRoute(builder: (context)=> TabBarPage()),); }); 오류 해결 완료. 참고: https://fluttercorner.com/error-thrown-on-navigator-pop-until-debuglocked-is-not-true/ Solution 3: Add Some Delay 2022. 2. 14. [플러터 기능 구현] loading 페이지를 거치지 않고 뒤로 가기 다음 블로그를 참고했다. https://fenderist.tistory.com/133 [Flutter] Back button으로 프로그램 종료처리하기 [Flutter] Back button으로 프로그램 종료처리하기 사내 업무 프로그램 개발을 하다가. Landing페이지를 띄운뒤에 메인페이지로 넘어 갔을때. Back 버튼을 누르면 Landing 페이지로 넘어 가게 되는 문제 fenderist.tistory.com 블로그의 글을 따라한 뒤 Future _onBackPressed() 부분에서 오류가 뜰 경우, Future 함수 마지막 부분 ) ?? false; 을 .then((value) => value ?? false); 로 고쳐준다. 전체 코드 Future _onBackPressed(){ //뒤로가기 .. 2022. 2. 13. 플러터로 기상청 날씨 앱 만들기 일지 8. 마무리 완성된 날씨 어플 마무리 3주간의 앱 제작 프로젝트가 마무리되었다. 사실 해결할 에러도 하나 있고, 예외처리나 리팩토링도 하고, 앱바의 pin 이모티콘 처리도 해야하지만😭(이모티콘을 삭제하거나 검색 기능을 추가하거나) 초기 구상했던 일반적인 기능구현은 다 끝났다. 따라서 우선 여기서 프로젝트 마무리를 짓고, 추가적인 수정은 앞으로 종종 시간이 날 때마다 해보기로 했다. 이제 프로젝트를 통해 배운 점과 부족한 점을 회고하면서 포스팅을 마무리 하려고 한다. 배운 점 1. 스택 오버 플로우 사용 및 영어로 코딩관련 질문을 하는 것에 익숙해졌다. 플러터는 아직 자바나 c언어 등에 비해 국내에 자료가 부족하다. 그래서 필요한 정보를 얻기 위해 거의 영어로 구글링을 했고, 이 과정에서 거부감 느껴졌던 영어와 많이 .. 2022. 1. 17. 플러터로 기상청 날씨 앱 만들기 일지 7. 설정 페이지 추가 앱 바의 action 부분(오른쪽) 메뉴 버튼을 누르면 설정페이지로 이동하도록 처리했다. weather_screen.dart에 네비게이터 추가 actions: [ IconButton( icon: SvgPicture.asset( 'assets/setting/Orion_menu.svg', width: 35.0, height: 35.0, ), onPressed: (){ Navigator.push(context, MaterialPageRoute(builder: (BuildContext context) => Setting())); }, iconSize: 30.0, ) ], setting.dart import 'package:flutter/cupertino.dart'; import 'package:flutter/m.. 2022. 1. 16. 플러터로 기상청 날씨 앱 만들기 일지 6. 시간별 날씨, 3일간 오전/오후 날씨 아이콘 처리 시간별 날씨 void weatherTime(){ if(now.hour < 3){ next1 = '0300'; next2 = '0600'; next3 = '0900'; next4 = '1200'; } else if(now.hour < 6){ next1 = '0600'; next2 = '0900'; next3 = '1200'; next4 = '1500'; } else if(now.hour < 9){ next1 = '0900'; next2 = '1200'; next3 = '1500'; next4 = '1800'; } else if(now.hour < 12){ next1 = '1200'; next2 = '1500'; next3 = '1800'; next4 = '2100'; } else if(now.hour < .. 2022. 1. 16. 플러터 DateFormat 요일 한국어로 출력 import 'package:intl/intl.dart'; import 'package:intl/date_symbol_data_local.dart'; 최상단에 해당 패키지를 import한다. (import 전 intl 패키지가 pubspec.yaml에 추가되어 있어야 한다.) class _MyAppState extends State { late DateFormat daysFormat; //추가 void initState(){ //추가 super.initState(); initializeDateFormatting(); daysFormat = new DateFormat.EEEE('ko'); // 요일 한글표현 } } 요일을 한글로 표현하기 위해 EEEE를 사용하였다. EEEE부분을 변경하여 표현하고 싶은 날.. 2022. 1. 14. 플러터로 기상청 날씨 앱 만들기 일지 5. 기상청 API 데이터 연동 오류 수정(HTTP service에러는 해결 불가능...) API 에러 00 NORMAL_SERVICE 정상 01 APPLICATION_ERROR 어플리케이션 에러 02 DB_ERROR 데이터베이스 에러 03 NODATA_ERROR 데이터없음 에러 04 HTTP_ERROR HTTP 에러 05 SERVICETIME_OUT 서비스 연결실패 에러 10 INVALID_REQUEST_PARAMETER_ERROR 잘못된 요청 파라메터 에러 11 NO_MANDATORY_REQUEST_PARAMETERS_ERROR 필수요청 파라메터가 없음 12 NO_OPENAPI_SERVICE_ERROR 해당 오픈API서비스가 없거나 폐기됨 20 SERVICE_ACCESS_DENIED_ERROR 서비스 접근거부 21 TEMPORARILY_DISABLE_THE_SERVICEKEY_ERROR 일.. 2022. 1. 14. 플러터로 기상청 날씨 앱 만들기 일지 4. 데이터 연동2(에어코리아 API) 에어코리아 API 연결 및 데이터 불러오기 에어코리아-대기오염정보 api를 사용했다.(https://www.data.go.kr/tcs/dss/selectApiDataDetailView.do?publicDataPk=15073861) 미세먼지: PM10 초미세먼지: PM2.5 API를 불러오자면 사용자 위치 근처의 측정소명을 알아야 하는데... 현재 위치에서 가장 가까운 측정소를 찾는 방법을 강구해 봐야겠다. 카카오맵 이용해서 가능한지 살펴봐야겠다. 우선 관측소명을 하드코딩해서 미세먼지 데이터를 불러온다. api 호출 전 에어코리아 api 호출 String airConditon = 'http://apis.data.go.kr/B552584/ArpltnInforInqireSvc/getMsrstnAcctoRltm.. 2022. 1. 9. 플러터 API key 숨기기 플러터 어플을 만들면서 생각없이 api 키를 그대로 깃헙에 올렸다가 api 키가 그대로 노출된 것을 보고 다급히 커밋을 모두 삭제했다. 아까운 커밋들...ㅠㅜ 그러면서 깃헙 브랜치도 바뀌어 버려서 고생중. 아무튼 여러 포스팅을 보며 따라해 봐도 게시된 대로 되지 않기에 해외 유튜브를 보고 참고하여 깃헙에서 api 키를 숨겼다. 참고한 유튜브 영상 https://www.youtube.com/watch?v=OtkrNQxJzBQ&ab_channel=Codepur 위 영상을 보고 그대로 따라했다. API key 숨기기 1. 최상위 폴더(프로젝트명 폴더) 밑에 .env 파일 추가하고 파일 내에 숨기고 싶은 정보를 입력한다. apiKey=api키 입력 2. .gitignore파일에 # API_KEYS .env* 다.. 2022. 1. 9. 플러터로 기상청 날씨 앱 만들기 일지 3. 역지오코딩(위도, 경도 -> 주소 불러오기) 지오코딩(Geocoding)은 고유명칭(주소나 산,호수의 이름등)을 가지고 위도와 경도의 좌표값를 얻는 것을 말한다. 이처럼 고유명칭이나 개별이름등을 가지고 검색하는것과는 달리 반대로 위도와 경도값으로부터 고유명칭을 얻는것은 리버스 지오코딩(reverse Geocoding)이 된다. 출처: 위키백과 역지오코딩 정보 찾느라 고생을 많이 했다. 역지오코딩 해주는 공공api는 없는지 찾아봤는데 없는 것 같다... v월드에 가입해서 역지오코딩 api를 이용해 봤는데 정보가 제대로 뜨지 않았다. 그래서 결국 구글, 네이버, 카카오에서 제공하는 api를 사용하기로 했다. 구글맵 api 역지오코딩 코드 //final String googleApiKey = FlutterConfig.get('google_map_api'.. 2022. 1. 8. 플러터로 기상청 날씨 앱 만들기 일지 2. 데이터 연동(기상청 API) geolocator을 통해 현재 내 위치 정보 불러오기 https://velog.io/@jintak0401/FlutterDart-%EC%97%90%EC%84%9C%EC%9D%98-Future-asyncawait Flutter/Dart 에서의 Future, async/await Flutter 와 Dart 를 공부하면서 깨달은 Future, async / await 에 대한 설명과 고민에 대한 답을 작성한 포스트입니다. velog.io API 신청 공공 데이터 포털(https://www.data.go.kr/index.do)에서 api를 신청했다. 나는 앱에서 날씨 정보와 미세먼지 정보를 함께 보여줄 것이기 때문에 기상청 동네예보 api와 에어코리아 대기오염 정보 api 2개를 신청했다. 날씨 기상청 단기예보.. 2022. 1. 5. 플러터로 기상청 날씨 앱 만들기 일지 1. UI 디자인 UI 디자인 구상 UI 디자인의 이해 UI 디자인은 위젯을 배치하는 방식으로 이루어진다. 대강 위의 그림과 같이 위젯이 위젯을 감싸는 식으로 원하는 UI를 구현할 수 있다. Container는 child를 하나밖에 가질 수 없고 Stack, Colun, Row는 child를 여러 개 가질 수 있다. 나는 mainAxisAlignment로 배치를 편하게 할 수 있도록 작은 컴포넌트까지 container로 감싸는 식으로 UI를 구현했다. 코드 분석 코딩셰프 강좌를 통해 만든 날씨앱을 활용하여 앱을 제작하기로 했으므로, 배운 코드를 활용하기 위해 우선 코드분석부터 했다. (코드 링크: https://github.com/zlecoding/Flutter-app-weather_app) 파일 트리 구조 │ main... 2022. 1. 2. 이전 1 2 다음 반응형
