ruriruriya

웹뷰 앱을 만들면 뒤로가기 버튼을 누를 때 앱이 꺼지는 현상이 발생한다.그럴 때 앱 개발 쪽에서 컨트롤을 해줘야 한다.플러터로 그렇게 컨트롤 기능 구현하여 기록한다.하지만 iOS는 뒤로가기 스와이프 기능이 있는데 webview_flutter 패키지에서는 구현을 하지 못했다.InAppWebView로는 구현이 가능하다는 데 다음엔 InAppWebView로 웹뷰를 구현해서 해봐야겠다. 0. 웹뷰 구현하기https://ruriruriya.tistory.com/270 [Flutter] 플러터 웹뷰 앱 만들기 (package:webview_flutter)플러터로 웹뷰 앱을 구현하는 방법! 노치와 상태바 부분 SafeArea로 처리해서 편안하게 볼 수 있도록 한다.0. 프로젝트 생성은 생략.. 1. 웹뷰 플러그인(w..

플러터로 웹뷰 앱을 구현하는 방법! 노치와 상태바 부분 SafeArea로 처리해서 편안하게 볼 수 있도록 한다.0. 프로젝트 생성은 생략.. 1. 웹뷰 플러그인(webview_flutter) 추가 - pubspec.yaml아래와 같이 dependencies 추가하고 터미널에서 pub get으로 패키지 추가dependencies: flutter: sdk: flutter webview_flutter: ^4.11.0 # (최신 버전 확인) 2. 네이티브별 설정2.1. Androidandroid/app/src/main/AndroidManifest.xml 에 인터넷 권한 추가 ... 2.2. iOSios/Runner/Info.plist 에 아래 내용 추가iOS 앱은 기본적으로 보안상..

Provider는 Flutter에서 공식적으로 추천하는 Flutter 상태 관리 라이브러리 중 가장 많이 사용되는 패키지이다. 1. Provider란?Provider는 Flutter의 InheritedWidget을 간편하게 사용하도록 돕는 패키지로 여러 위젯에서 데이터를 공유하고, 상태 변경을 감지하여 UI를 자동으로 업데이트할 수 있다.✔ Provider를 사용하면 좋은 점리소스 할당 및 해제 관리가 간딘해짐→ 불필요한 리소스 사용을 줄이고 메모리 누수를 방지할 수 있음.Lazy-loading 지원→ 필요할 때까지 객체를 생성하지 않아서 성능 최적화가 가능함.보일러플레이트 코드 감소→ 새 클래스를 작성할 때마다 반복되는 코드가 줄어듦.Flutter DevTools와 호환→ DevTools에서 앱 상태를..

Flutter에서 상태 관리는 UI가 변화하는 데이터를 효과적으로 유지하고 반영하는 방법이다. 상태 관리가 중요한 이유는 Flutter의 선언적 UI 방식 때문이다. 즉, UI는 상태(state)에 따라 변경되므로 이를 어떻게 다루느냐에 따라 앱의 구조와 유지보수성이 달라진다.여기서는 Flutter의 기본 상태 관리 방법에 대해 설명한다. 서드파티 라이브러리(Provider, Riverpod 등)를 사용하지 않고 Flutter에서 제공하는 방법만 다룬다.1. 상태(State)란?Flutter에서 상태란 앱의 UI를 결정하는 데이터이다. 상태는 크게 두 가지로 나뉜다:Ephemeral state (단기 상태): 특정 위젯 내에서만 관리되는 상태 (예: TextField 입력값, 버튼 클릭 여부 등)App ..

1. Flutter에서 레이아웃이란?Flutter는 UI를 구성하는 위젯(toolkit)이며, 대부분의 작업은 위젯을 이용하여 레이아웃을 만드는 데 집중된다. 모든 요소(텍스트, 이미지, 아이콘, 버튼 등)는 위젯이며, 보이지 않는 요소인 행(Row), 열(Column), 그리드(Grid) 등도 위젯이다.위젯을 조합하여 더 복잡한 UI를 만들 수 있으며, 이러한 방식으로 모든 Flutter 레이아웃이 구성된다. 2. 레이아웃의 핵심 개념2.1. ConstraintsFlutter에서 레이아웃은 부모-자식 관계로 이루어지며, 부모 위젯은 자식 위젯에게 Constaraints를 전달한다.Constaraints은 최소 및 최대 너비, 최소 및 최대 높이를 포함하는 4개의 값으로 구성된다.자식 위젯은 해당 Con..

플러터에서 Scaffold 위젯은 앱의 화면 레이아웃을 구성하는 기본적인 틀을 제공한다.모든 플러터 앱의 화면은 보통 Scaffold 위젯으로 시작된다.Scaffold는 AppBar, body, FloatingActionButton 등을 포함한플러터의 Material Design 가이드라인에 따라 기본 UI 구조를 제공한다.Scaffold를 사용하면, 기본 레이아웃을 빠르게 설계할 수 있고, Material Design 스타일 가이드가 기본 스타일에 적용되어 있기 때문에 깔끔하게 적용된다. 그리고, body 영역에 원하는 모든 위젯을 배치하여 복잡한 레이아웃 설계도 가능하다.Scaffold 주요 속성1. appBar화면 상단에 나타나는 AppBar 영역.제목, 버튼, 메뉴 등을 포함할 수 있다.Scaff..

build 메서드는 Flutter에서 UI를 그리는 핵심적인 역할을 한다.Flutter에서 UI는 위젯으로 구성되고, build 메서드는 이 위젯들이 화면에 어떻게 배치되고 표시될 지 정의한다.build 메서드 호출 시기?1. 처음 위젯이 화면에 추가될 때위젯이 Flutter 앱 트리에 삽입되면, build 메서드가 호출된다.2. 위젯의 의존성이 변경될 때예를 들어, 위젯이 참조하는 InheritedWidget이 업데이트되면, 해당 위젯의 build 메서드가 다시 호출된다.3. 상태가 변경될 때(StatefulWidget)상태가 변하면 build 메서드가 호출되어 UI가 업데이트된다. build 메서드의 특징반환값항상 다른 위젯을 반환해야 한다.예를 들어, 텍스트를 표시하거나 버튼을 생성하는 위젯을 반환..

플러터에서 위젯(Widget)이란?플러터 어플리케이션의 사용자 인터페이스를 구성하는 기본 요소이다.각 위젯은 텍스트나 버튼 같은 물리적 요소부터 레이아웃 효과까지 인터페이스의 모든 측면을 구현하는 곳에 사용된다.위젯 계층 구조위젯은 구성(Composition)을 기반으로 한 계층 구조를 형성한다.각 위젯은 부모 위젯 내부에 중첩되며, 부모로부터 Context를 전달 받는다.이 구조는 루트 위젯까지 연결된다.import 'package:flutter/material.dart';void main() => runApp(const MyApp());class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(Bui..