차근차근 배움터

Text를 하나하나 치다보면 너무 지저분한 100줄이 될 수 있다 따라서 그에 맞는 커스템 위젯 문법을 배워보자 stless 작성하고 tab 키 누른다 class ShopItem extends StatelessWidget { const ShopItem({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return Container(); } } 대문자로 클래스 작명 body: ShopItem(), class ShopItem extends StatelessWidget { const ShopItem({Key? key}) : super(key: key); @override Widget build(BuildContext co..

지난 번 숙제가 있었는데 간단해 보이는 이 레이아웃을 만들기가 쉽지가 않다~^^ 제일 헷갈렸던 부분은 오른쪽 appBar에서 두 부분으로 박스를 나눠서 오른쪽은 actions: []로 그리고 어떻게든 spaceEvenly의 속성을 넣으려고 했는데 그것이 안된다......... ! import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold..

배경색상을 변경하고 appBar의 글자를 중앙정렬한 것과 같이 지난 시간에 배운 것을 살짝 응용해보았다 import 'dart:ui'; import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return MaterialApp( home: Center( child: Scaffold( appBar: AppBar( centerTitle: true, backgroundColor: Colors.blueA..

Wrap with container 클릭하면 자동으로 감싸준다 아래 Bar에 height을 주고 싶은데 넣을 수 있는 속성이 없어서 Container를 이용한다. Container 남용 방지를 위해서 계속 Lint 라는 것이 밑줄을 긋는다 이게 방해되면 설정에서 제거하면 되지만, 이렇게 밑줄이 뜨는 이유는 대용할 수 있는 코드가 있기 때문 Container박스가 무겁기 때문에 Container 대신에 SizedBox를 이용한다 import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key..

복습 child 를 사용할 수 있는 위젯들이 따로 있기 때문에 자동완성 확인하면서 사용하기 - 레이아웃 배우기 전에 MaterialApp을 확인해보자 구글이 제공하는 Material 테마를 이용할 수 있다. return MaterialApp( home: Scaffold( //앱을 상단 중간 하단으로 나누어준다 appBar: AppBar(), body: Container(), bottomNavigationBar: BottomAppBar( child: (Text('hello down part')), ), ) ); child: Text() 로 글자 삽입 가능하다 Scaffold는 기준점이 왼쪽이라 왼쪽부터 입력이 시작된다. 여러 위젯을 가로로 배치하고 싶을 때는 Row() 를 사용한다. return Mater..

시작하기 전에 기본 환경 설정 셋팅 중 하나가 남았다 test 폴더의 analysis_options.yaml 파일에 rules : 아랫 부분에 해당 코드들을 작성해준다. rules: prefer_typing_uninitialized_variables : false prefer_const_constructors_in_immutables : false prefer_const_constructors : false avoid_print : false Lint를 끄는 용도라는데 Lint가 뭔지 모르겠다.. 초보 때는 몰라도 된다고 하니 일단 패스 처음 코드 네 줄이 앱의 메인 페이지에 해당하는 기본 코드라고 한다. 처음에 배울 것은 앱의 디자인인데 Flutter에서는 앱 짜깁기를 통해서 디자인을 한다. impor..

간단한 Dart 강의를 노마드코더에서 수강했고 조만간 플러터 무료 강의가 나온다고 했으나 기다리기 지친 나는 유투브 무료 강의를 찾아보았다 그리고 코딩 애플님이 올려주신 강의를 차근 차근 수강해볼 예정이다 flutter sdk 설치 과정이 나와있고 환경변수 편집은 이제 어렵지 않게 한다. 그리고 cmd 나 powershell 을 켜서 flutter doctor을 입력하면서 필요한 것들이 다 설치되었는지 확인한다. 프로젝트 생성까지 완료 벌써 두근두근하다