2024/12 32

TensorFlow 사용하기 (YOLO v.8)

TensorFlow란?텐서플로우는 구글에서 개발한 오픈소스 러닝머신 라이브러리이다.신경망 모델 이미지를 제공하여, 딥러닝 모델을 쉽게 만들고 학습시킴으로써 다양한 종류의 머신러닝 작업을 수행할 수 있게 한다. 물론, 신경망 모델을 사용하여, 딥러닝 모델을 직접 커스터마이징해 원하는 기능의 딥러닝 모델을 만들 수도 있지만,일반적으로는 이미 만들어지고 학습된 모델을 사용하는 방법을 사용해보자! LiteRT용 선행 학습된 모델  |  Google AI Edge  |  Google AI for DevelopersLiteRT 소개: 온디바이스 AI를 위한 Google의 고성능 런타임(이전 명칭: TensorFlow Lite)입니다. 이 페이지는 Cloud Translation API를 통해 번역되었습니다. 의견 ..

Flutter 2024.12.20

알림 보내기 (LocalNotification 라이브러리)

flutter_local_notifications | Flutter packageA cross platform plugin for displaying and scheduling local notifications for Flutter applications with the ability to customise for each platform.pub.dev LocalNotification 라이브러리란?로컬기기의 알람기능을 사용하기 위한 라이브러리이다.  사용법라이브러리 설치// Terminalflutter pub add flutter_local_notifications Android 권한 설정// android/app/build.gradle 수정compileSdk = 34...coreLibraryDesug..

Flutter 2024.12.20

반응형 UI

반응형 UI를 사용해야 하는 이유반응형 UI는 화면 크기나 디바이스 유형에 따라 동적으로 디자인 요소를 재배치 하는 것이다. 반응형 UI의 중요도는 최근 들어서 점점더 높아지고 있는데,여러 가지 종류의 휴대폰 및 태블릿 모델이 등장함에 따라, 보다 다양한 화면 크기에 대비할 필요성이 높아졌기 때문이다.  일반적인 화면 크기에 따른 UI 재배지 분기점 (Breakpoint)디바이스의 가로 크기를 기준으로 분기점을 설정하는데, 일반적인 기준은 다음과 같다. (dp 기준)   반응형 UI 사용하기LayoutBuilder를 이용하여, 각 분기점 마다의 UI 위젯을 반환시키는 방식과 MediaQuery 를 사용하는 방식이 주로 사용된다. LayoutBuilder 방식부모 위젯의 크기에 따라 자식 위젯의 배치를 조..

Flutter 2024.12.19

Go_Router 라이브러리

go_router | Flutter packageA declarative router for Flutter based on Navigation 2 supporting deep linking, data-driven routes and morepub.dev GoRouter 라이브러리란?URL 기반 네비게이션 패키지로써, 어플리케이션의 여러 페이지들을 전환할때 마치 웹의 주소창을 사용할때 처럼 할 수 있게 해주는 라이브러리이다. 때문에 GoRouter는 URL 중심의 라우팅 방식을 채택하여 웹과 모바일 모두에서 URL 상태를 동기화하고 관리하기에 용이하고, 각 경로(route)를 선언적으로 정의할 수 있어 라우팅 구조를 한눈에 파악할 수 있다. 또한 특징으로는, URL 을 사용할때처럼 template synt..

Flutter 2024.12.19

테마 커스터마이징 (확장 메서드란?)

테마 커스터마이징이 필요한 이유?대부분의 실전 프로젝트에서는, 하나의 어플리케이션에서 다양한 디자인, 색상등등을 여러개 정의해야 할 때가 많다.이때, ThemeData의 기본 속성만으로는 모든 색상 및 디자인을 정의하기에는 제한이 따르기 때문이다. 테마 커스터마이징AppThemeExtension 확장 클래스 선언AppThemeExtension의 원본 코드는 수정하지 않고, 새로운 메서드나 속성을 추가하는 방식이다.확장에 대한 설명은 밑의 확장 메서드를 설명할때 보다 자세히 설명한다.class AppThemeExtension extends ThemeExtension { const AppThemeExtension({ required this.main, required this.mainLight,..

Flutter 2024.12.19

(UX) NotificationListener 사용하기 - [ 무한 스크롤 , 당겨서 새로고침 ]

NotificationListener애플리케이션에서 이벤트나 알림을 수신하고, 처리하는데 주로 사용되는 위젯.알림을 통해 위젯 트리간의 통신을 간소화 하여 다양한 이벤트에 대해 효율적으로 반응할 수 있게 한다. NotificationListener class - widgets library - Dart APINotificationListener class A widget that listens for Notifications bubbling up the tree. Notifications will trigger the onNotification callback only if their runtimeType is a subtype of T. To dispatch notifications, use the N..

Flutter 2024.12.19

효율적인 이벤트 처리 기법 - [ 스로틀링 , 디바운싱 ]

효율적인 이벤트 처리 기법을 사용해야 하는 이유효율적인 이벤트 처리 기법을 사용하게 되면, 앱 성능을 최적화 할 수 있고, 자원을 절약할 수 있기 때문이다.또한, 통신을 통해 데이터를 주고받는 경우에서는, 불필요한 요청을 방지하여 트래픽을 감소시킬 수 도 있다. 최적화가 잘 된 어플리케이션은, 무엇보다 사용자가 앱을 이용하는데 부담이 덜 되게끔 하기 때문에, 중요한 스킬이라고 할 수 있다. 이벤트 처리 기법중에는 스로틀링과 디바운싱 이라는 기법들이 존재하며, 이들을 소개하고자 한다. 스로틀링이란?특정 시간 간격 내에서 이벤트가 여러 번 발생하더라도, 그 중 한번만 실행되도록 하게 하는 기능.예를 들어, 사용자가 스크롤을 계속하거나 키를 입력하는 등의 이벤트가 발생할 때, 너무 자주 실행되지 않도록 조절하..

Flutter 2024.12.19

플러터 애니메이션

애니메이션이란?애니메이션은 위젯의 속성 (위치, 크기, 색상 등등)을 시간에 따라 변경하여, 시각적인 변화를 부드럽게 보여주는 방식이다.애니메이션은 사용자 경험을 향상시키는 중요한 요소로써, 사용자로 하여금 앱의 동작을 직관적으로 이해시키고, 몰입감을 높이는 데 사용된다. 결과적으로 UI를 움직이는 동작이기 때문에, StatefulWidget에서 사용된다.  애니메이션을 제어하는 속성들애니메이션을 만들기에 앞서, 아래의 애니메이션들을 제어하는 속성들이 있다.애니메이션 효과의 속도를 직접적으로 제어하는 Curve 와 애니메이션 시간을 제어하는 Duration 이다. Curve애니메이션은 기본적으로 0 ~ 1 까지의 진행되는 값을 기반으로 작동한다.Curve 객체는, 0 ~ 1 사이의 진행속도를 변화시키는 ..

Flutter 2024.12.19

클린 아키텍처 심화

클린 아키텍쳐에서는 이와같은 레이어(모듈)를 구상하는것을 추천한다.Presentation Layer(UI)Domain LayerData Layer각각의 레이어(모듈)에 들어갈 파일들의 특징을 살펴보자면 다음과 같다.features/ # 각 기능별 모듈 (Todo와 같은)│ ├── todo/ # Todo 기능 (예시)│ │ ├── data/ # 데이터 레이어│ │ │ ├── models/ # API 응답 모델, DB 모델│ │ │ ├── sources/ # 데이터 소스 (API, DB)│ │ │ └── repositories/ # 실제 Repository 구현체들│ │ ├── domain/ # ..

Flutter 2024.12.19

TIL - SPRINCHAT(팀프로젝트) (2) <ScrollView의 스크롤컨트롤러>

## 해당 TIL은 주어진 과제를 수행하면서 얻은 학습 내용과, 시행착오 등등을 종합해서 작성한것임 1. 채팅 화면 구현시, 자동 스크롤 기능스크롤 뷰에서 스크롤을 옮기기 위하여 사용되는 코드는 다음과 같다.ScrollController scrollController = ScrollController();// 점프하듯 순간이동처럼 스크롤이 이동scrollController.jumpTo(scrollController.position.maxScrollExtent);// 애니메이션 효과같이, 스르륵하고 스크롤이 이동scrollController.animateTo(scrollController.position.maxScrollExtent); 해당 로직들은 매개변수로써 position 을 받아서, 해당 posit..

TIL 2024.12.17