Flutter 앱 개발에서 상태(State)는 UI의 현재 상태를 나타내며, 상태가 변경되면 UI가 업데이트됩니다. 이 글에서는 상태의 종류와 StatelessWidget과 StatefulWidget의 차이점, 그리고 상태 관리(State Management)에 대해 알아보겠습니다.상태(State)의 종류 🧩💡 상태는 공유 여부에 따라 크게 두 가지로 나뉩니다.로컬 상태(Local State): 특정 위젯 내부에서만 사용되는 상태공유 상태(Shared State): 여러 위젯에서 공유되어 사용하는 상태https://docs.flutter.dev/development/data-and-backend/state-mgmt/ephemeral-vs-app Differentiate between ephemeral..

Flutter 2.0에서 버튼 위젯이 새롭게 변화했습니다. 기존의 FlatButton, RaisedButton, OutlineButton은 더 이상 권장되지 않으며, 대신 TextButton, ElevatedButton, OutlinedButton으로 변경되었습니다. 새로운 버튼은 더 직관적인 스타일링과 Material Design 요소를 반영하고 있습니다.1. 주요 변화버튼 클래스와 테마가 다음과 같이 변경되었습니다:FlatButton → TextButtonRaisedButton → ElevatedButtonOutlineButton → OutlinedButton테마도 TextButtonTheme, ElevatedButtonTheme, OutlinedButtonTheme로 각각 변화되었습니다.스타일 지정..

▶ 구현할 화면   위의 사진을 다운로드 받아서 같이 진행해보자!화면 레이아웃 지정   필자는 색별 구분 박스로 구분해보았다. 어떻게 구역을 나눌지는 본인 자유이다.공통적인 요소들을 가지고 있는 것들끼리 묶는것이 가장 좋은 방법이다.초기 세팅 다운받은 이미지, 폰트를 삽입하자 > fonts, images를 구분해서 넣어주었다.  pubspec.yaml 파일 수정 폰트도 함께 반영해야함으로 폰트도 주석을 풀어 주자 ! assets/image/  이런식으로 선언한다면 image 파일 안에있는 모든것들을 반영!앞에 store-app (1) 포스트에서 다뤘던 내용들은 skip 하겠다. 링크를 참고하여 앞에 내용을 다시 공부하도록 하자https://junhyeokkk.tistory.com/12 [Flutter] ..

"Everything is a Widget" — Flutter의 핵심 철학Flutter는 위젯 기반의 UI 프레임워크로, 모든 UI 요소를 위젯으로 표현합니다. 이는 개발의 일관성과 효율성을 크게 높여줍니다.선언적 UI 구성Flutter는 React에서 영감을 받은 선언적 프로그래밍 방식을 채택했습니다. 개발자는 원하는 UI 상태를 직접 선언하며, 프레임워크가 이를 효율적으로 렌더링합니다  명령형 UI ☞ 어떠한 상태가 되도록 명령한다. ViewA a = ViewA();ViewB b = ViewB();a.setColor(red) // 빨간색이 되어라b.setColor(yello) // 노란색이 되어라a.add(b) // b는 a의 child가 되어라  선언형 UI ☞ 어떠한 최종 상태를 선언한다// 빨간..

추상클래스란? - 완전한 구현들을 제공하지 않는 클래스로 상속을 통해 다른 클래스가 이를 확장하여 구체적인 동작을 구현하도록 강제할 수 있는 클래스입니다.- 추상 클래스는 좀 더 일반화 적인 개념을 표현하며, 공통된 속성과 메서드를 정의하는데 보통 많이 활용 됩니다.  시나리오 코드를 통해 익숙해져 보자  일반적인 클래스 class Dog { void performAction() { print('멍멍 배고파'); }}class Cat { void performAction() { print('야옹 배고파'); }}void main() { Dog d = Dog(); Cat c = Cat();} 추상 클래스 abstract class Animal { void performAction()..

연관관계?- 객체들이 서로 연결되어 있는 일반적인 관계 - 컴포지션 관계, 연관관계로 구성  컴포지션 관계 [강한 소유 관계]- 부분-전체 관계 중에서 생명주기가 밀접하게 연관된 강한 소유 관계를 의미한다.- 전체 객체가 소멸될 때 부분 객체도 함께 소멸 된다.- 예시: 차 와 엔진 클래스   집합 관계 [약한 소유 관계]- 부분-전체 관계 중에서 전체와 부분이 생명주기가 독립적인 관계를 말한다.- 전체 객체가 소멸될 때 부분 객체는 독립적으로 존재할 수 있다.- 예시 : 부서와 직원 클래스를 생각할 수 있다.- 부서 객체가 소멸되더라도 직원 객체는 계속 존재할 수 있다. 예시코드 [컴포지션]class Car { final Engine engine; // 생성자 코드 1. 축약버전 --> 생성자 바디..

널 세이프티(Null Safety)는 개발자가 널 에러를 피할 수 있도록 도와주는 다트 프로그래밍 언어의 기능입니다. 이 기능은 사운드 널 세이프티 인 다트(Sound Null Safety in dart)라고 불리며, 이를 통해 개발자는 코드 작성 시점에 널 에러를 잡을 수 있습니다.Sound Null Safety in dart 이란 (Sound Type System)런타임 중에 null 포인터 예외를 방지하기 위해 Dart 컴파일러가 코드를 분석하고 컴파일할 때 타입 시스템에서 엄격한 규칙을 적용하는 것을 의미합니다. 정리하면, Dart 컴파일러가 코드를 분석하고, null이 될 수 있는 타입과 null이 될 수 없는 타입을 분명히 구분해 주기 때문에, 우리가 실수로 null을 넣거나 반환하게 되면 빌..

본격적으로 플러터 프로젝트에 들어가보기로 하자  간단한 화면을 구현함으로써 플러터 의 자주 사용되는 문법과 구조를 익혀보자  ▶ 구현할 화면  위의 사진을 다운로드 받아서 같이 진행해보자! 프로젝트 생성 후 이미지 담을 디렉터리 생성 후 이미지 삽입  yaml 파일 수정 - assets 주석 해제 후 폴더 경로 / 파일 이름에 맞추기 ※  Pub get 해주기 main.dart > 이동 import 빼고 다 지우기- import에는 여러 라이브러리가 삽입되어있으므로 꼭 import는 놔두기 ! 기본 코드 작성// 플러터 동작시 반드시 있어야 함import 'package:flutter/material.dart';// 코드의 시작점void main() { runApp(MyApp());}// stl 단축키..