Flutter

Flutter에서 사용자에게 요일을 선택하도록 하려면 어떻게 해야 할까요? 이번 글에서는 플러터 ToggleButtons 위젯을 사용하여 사용자가 요일을 선택할 수 있는 간단한 방법에 대해 살펴보겠습니다. 이 기능은 사용자의 활동이나 알림을 설정하는 데 유용하게 사용할 수 있습니다. ToggleButtons Flutter의 `ToggleButtons` 위젯은 여러 선택지 중에서 하나 이상의 옵션을 선택하게 해주는 데 사용됩니다. 예를 들어, 요일을 선택하는 기능의 경우, 사용자가 … Read more

플러터(Flutter)를 사용하면 다양한 모바일 앱을 효과적으로 개발할 수 있습니다. 사용자의 경험을 향상시키기 위해 많은 앱들이 현재 시간을 실시간으로 표시하는 기능을 포함하고 있습니다. 이 글에서는 플러터 시계를 만들어 시간을 실시간으로 표시하는 방법에 대해 자세히 알아보겠습니다. 초기 설정(initState) 먼저, `initState()` 함수에서 시작합니다. 이 함수는 위젯의 생명 주기 동안 한 번만 호출되며, 위젯 초기화에 이상적인 위치입니다. `initState()` 내에서 … Read more

Flutter에서 사용자의 입력을 받기 위한 숫자 키패드를 구현하는 것은 다양한 애플리케이션에서 요구되는 중요한 기능 중 하나입니다. 이 글에서는 `onscreen_num_keyboard` 라이브러리를 활용하여 플러터 Keypad를 구현하는 방법을 살펴보겠습니다. Flutter Keypad 사용자로부터 보안 PIN, 전화번호 등 숫자 기반 데이터를 수집해야 할 때, 숫자 키패드는 효과적인 UI 구성요소입니다. Flutter에서 이러한 기능을 구현하기 위해 `onscreen_num_keyboard`라는 외부 라이브러리를 사용할 수 있습니다. … Read more

플러터 애플리케이션에서 다크모드와 라이트모드를 손쉽게 전환할 수 있습니다. 이 글에서는 Flutter 다크모드를 Provider를 사용하여 구현하는 방법을 단계별로 설명합니다. Flutter 다크모드 다크모드는 화면의 밝기를 낮춰서 사용자가 눈의 피로를 덜 느끼도록 해주는 기능입니다. 라이트모드는 그 반대로 밝은 화면을 제공합니다. 두 모드를 지원하면 사용자가 자신의 선호에 따라 화면 모드를 변경할 수 있습니다. Provider 설치 및 설정 먼저 pubspec.yaml … Read more

아무리 기능적으로 뛰어난 앱이라도 디자인이 형편없다면 사용자들은 그 앱을 사용하지 않을 수 있습니다. 이번 글에서는 1인 개발자로서 디자인 요소를 다루기 위해 널리 사용되는 도구인 피그마(Figma)에 대해 알았보았습니다. 피그마(Figma)란? 피그마(Figma)는 디자이너들이 간편하게 UI/UX 디자인을 할 수 있도록 도와주는 웹 기반 도구입니다. 팀원들과의 실시간 협업이 가능하며, 클라우드 서비스로 접근성이 우수합니다. 피그마를 통해 프로토타입을 쉽게 제작할 수 있고, … Read more

Flutter에서는 많은 레이아웃 위젯들이 존재하지만, 그 중에서도 Stack 위젯은 요소들을 서로 겹치게 쌓아 복잡한 UI를 구성할 때 매우 유용합니다. 이 글에서는 Flutter Stack 위젯에 대해 자세히 설명하겠습니다. Stack 위젯이란? Stack 위젯은 Flutter에서 자식 위젯들을 겹쳐 쌓는 데 사용되는 레이아웃 위젯입니다. 이 위젯은 여러 자식들을 ‘쌓을 수’ 있어, 복잡한 레이아웃이나 애니메이션 효과를 구현할 때 매우 유용합니다. … Read more

Flutter AnimatedBuilder는 특별히 애니메이션을 쉽게 구성하고 관리할 수 있는 유용한 위젯 중 하나입니다. 이 글에서는 AnimatedBuilder에 대해 알아보고, 어떤 상황에서 사용하면 좋은지, 그리고 실제 예제와 함께 활용 방법을 설명하겠습니다. AnimatedBuilder란? AnimatedBuilder는 Flutter에서 애니메이션을 만들기 위해 사용되는 위젯입니다. 주로 애니메이션 상태를 위젯 트리에 효율적으로 전달하기 위해 사용됩니다. AnimatedBuilder는 Animation 객체와 모든 프레임마다 호출될 콜백 빌더 함수를 … Read more

Tooltip은 사용자에게 추가 정보를 제공하기 위해 UI 요소에 마우스를 올리거나 길게 누를 때 작은 팝업창을 표시하는 컴포넌트입니다. 이 글에서는 Flutter Tooltip 위젯에 대해 알아보고, 실용적인 예시와 함께 활용 방법을 설명하겠습니다. Tooltip이란? Tooltip은 마우스 오버나 길게 누름 등의 사용자 인터랙션에 반응하여 추가 정보를 제공하는 작은 팝업창입니다. 보통 아이콘, 버튼과 같은 UI 요소에 대한 설명을 나타내는 데 … Read more

SliverWidgets는 복잡한 레이아웃을 쉽게 구현할수 있는 위젯이며 스크롤 가능한 레이아웃을 구축하는 데 매우 유용합니다. 특히 Flutter SliverGrid와 SliverList는 스크롤 가능한 격자 및 목록 레이아웃을 만들 때 자주 사용됩니다. SliverGrid란? SliverGrid는 스크롤 가능한 격자(Grid) 레이아웃을 구현하는 데 사용됩니다. 격자 레이아웃은 카드나 썸네일 같은 콘텐츠를 배치하는 데 효율적입니다. 주요 특징 SliverGrid 사용법 다음은 SliverGrid의 기본적인 구현 예제입니다. … Read more

Flutter SliverAppBar는 스크롤 가능한 레이아웃에서 자주 사용되는 위젯입니다. SliverAppBar는 스크롤 시 숨기거나 고정할 수 있는 애니메이티드 앱바로, 보다 다이나믹한 앱 인터페이스를 구현할 때 유용합니다. 이 글에서는 Flutter의 SliverAppBar에 대해 알아보고, 실용적인 예시와 함께 활용 방법을 설명합니다. SliverAppBar란? 정의 및 개념 SliverAppBar는 Flutter의 Material 디자인 패키지에 포함된 위젯으로, 스크롤 할 때 확장되고 축소되는 앱바입니다. SliverAppBar는 일반 … Read more