본문 바로가기

개발 Note/Dart,Flutter

(23)
[Flutter] Camera 사용하기 Camera를 활용한 기능을 만들고 싶을때가 많은데요. 그럴때를 대비해서 하나 예제를 만들어 두었습니다. 먼저 pubspec.yaml에 camera pacakge를 import 합니다. pubspec.yaml dependencies: flutter: sdk: flutter camera: get: ^4.6.5 아래 코드를 프로젝트에 추가합니다. getx 기반으로 작성된 코드입니다. import 'package:camera/camera.dart'; import 'package:flutter/material.dart'; import 'package:get/get.dart'; class TakePhotoPage extends StatefulWidget{ @override State createState() =>..
[Flutter] Bluetooth, BLE scanning 요즘 Flutter 로 ble device를 다루는 작업을 하고 있습니다. 아시다 시피 BLE 장치들은 기존 BT classic과 다르게 broadcasting 기능을 제공하고 있어서 S/W로직을 기존 BT classic과 동일하게 가져가기에는 무리가 있습니다. BLE 장치를 어떤 목적으로 어떻게 사용할것인가를 잘 구상 해야합니다. 구성 하고자 하는 장치를 미미(mimi)라고 합시다. 1. 미미에 탑재한 센서에서 읽은 값을 broadcasting 만 목적으로 한다. => BLE advertizement 2. 미미에 탑재한 센서에서 읽은 값을 연결되었을때만 데이타를 읽어갈 수 있도록 한다. => BLE service characteristics 3. 미미에 탑제된 여러 장치들을 제어하려고 한다. => co..
[Flutter] web 실행시 httpRequest error 발생 Flutter 앱을 chrome 으로 실행하려고 할때 httpRequest 의 경우 에러가 발생합니다. flutter sdk에서 막혀있어서 그러는데요. 아래와 같이 조치를 취해서 실행해볼 수 있습니다. (오래전부터 있었던 사항인데, 저도 종종 sdk update 하고 나서 잊어버리고 실행안되서 해매는 부분이라 적어봤습니다.) 1- flutter\bin\cache 폴더에서 flutter_tools.stamp 을 삭제합니다. 2- flutter\packages\flutter_tools\lib\src\web 에서 chrome.dart 를 에디터로 엽니다. 3- '--disable-extensions' 을 찾습니다. 4- 다음 줄에 '--disable-web-security' 을 추가 합니다. 이렇게 하고 테스..
[Flutter] flutter 3.7 google map 버그 (frame이 남아있는 문제) (2023년1월28일) 어제 시간이 좀 나서 flutter 3.2 버전으로 개발 진행해오던 프로젝트를 3.7로 업그레이드 해봤습니다. 아.. 뭔가 달라진게 있는지 custom 으로 작성한 theme 쪽에서 deprecated 된 것이 보이고, 화면 전환 이펙트( transit effect) 시 약간 부자연스런 것들이 보여서 여러번 시도하면서 로그들을 봤는데요. 현재 사용하고 있는 프로젝트에서 google map을 사용하고 있는데, 화면전환시 google map이 1~2 프레임(frame) 늦게 사라지는 것을 발견 했네요. ㅠ_ㅠ 3.7에서 다른 개선된 부분들이 많이 보이는 것 같던데, 저는 google map 때문에 당분간 3.2를 써야 할것 같습니다. (2023년 11월 14일) 구글맵의 심각한 버그입..
[Flutter] enum을 이용한 ui resouce 관리(3. TextStyle) [1.이미지(Image)] [2.컬러(Color)] [3.텍스트스타일(TextStyle] 3. 텍스트 스타일(TextStyle)을 enum으로 관리하는 방법 Text("hello", style: ResTextStyle.t1.bold()) TextStyle은 flutter ui에서 상당히 많이 사용됩니다. 당연히도 화면에 글지로 표시하여 사용자에게 정보나 의미를 전달해야 되기 때문이죠.(당연한 말이죠? ㅎㅎ) 제가 flutter를 사용하면서 TextStyle을 매번 지정하는 것은 상당히 번거로운 일이었습니다. 코드의 라인수도 늘어날 뿐 아니라 보기도 다른 코드들과 섞이면 흔히 말하는 시인성(코드의 리더빌리티, Readability) 가 떨어지게 되서 불편합니다. 또 코딩하다 text style을 지정할때 ..
[flutter] enum을 이용한 ui resource 관리(2.Color) [1.이미지(Image)] 이미지 관리 [2.컬러(Color)] 색상 관리 [3.텍스트스타일(TextStyle] 텍스트 스타일 관리 2편 컬러 사용법입니다. 이 글을 쓸때 고민이 되었던 부분중 하나가 enum을 사용하여 관리하는 것이 좋을지 기존에 플루터에서 이미 사용하고 있는 방식으로 하는 것이 좋을지 무척 고민이 되었습니다. 이유는 color 부분은 딱히 enum으로 변경한다고 해서 큰 장점이 생긴다고 생각되지 않아서 였는데요. 그래서 간략히 flutter에서 Color 제공하고 있는 방식만 소개하고 넘어갈까 합니다. Color color = ResColors.buttonBlue; 이런 방식은 이미 flutter에서도 이렇게 제공하고 있는 부분이 있죠? 이런 방식을 동일하게 사용하는 것입니다. 아래와..
[Flutter] enum을 이용한 ui resouce 관리(1. image) 플루터(Flutter)는 Dart 로 UI를 개발하기에 무척 편리한 프래임워크이죠. 실제로 플루터가 나오기 전까지 Dart 언어에 대해서 평가가 그리 좋지 않았지만, 플루터 이후에 평가가 완전히 뒤바뀌었죠. 제가 플루터로 어플리케이션을 개발하면서 쌓은 노하우중 하나가 어플리케이션 리소스를 enum으로 관리하는 것인데요. 어떤것인지 소개 드리겠습니다. 플루터로 UI를 꾸밀때, 기본적으로 필요한 요소들이 있는데요. 이미지, 컬러, 텍스트스타일, 레이아웃 등이 있죠. 이런것들을 관리하기 위해서 개발자 분들은 다양한 방법을 사용하고 있을텐데요. 저는 enum을 활용하는 방법을 소개하고자 합니다. 어떻게 enum으로 리소스를 관리하지? 라고 궁금증이 생기신 분들이 있을텐데요. 먼저 제가 왜 enum을 선호하는지 ..
[Flutter] Flutter Widget Tip RoundedContainer 모서리가 둥근 container 는 종종 필요합니다. Container( width: 100.0, height: 150.0, decoration: BoxDecoration( borderRadius: BorderRadius.all(Radius.circular(8.0)), color: Colors.redAccent, ), child: [your widget] ) RoundedCorners clipping tip. Rounded container를 만들고 나서 padding 을 없게 꽉 채우게 되는 경우에 corner가 clipping이 안됩니다. 그럴때 ClipRRect를 사용해서 clipping 합니다. ClipRRect( borderRadius: BorderRadius.ci..