개발노트

const VS finalconst와 final은 둘 다 변수를 상수로 선언할 때 사용되지만, 사용하는 방식과 타이밍이 다릅니다.1. const의 특징컴파일 타임 상수로, 값이 컴파일 타임에 결정됩니다.주로 변경되지 않는 값을 선언할 때 사용합니다.const로 선언된 위젯은 재사용이 가능하며, Flutter의 위젯 트리 재구성에서 불필요한 렌더링을 줄여 성능 최적화에 도움을 줍니다.예: const color = Colors.blue;2. final의 특징런타임에 한 번만 할당되며, 이후 변경되지 않는 값입니다.값은 런타임에 결정될 수 있습니다.final 키워드는 DateTime.now와 같은 런타임에 생성되는 값을 저장할 때 주로 사용합니다.예: final date = DateTime.now();컴파일타..

문제: 화면 여러개를 거쳐 맨 마지막 화면에 도착했을 때, 처음 화면으로 이동하고 싶다면 GetX에서 네비게이션을 어떻게 해야할까? 시나리오: 현재 Get.toNamed() 로 pag1 > page2 > page3 로 네비게이션 한 상태이다.따라서 현재 화면 위치는 'page3'여기서 나는 page3, page2 를 닫고 page1으로 이동하고 싶다.즉, page1이 나올때 까지 화면을 다 닫아버리고 싶다. 닫아버린 화면들의 GetxController 들은 삭제되어야한다. 다만, page1에 Binding 되어있는 GetxController들은 살아있어야한다.class Page1Binding implements Bindings { @override void dependencies() { Get...

PopScope의 핵심은 뒤로가기 버튼의 순기능인 뒤로가기를 막고 다른 액션을 줄 수 있다는 것이다.이 위젯을 이용하여 뒤로가기 버튼을  Player의 크기가 작아지는 버튼으로 사용해본다. AnimatedContainer의 핵심은 특정 값을 분기를 두고 컨테이너의 크기나 다른 번동사항이 애니메이션으로 편하게 적용된다는 점이다. 이로 크기를 변동시켜본다.작아졌다 커졌다 하는 Player 소스 (GetX의 GetBuilder 사용함)import 'dart:math';import 'package:flutter/material.dart';import 'package:get/get.dart';class MiniPlayerController extends GetxController { late bool isMin..

SliverFillRemaining를 사용하자CustomScrollView 로 Sliver [] 을 구성하는 중에 다른 Scroll류 위젯을 안에 사용하고싶을 경우가 있습니다.보통은 Expanded로 화면의 빈곳을 전부 차지하며 랜더링 오류를 막아주지만, 이를 위해 Expanded를 사용하면 오류가 발생합니다.이를 해결하기 위해서는 Scroll류 위젯을 SliverFillRemaining 위젯으로 감싸주면 사용이 가능합니다.!예시로 ScrollablePositionedList라는 패키지를 설치하여 넣어줬습니다.예시소스) class TestView extends StatelessWidget { const TestView({super.key}); @override Widget build(BuildCon..

하나의 위젯에 실시간 감시를 요구하는 값이 2개이며, 각각 다른 컨트롤러에 있기 때문에 컨트롤러를 2개 사용해야하는 상황이 와서 고민을 해보았습니다. 1. GetBuilder목적: 특정 시점에만 UI를 리빌드하기 위한 도구입니다. 컨트롤러의 상태가 변경될 때 update() 메서드를 호출하여 수동으로 UI를 리빌드합니다.성능: GetBuilder는 필요한 시점에만 리빌드를 트리거하므로, 성능 최적화 측면에서 더 유리합니다. 특히 UI 업데이트 빈도가 낮고, 성능이 중요한 경우 GetBuilder가 더 적합합니다.사용 사례: 예를 들어, 페이지 내 특정 UI 요소만 드물게 업데이트되는 상황에 적합합니다.GetBuilder를 사용할 경우class ProfileView extends StatelessWidge..

View, Controller, Binding 생성을 도와주는 Extension 설치 GetView 란?GetView는 GetX 패키지에서 제공하는 Flutter 위젯의 일종으로, 특정 컨트롤러에 쉽게 접근할 수 있도록 설계된 클래스다.**GetView**에서 T는 특정 컨트롤러 타입을 의미하며, 이 컨트롤러를 사용하여 UI와 로직을 연결함GetView는 컨트롤러에 쉽게 접근할 수 있도록 하며, controller 속성으로 컨트롤러의 메서드, 속성에 접근할 수 있음이는 특히, 단순한 UI와 컨트롤러의 바인딩을 효율적으로 처리하고자 할 때 유용기존 소스에서 패턴 적용해보기이제, 이전에 포스팅했던 Navigation 페이지를 View - Controller - Binding 패턴으로 바꿔본다.- 이전 포스팅..

GetX와 animated_bottom_navigation_bar 을 이용하여 하단탭 페이지전환 기능 만들기.!만들면서 Named Route 사용법을 익혀본다. GetX 설치: https://pub.dev/packages/get/install get install | Flutter packageOpen screens/snackbars/dialogs without context, manage states and inject dependencies easily with GetX.pub.dev하단Navigation버튼 바: https://pub.dev/packages/animated_bottom_navigation_bar animated_bottom_navigation_bar | Flutter packageA..

WebSocket (TCP/IP)WebSocket은 실시간 양방향 통신을 가능하게 하는 기술로, 지속적인 연결을 유지하며 언제든지 클라이언트와 서버가 서로 통신주요 특징:양방향 통신: 클라이언트와 서버가 서로 데이터를 주고받음(ex 전화통화)지속적인 연결: 연결이 수립된 후에는 클라이언트와 서버가 지속적으로 연결을 유지실시간 통신: 실시간 데이터 전송이 가능, 지연 없이 즉시 통신Open - Close 개념: 연결이 시작될 때 HttpRequest를 WebSocket으로 Upgrade 요청을 한뒤, 101 Response를 받아 오픈(Open)하며, 통신이 끝날 때 클로즈(Close) 함* HTTP 상태 코드 101은 "Switching Protocols"를 의미(HTTP에서 WebSocket으로 변경한..

API 서버 http 통신에 riverpod을 이용하여 상태관리 하도록 만들어 보겠습니다.이번 시간에는 AsyncNotifierProvider와 http의 GET, POST, DELETE (CRUD) 를 같이 사용하여 어떻게 상태관리 할 수 있는지 포스팅 해보겠습니다.JPA의 save() 메소드로 upsert가 가능하기 때문에 update 즉, PUT는 생략하겠습니다.[구현할 기능 시나리오]1. 재료 리스트 화면으로 네이게이션되었을 때 findAll() 로 모든 재료를 받아 ListView의 ListTile에 맵핑합니다.2. 재료가 담긴 ListTile 을 클릭했을 때 해당 재료의 식별ID로 조회하여 하단 시트가 올라오며, 시트에 정보를 가져옵니다.3. ListTile 클릭으로 Bottom..

http 패키지 Flutter에서 네트워크 요청을 보내고 받는 데 사용되는 가장 일반적인 패키지 중 하나가 http 패키지입니다. 이 패키지는 HTTP 요청을 만들고 응답을 처리하는 데 도움이 되는 다양한 클래스와 함수를 제공합니다. HTTP 패키지의 주요 특징 간단한 인터페이스: http 패키지는 간단한 API를 제공하여 HTTP 요청을 쉽게 생성하고 수행할 수 있습니다. 이를 통해 개발자는 쉽게 네트워크 요청을 관리할 수 있습니다. 비동기 지원: 대부분의 네트워크 작업은 비동기적으로 처리되므로 http 패키지는 Future 기반 API를 제공하여 비동기 코드 작성을 간단하게 해줍니다. 이를 통해 UI를 차단하지 않고 네트워크 요청을 수행할 수 있습니다. HTTP 요청 설정: http 패키지를 사용하면..