컨테이너

플러터 프로젝트를 새로 만들면 기본적으로 MaterialApp을 사용해 UI를 생성합니다. 딱히 신경 안 쓰고 개발하다 궁금해서 공부해봤습니다. MaterialApp Flutter는 Material Design을 바탕으로 위젯이 만들어집니다 MaterialApp은 Material Design을 사용할 수 있게 해주는 class 인 것이죠 ( 플러터에 미리 정의되어 있어 별도의 개발이 필요 없음 ) 아래 예제 코드를 같이 실행시키며 확인해봅시다. import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { // This widget is the root of your a..

플러터의 모든 UI는 위젯으로 구현됩니다. 이렇게 UI를 구성하는 위젯의 class는 두 가지가 있습니다. StatelessWidget | StatefulWidget StatelessWidget (상태를 가지지 않는 위젯) import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { int count = 0; @override Widget build(BuildContext context) { return MaterialApp( title: 'StatelessWidget', home: Scaffold( appBar: AppBar( title: Text("Stateless..

지금 하고있는 Flutter 프로젝트에서 카카오 맵 api를 적용시키려 많은 삽질을 했다. ( 대부분이 키 해시 관련 문제였지만 ) 여러분들은 이 글을 보고 조금이라도 편하게 하시길 네이버 맵은 사용 방법이 훨씬 쉽습니다. 혹시 네이버 맵을 사용하실 분들은 아래를 참고해주세요 [Flutter] Naver Map 사용하기 최근 지도 관련 어플을 Flutter의 Naver Map으로 개발했습니다. 확실히 UI도 한국인들에게 친숙하면서 깔끔하고, 지도에 위치한 장소나 식당 등의 최신화가 잘 되어있더라구요. (구글 맵 같은 경우 폐 ahang.tistory.com 이 글은 Window, Android 기준으로 작성되었습니다. 1. 프로젝트 생성 import 'package:flutter/material.dart..

App의 UI를 디자인하다보면 가끔 AVD의 StatusBar가 거슬릴 때가 있다. ( 특히 안드로이드 ) 이러한 StatusBar는 아예 안보이게 숨길 수도 있고 색을 변경하여 디자인으로 활용할 수 있다. 1. Hide (숨기기) import 'package:flutter/services.dart'; 해당 package를 import 후 아래 코드를 build 함수 안에 적어준다. ( [ ] 안에 보고싶은 상단, 하단 StatusBar를 입력해준다. 현재 리스트가 비어있으므로 모든 StatusBar를 숨김 ) SystemChrome.setEnabledSystemUIOverlays([]); 예시 class MyApp extends StatelessWidget { @override Widget build(..