Flutter30 [Flutter] 그림을 그려보자! CustomPaint 사이드 프로젝트를 하다가 네모난 카드에 배경 이미지를 넣을 일이 생겼다. 뭔가 구름모양 같은 곡선이미지면 괜찮지 않을까 하는 생각에 소스를 얻으려 구글을 돌아다녔다. 하지만 꽤 오랜 시간 구글을 뒤적거렸음에도 마음에 드는 이미지가 없었다. 그러다 문득 나는 화면에 UI를 그리고 있었는데, 왜 굳이 이미지 그림을 찾아다닌 걸까? 내가 필요한 간단한 background 그림을 그리려면 CustomPaint를 사용해서 충분히 그릴 수 있을 것 같았다. 덤으로 CustomPaint와 친해질 기회가 될 수도 있고. 우선 CustomPaint에 대해 알아보자. CustomPaint란 CustomPaint의 정의를 읽어보면 CustomPaint는 `paint phase`동안 그림을 그릴 캔버스를 제공해주는 위젯이다... 2024. 2. 1. [Flutter] A pragmatic guide to BuildContext in Flutter(요약,번역) 플러터가 실제로 화면을 그려내는 과정에 대한 궁금함이 있던 차에 좋은 아티클을 발견했다. Daria Orlova라는 사람이 작성한 A pragmatic guide to BuildContext in Flutter라는 글로, flutter framework를 이해하는데 많은 도움이 된 것 같아 글을 소개하는 의미로 요약,번역을 해보았다. 더 자세한 정보를 얻기 위해서는 꼭 원문을 읽어 보는 것을 추천한다. A pragmatic guide to BuildContext in Flutter | Codemagic Blog Understanding BuildContext is crucial to leveling up your Flutter development game. In this guide, Daria Orlo.. 2024. 1. 27. [Flutter] Ticker Class Ticker Class Ticker는 간단히 말해서 time tracker이다. Ticker는 어떠한 애니메이션이 시작된 이후, 경과된 시간을 기록하고, 경과된 시간에 대해 콜백을 실행시킨다. 또한, 다음 프레임을 연속적으로 set up하여 화면 전환이 부드럽고 연속적으로 보이게 한다. 즉, 플러터에서 애니메이션의 유려한 실행, 전환 등 UI의 '유동적인 움직임'을 보장하여 사용자에게 시각적인 효과를 줄 때 사용할 수 있다. 예제 import 'package:flutter/material.dart'; import 'package:flutter/scheduler.dart'; import 'package:http/http.dart' as http; import 'dart:convert'; void main(.. 2024. 1. 19. [Flutter] Constraints를 이해하고 layout만들기 나 같은 플러터 초보자들이 UI를 그릴 때 가장 에러를 많이 일으키는 가장 큰 원인은 잘못된 constraints의 사용일 것이다. 처음 플러터를 학습할 때는 Container, Text, Column 그리고 Row같은 위젯을 사용하여 단순한 layout을 만들어 보게 된다. 직관적인 선언형UI 덕분에 처음에는 빠르게 플러터에 적응하여 화면을 그려나갔을 것이다. 하지만 점점 위젯들이 중첩되고, 스크롤 위젯 등 다양한 위젯들을 활용하게 되었을 때, 어디서 부터 잘못된 것인지 파악하기도 힘든 상황들이 발생하게 된다. 대부분의 위젯 관련 에러는 Flutter의 Widget constraints에 대한 이해의 부족으로 발생한다. constraints에 대한 이해가 부족한 채 개발을 진행하게 되면, 쓸모 없는 위.. 2024. 1. 13. 이전 1 2 3 4 5 6 ··· 8 다음
