App_Flutter
1.flutter 내부 구조 살펴보기
설치 및 참고: https://flutter-ko.dev/docs간단한 예제를 시험해볼 때 사용하면 좋은 Dart Pad : https://dartpad.dev/?Xcode와 Android Studio 모두를 설치해야 ios, android 에뮬레이터
2.Flutter-Week00
이번에 3.0으로 업데이트 된 플러터Android / iOS / Web / Window / MacOS / Linux하나의 코드로 6개의 플랫폼에서 앱을 만들 수 있다.
3.Flutter : MaterialApp 이 뭐야?
이게 뭘까...??구글이 만들고, 지향하는 디자인인 Material Design을 사용할 수 있게 만들어주는 클래스이다.Material Design이 궁금하다면?(https://material.io/design/introductioniOS 스타일로 만들 수 있
4.Flutter : Appbar 간단히 만들어보기 예제
사진에서 보다시피, appBar는 상태바 밑의 바로 app에 대한 정보를 표기해주거나 메뉴화면으로 많이 이용되고 있는 위젯이다.appBar를 만드는 방법은 여러 가지가 있겠지만,가장 쉬운 방법은, MaterialApp() 안의 Scaffold() 를 사용하는 것이라고
5.Flutter : Column에 대해 알아보자!
Column 위젯이란 무엇일까?? Flutter의 기본적인 레이아웃 구성에는 Row, Column이 있다. 참고 : https://100sucoding.tistory.com/34?category=948840
6.Flutter : Row, Column 의 정렬에 대해 알아보자!
Row와 Column에서 default 값으로 있는 정렬방법은 MainAxisAlignment.start 이다.이름에서부터 알 수 있듯이, 가장 기초적으로 처음부터 정렬을 해준다.다음은, 다르게 정렬할 수 있는 방법이다.end, center는 끝, 중앙에 정렬을 시켜주
7.Flutter : Flex
나는 Expanded 위젯을 아주 조금 사용해보았는데, "그냥 화면에 해당 크기의 위젯을 어느정도의 비율로 채울것인가?" 라고 단편적으로만 알고 있었다. 이제는 조금 더 제대로 알아보도록 하자.처음에는, flutter flex라고 검색해보았는데 반응형 화면을 만들기 위
8.Flutter : richText를 이용해 아이콘과 제목, 내용이 담긴 Textbox를 한 번 만들어보자 : )
RichText해당 택스트를 어떻게 만들어야 할까??해당 예제를 보고, 처음에 이런 생각을 했다.텍스트에 배경색을 주어야겠네?텍스트 옆에 아이콘을 줄 수 있어야겠네?텍스트의 크기를 다르게 (스타일을 다르게) 만들 수 있어야겠네??텍스트 박스 사이, 왼쪽 오른쪽 사이에는
9.Flutter : toggle button을 네비게이션 바처럼 만들어보자!
해당 예제처럼 화면을 만들어보기 위해서는 어떻게 해야 할까???2번, 3번을 클릭하면 원래 있던 focus가 풀리고 "2와 둘", "3과 셋" 이 화면에 출력되어야 한다. 화면을 구현하는 것은 어렵지 않았지만 onPressed를 통해 화면을 어떻게 전환할지가 문제였다.
10.Flutter : 기본 예제 설명 및 해설
일부러 주석까지 다 가지고 왔다. (사실 지금까지 잘 읽어보지도, 알려고 하지도 않았다.)기본 예제는 처음에 실행해보고, 끝이었는데 조금 더 깊이 파고들고 알고 싶어져서 보며 공부하려 이 글을 작성한다.material design ( MaterialApp() ) 을 사
11.App 내에서 정보를 기록하는 방식에 대해 알아보고 실제 예제를 통해 저장해보자!
File, DB, SharedPreferences(소규모, key-value 구조의 자료를 저장할 때 (python dict와 비슷함))File : SharedPreferences 보다 더 복잡한 데이터를 다룰 수 있다는 장점Document Directory : 해당
12.Flutter : 재사용 가능한 위젯 만들기
https://medium.com/flutter-community/flutter-reusable-widgets-38e270846d59
13.Flutter : polyline이 나오지 않는 문제 해결 방법
Flutter : flutter_polyline_points package https://pub.dev/packages/flutter_polyline_points/example참고 :https://medium.com/flutter-community/d
14.Flutter : background 위치 기록 라이브러리 알아보기 (flutter : Compare libraries recording locations in the background)
구현하기 위해서,백그라운드에서의 동작을 도와줄 수 있는 package 고르기flutter 의 스케줄러 기능이나 package 찾아보기pub.dev 에서 'background location'이라고 검색만 해도 수십 개의 패키지가 나온다. 하지만, 업데이트가 되지 않아
15.Flutter : background_locator2 사용법 (Flutter: how to use a background_locator2 package)
Reference:https://pub.dev/documentation/background_locator_2/latest/index.html예제코드:https://github.com/Yukams/background_locator_fixed/blob/m
16.Flutter/테스트 종류와 방법
Unit test, Widget test, Integeration test에 대해 알아봅시다.
17.Flutter/ TDD 개발 간단한 앱으로 실습해보기
간단한 App을 TDD 방식으로 만들면서 실습 해보겠습니다.만들 앱은 해당 요구사항을 가지고 있습니다.AppBar를 가지고 있고 AppBar에는 ‘test’라는 문구와 아이콘이 있다. 가운데에 ‘test용 앱입니다.’ 라는 문구가 적혀있다.밑에 Elevated butt
18.Flutter/ TextField, TextFormField 하단에 Error text 띄우기
여기서 "비밀번호가 일치하지 않습니다." 문구를 만들어 보겠습니다. Reference ✅TextFormField: https://api.flutter.dev/flutter/material/TextFormField-class.html ☑️TextField: http
19.Flutter/ jwt token을 decoding하고, 정보를 얻어보자
배경 token을 사용할 때, Refresh token과 access token으로 나누어 보통 사용합니다. access token의 만료 시간이 임박했을 때만 refresh해주고 싶은 마음이 있어서, 찾아봤습니다. 같은 상황이신 분들께도 도움이 되었으면 좋겠습니다
20.Flutter 프로젝트에 CI 도입하기
Flutter의 Integration test를 CI에 어떻게 도입했는지, 그리고 어떤 문제점을 겪었는지 공유드리려 글을 작성하게 되었습니다.목차는 다음과 같습니다.먼저, Flutter의 Integration test가 무엇인지 간단히 비교하며 설명드리겠습니다.Flut
21.Firebase Analytics(Google Analytics) 이용해 화면 조회수 및 로그 기록하기
앱을 개발하다 보면, 사용자의 사용 지표에 대해서 궁금해지기 마련이다. 기획/의도한대로 사용자가 서비스를 사용하고 있는지, 화면 별 체류시간과 이벤트는 얼마나 발생하는지. 어떤 곳에서 중도 포기하는지 등등.
22.Flutter Overscroll 시에 위 아래 각각 다른 색깔로 배경색 지정하기
내가 현재 개발하고 있는 앱은 아래와 같은 디자인을 가지고 있기 때문에, iOS 에서 Scroll bounce가 나타날 때 위와 아래의 배경색이 달라야 했다. 위나 아래 끝으로 스크롤했을 때 튕기는듯한 느낌을 주는 효과를 Scroll bounce 라고 한다.이 부분을