와챠의 우당탕탕 코딩 일기장

카메라에서 보이는 이미지를 실시간으로 캡쳐해보려고 한다.. 결과화면 결과 화면은 다음과 같다. 앱을 실행하면 카메라 화면이 보인다. 아래 플로팅 버튼을 누르면 해당 카메라의 화면이 캡쳐되고, 이 캡쳐된 이미지를 보여주는 화면으로 이동한다. 공식 문서 https://docs.flutter.dev/cookbook/plugins/picture-using-camera#3-create-and-initialize-the-cameracontroller Take a picture using the camera How to use a camera plugin on mobile. docs.flutter.dev 1. 의존성 추가 - file_path, path 라이브러리는 추가하지 않았다. dependencies: //....

0. 준비 아래 라이브러리를 사용해서 사람의 skeleton을 뽑아보겠습니다.ㅎㅎ우와 신난다 https://github.com/flutter-ml/google_ml_kit_flutter GitHub - flutter-ml/google_ml_kit_flutter: A flutter plugin that implements Google's standalone ML Kit A flutter plugin that implements Google's standalone ML Kit - GitHub - flutter-ml/google_ml_kit_flutter: A flutter plugin that implements Google's standalone ML Kit github.com 제가 만들고자 하는 것은 다..

준비 0. 구글 API콘솔 프로젝트 생성 - OAuth 2.0 클라이언트 ID를 Android 용으로 생성 개발 1. 의존성 추가 - 파이어베이스랑 구글 프로젝트 생성하다보면 의존성 추가하라고 안내해주는 대로 추가하다보면 이렇게 댑니다아 implementation 'com.google.firebase:firebase-auth-ktx:21.0.3' implementation platform('com.google.firebase:firebase-bom:31.5.0') implementation 'com.google.firebase:firebase-analytics-ktx' implementation 'com.google.android.gms:play-services-auth:20.5.0' 2. 인터넷 권한 ..

목차 결과물 설명 화면 및 기능 api 패키지 구조 홈 화면 상세 화면 1. 결과물 설명 만들 웹툰 앱은 다음과 같다. 1-1. 화면 및 기능 화면은 홈 화면과 상세 화면으로 총 2개고, 각 화면별 기능은 다음과 같다. 홈 화면 오늘의 웹툰 리스트 확인 가능 리스트 아이템 클릭 시 해당 웹툰의 상세 페이지로 이동 상세 화면 웹툰 설명 / 장르 / 연령가 출력 최신 10화 목록 출력 목록 아이템 클릭 시 해당 회차의 네이버 웹툰 url로 이동 하트 기능: 좋아요 표시 가능 1-2. api 여기서 사용할 api는 다음과 같다. base Url = https://webtoon-crawler.nomadcoders.workers.dev 오늘의 웹툰 목록 받아오기: baseUrl + "/today" 웹툰 상세 정보..

Pomodoro 앱 만들기 타이머 시작 기능: 25분에서 1초씩 줄어들기 타이머 중지 기능: 타이머 일시 멈춤 타이머 재시작 기능: 25분부터 재시작 뽀모도로 한 번 끝나면 아래 숫자 ++ 주석으로 설명 달겠슴다. + Flexible 위젯으로 비율 설정 가능한데, 이를 사용해서 UI를 꾸며보겠다. Flexible( flex: 1, child: Container( decoration: const BoxDecoration(color: Colors.red), ), ), Flexible( flex: 2, child: Container( decoration: const BoxDecoration(color: Colors.green), ), ), Flexible( flex: 1, child: Container( de..

목차 요약 버튼 클릭 시 카운트 증가: Stateful Widget 버튼 클릭 시 Text ui 증가: StatefulWidget + 반복문 buildContext: 부모에서 정의한 Theme을 자식이 사용하게 하기 버튼 클릭 시 ui(Text) 변경: Widget Life Cycle 1. 요약 StatelessWidget: build 메서드를 통해 ui 출력 StatefulWidget: 상태에 따라 데이터 변하고, 이에따라 ui도 변경 widget life cycle을 가지고 있다. setState(): State클래스에서 데이터 변경됨을 알리는 함수, build가 다시 실행됨 BuildContext context: 부모 요소에 쉽게 접근 가능 2. 버튼 클릭 시 카운트 증가: Stateful Widg..

리액트 시작 이유와 마찬가지로 플러터도 공부 시작~~~~ 강의는 노마드 코더의 Flutter로 웹툰 앱 만들기이다.ㅎㅎ 목차 컴포넌트 이름 없는 인자 이름 있는 인자 UI CHALLENGE 헤더 버튼 카드 1. 컴포넌트 1-1, 이름 없는 인자 class Player { String name; Player(this.name); } void main() { var min0 = Player('minWachya'); min0.name; } 1-2, 이름 있는 인자 class Player { String name; Player({required this.name}); } void main() { var min0 = Player(name: 'minWachya'); min0.name; runApp(App()); }..

* #3, #4는 생략 및 다른 강의노트에 추가함. 목차 시작하기 전에 사용자 입력에 따라 실행: 폼 제출 시마다 폼 입력값으로 고양이 짤방 만들기 웹 시작 시 실행: 웹 시작 시에 first cat이 써진 고양이로 메인 고양이 사진 초기화하기 useEffect란? setState의 성능 개선 1. 시작하기 전에 open API 모음 깃허브에서 고양이 짤방 api를 사용하여 고양이 짤방 기능을 추가할 것임 fetch 사용하기 문서에서 가져온 fetch 사용법 fetch('http://example.com/movies.json') .then((response) => response.json()) .then((data) => console.log(data)); js 비동기 처리와 콜백 함수 문서 비동기 처리..