짱구

들어가기 앞서... 비동기 통신을 하면서 FutureBuilder 와 StreamBuilder 를 사용하게되는데, 무엇인지와 사용법을 알아보자! 본문으로... FutureBuilder 배우기 1. 기본 세팅! import 'dart:math'; import 'package:flutter/material.dart'; class HomeScreen extends StatefulWidget { const HomeScreen({Key? key}) : super(key: key); @override State createState() => _HomeScreenState(); } class _HomeScreenState extends State { final textStyle = TextStyle( fontSize..

상황 google_map_flutter 와 Geolocator 플러그인을 사용해서 유저의 위치 서비스 권한을 요청하려던 개발을 진행을 하다가 앱 시작이 잘 되었던 프로젝트가 갑자기 ERROR:D8 이라는 에러를 출력한다면? 에러내용 더보기 ERROR:D8: Cannot fit requested classes in a single dex file (# methods: 70980 > 65536) com.android.builder.dexing.DexArchiveMergerException: Error while merging dex archives: The number of method references in a .dex file cannot exceed 64K. Learn how to resolve th..

들어가기 앞서... 구글 맵과 geolocator 플러그인을 통해서 회사의 위치와 나의 위치를 알고 어떤 조건에 맞으면 출근이 가능하게끔 하는 프로젝트이다. 본문으로... 1. 기본 세팅! geolocator | Flutter Package Geolocation plugin for Flutter. This plugin provides a cross-platform (iOS, Android) API for generic location (GPS etc.) functions. pub.dev google_maps_flutter | Flutter Package A Flutter plugin for integrating Google Maps in iOS and Android applications. pub.dev..

들어가기 앞서... 동영상위의 버튼 플레이 버튼을 만들고 컨트롤 해보자! 본문으로... 1. 비디오 플레이어를 원래 사이즈로 만들까? @override Widget build(BuildContext context) { if (videoController == null) { return CircularProgressIndicator(); } return AspectRatio( aspectRatio: videoController!.value.aspectRatio, child: Stack( children: [ VideoPlayer(videoController!), _Controls(), ], )); } } class _Controls extends StatelessWidget { const _Controls..

들어가기 앞서... 비디오 플레이어 사용법을 알아 볼 것 이다. 본문으로... 1. custom_video_player.dart import 'package:flutter/material.dart'; import 'package:image_picker/image_picker.dart'; import 'package:video_player/video_player.dart'; class CustomVideoPlayer extends StatefulWidget { final XFile video; const CustomVideoPlayer({Key? key, required this.video}) : super(key: key); @override State createState() => _CustomVide..

들어가기 앞서... 비디오가 담기지 않았을때와 담겼을떄의 뷰를 조건부로 랜더링 하겠다. 본문으로... 1. 코드 정리! 1) body 함수로 뺴자! Scaffold( body: renderEmpty() ); Widget renderEmpty() { return Container( width: MediaQuery.of(context).size.width, decoration: getBoxDecoration(), child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ _Logo(), SizedBox( height: 30.0, ), _AppName(), ], ), ); } 2) 로고를 클릭하면 이미지를 선택하게! // 함수 파라미터로 넘..

pubspec.yaml 파일에 이미지 경로를 잘 입력을 했는데도 이미지가 안나오는 경우가 있다. 터미널에뜨는 이슈 사항 변경 전 Image.asset('asset/img/logo.png') 변경 후 Image(image: AssetImage("asset/img/logo.png") 체크사항 flutter fub get 후에 앱 재시작하기 디렉토리 구조와 pubspec.yaml 파일에 작성법이 알맞게 작성이 되었는지 확인하기 출처 https://docs.flutter.dev/development/ui/assets-and-images Adding assets and images How to use images (and other assets) in your Flutter app. docs.flutter.dev

들어가기 앞서... 영상을 재생할 수 있는 프로그램을 만들것이다. 1. 주의 깊게 봐야하는 점... video_player 플러그인 image_picker 플러그인 Stack 위젯 AspectRatio 위젯 2. 간단한 설명으로는... image_picker 핸드폰에 있는 비디오선택 후 video_player 비디오 재생 Stack 화면을 제작하고, AspectRatio 은 비율대로 childWidget 을 조절할것이다. 본문으로... 1. 기본 세팅 ! 페이지 세팅 및 asset 폴더 경로 설정 1) 로고와 비디오 3개 정도 준비하자! 2) 페이지 세팅 및 asset 폴더 경로 설정해주자! 로고 파일은 assets 경로 설정을 해주고, 비디오 같은 경우 다르게 설정을 해줄것이다. // pubsepc.y..

들어가기 앞서... Slider 를 사용하고, 상태값을 저장하고 다른 페이지에 상태값을 전달하는 방법을 배울것이다. 본문으로... 1. Slider 위젯 사용해보자! 1) 숫자랑, 버튼 UI 작업 children: [ Expanded( child: Row( children: 10000 .toString() .split('') .map((e) => Image.asset( 'asset/img/random_number/$e.png', width: 50.0, height: 70.0, )) .toList(), ), ), ElevatedButton( onPressed: () {}, child: Text('저장!'), style: ElevatedButton.styleFrom(backgroundColor: RED_CO..

Dart 에는 Optional Parameters 에는 2가지 방식이 있다. Optional Parameters 에는 주어진 함수를 호출 할떄 변수를 지정할 필요가 없는 매개변수이다. Optional Parameters 는 required parameters 후에 선언 되어야한다. 기본값을 사용할 수 있고, 함수 호출시 변수 지정하지 않을 경우 사용된다. Positinal Parameters in Dart Square brackets [] 는 매개변수를 지정하는데 사용된다. readFile(String name, [String mode, String charset = 'utf-8']) { ... } name 값은 필수 이고, mode, charsetd 은 선택적 이다. charset은 지정안하면, 기본값..