Stack 위젯은 Flutter에서 여러 자식 위젯을 겹치게 배치할 수 있게 해주는 컨테이너 위젯입니다 Stack 내의 모든 자식은 오버레이 구조로 배열되어, 리스트의 앞쪽에 있는 위젯이 아래쪽에 위치하게 됩니다. Stack 위젯은 주로 위젯들 간의 위치를 상대적으로 정의할 때 사용됩니다.  Stack 위젯과 alignment 속성의 사용 import 'package:flutter/material.dart';void main() { runApp(const MyApp());}class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { return Materi..

ListView 사용법과 주요 property가장 일반적으로 사용되는 스크롤 위젯ListView는 주로 다음과 같은 방식으로 사용일반적인 ListView를 명시적으로 호출하고 children 전달하는 방법 (적은 데이터에 사용시 용이함)ListView.builder를 사용하여 동적으로 호출ListView.separated는 ListView.builder 기능에 구분선 사용 가능주요 propertyreverse: true이면 bottom에서부터 리스트 표시padding: 리스트 아이템 간격 (EdgeInsets로 적용)itemCount: 동적 리스트 아이템 개수 (ListView.builder/ListView.separated에서 사용 가능)itemBuilder: 각 동적 리스트 아이템 정의 (ListVi..

플러터를 이용해서 간단한 profile App을 만들며 문법에 익숙해져보도록 하겠습니다.만들면서 배우는 플러터 앱 프로그래밍을 바탕으로 연습했습니다.코드를 짜기 전, 최상단 폴더에 assets 폴더를 만들고 이미지를 넣어줍니다.사용할 내부 이미지 다운로드 받아 주세요(다른 이미지 사용 해도 좋아요) yaml 파일 설정 # To add assets to your application, add an assets section, like this: assets: - assets/avatar.png  theme.dart 파일 만들어 보기 앱의 테마는 전체 디자인에서 중요한 부분을 차지합니다. Flutter에서는 ThemeData 클래스를 사용하여 앱의 테마를 설정할 수 있습니다. 이를 통해 색상, 글..

플러터를 이용해서 간단한  recipe App을 만들며 문법에 익숙해져보도록 하겠습니다.만들면서 배우는 플러터 앱 프로그래밍을 바탕으로 연습했습니다.코드를 짜기 전, 최상단 폴더에 assets 폴더를 만들고 이미지를 넣어줍니다.  ▼ 앱에 들어갈 이미지이미지 폴더 전체 사용 설정 (pubspec.yaml) # To add assets to your application, add an assets section, like this: assets: - assets/images/ assets/images/ 해당 경로 하위의 모든 파일을 가져올 수 있게 됩니다.  폰트 사용 설정 (pubspec.yaml)     # example: fonts: - family: PatuaOne fon..

플러터를 이용해서 간단한 store App을 만들며 문법에 익숙해져보도록 하겠습니다.만들면서 배우는 플러터 앱 프로그래밍을 바탕으로 연습했습니다.코드를 짜기 전, 최상단 폴더에 assets 폴더를 만들고 이미지를 넣어줍니다.  yaml 파일 설정 # To add assets to your application, add an assets section, like this: assets: - assets/bag.jpeg - assets/cloth.jpeg 초기 코드 작성// 플러터 동작시 반드시 있어야 함import 'package:flutter/material.dart';// 코드의 시작점void main() { // 플러터는 거의 모든 것이 위젯 // 전달된 위젯을 최상위 위젯으로 설..

Basic Widget 살펴 보기layout 위젯visible 위젯을 원하는 위치에 배치하기 위해, layout 위젯을 선택간단하고 기본적인 layout 위젯은 Container와 Center 위젯전체 layout 위젯 리스트: https://docs.flutter.dev/development/ui/widgets/layoutvisible 위젯간단하고 기본적인 visible 위젯은 다음과 같음 Text 위젯 Text('Hello World') Image 위젯Image.asset('images/lake.jpg') Icon 위젯Icon(Icons.home)  3.visible 위젯을 layout 위젯 안에 넣음모든 layout 위젯은 하나의 자식을 가질 수 있는 위젯과 여러 자식을 가질 수 있는 위젯으로 나눔..

"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 💡 어떠한 최종 상태를 선언한다.// ..

Dart의 추상 클래스추상 클래스란?추상적인 클래스이기 때문에 **인스턴스화(객체 생성)**할 수 없습니다.완전한 구현을 제공하지 않으며, 이를 상속받는 클래스가 구체적인 동작을 구현하도록 강제합니다.특징공통된 속성과 메서드 정의여러 클래스에서 공유할 속성과 메서드를 정의합니다.구현 강제추상 메서드를 선언하여, 상속받은 클래스에서 반드시 구현하도록 강제합니다.일반화된 개념 표현구체적인 동작이 아니라 일반적인 동작을 정의합니다✔ 우리 회사는 유아용 동물 소리 프로그램을 만듭니다. 그리고 팀장님께서 물고기 소리 나는 프로그램을 만들어 달라 요청을 했다면 어떻게 될까요?(Dog 클래스와 Cat 클래스는 이미 설계되어 있음) // 팀장이 물고기 소리 나는 프로그램을 만들어 달라 요청을 했다면?class Dog ..