차근차근 배움터

맨 오른쪽 돋보기 버튼을 통해서 이렇게 developer tool을 통해서 구조를 확인할 수 있다 그리고 이 버튼을 누르게 되면, 직접 위의 아이콘을 누르면 화면에서 구조들을 클릭하며 확인할 수 있다 그리고 아래의 아이콘을 클릭하면 아래와 같이 컬럼/로우들을 보여준다 짱짱 import 'package:flutter/material.dart'; class Player { String? name; Player(); //this.name에 들어오는 인자가 name으로 들어갈 것이다 // name = this.name } void main() { var nico = Player(); runApp(App()); } class App extends StatelessWidget { @override Widget bu..

- 각 컬럼(열)을 오른쪽 정렬하고 싶을 때 crossAxisAlignment: CrossAxisAlignment.end 이걸 사용해야 한다............ Main이랑 늘 헷갈림...... - 그리고 color 들어간 Text 에 opacity 주고 싶을 때 한 번에 줄 수 있다. style: TextStyle( color: Colors.white.withOpacity(0.5), ), - background color를 16진수 코드로 주고 싶을 때 Colors.black 대신에 이렇게 사용한다. 0xFF는 기본 값으로 적고 숫자를 이어서 입력해야 한다. Color(0xFF181818), 이런 식으로 VS Code에서 색상 코드를 확인할 수 있다 (opacity 포함) - padding값 주는 법..

import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; class Player { String name; Player({required this.name}); //this.name에 들어오는 인자가 name으로 들어갈 것이다 // name = this.name } void main() { var nico = Player(name: 'Yu'); runApp(App()); } class App extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar( cen..

screen 구성에 적절한 구조를 제공하는 것이 Scaffold AppBar 역시 여러가지 위젯을 입력할 수 있고 그 중에 우리가 입력한 것은 title이 있었다. centerTitle: true, elevation: 1, appBar에 생성할 수 있는 이러한 위젯들도 있다. 따라서 위젯과 위젯으로 구성되어 있는 Flutter에 겁먹을 필요가 없다!

Everything in flutter is widget. 위젯을 이용해서 어플을 만들고 Flutter 웹사이트에 가면 이렇게 위젯 카탈로그도 확인해볼 수 있다 외울 필요 없이 뭐가 있는 지 확인하면 된다 사람들이 만든 위젯을 98.9프로 거의 다 찾을 수 있다 기억해야할 필요 없다. 위젯이 되기 위해서는 StatelessWidget을 extend 해야 한다. 지금은 BuildContext context 무시하자, 나중에 설명해주겠음 플러터 관점에서 위젯은 UI를 구성하는 블럭 같은 것이다 프로그래밍 관점에서는 클래스 import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class App extends Stateles..

계속 backgroundColor라고 검색했는데 생각해보니 박스 자체의 색상이니 color가 맞다.... 텍스트에 color 주려면 그냥 TextStyle...★ Container 박스는 무거운 편이라서 보통 SizedBox를 이용해서 성능 개선을 한다고 들었다. 그러나 Container와 같은 방식으로 SizedBox에 색상 삽입이 안돼서....... 구글링한 결과 DecoratedBox()로 감싸서 사용해야 한다고 한다. Container에서는 Container( color: Colors.black, ) 이런식으로 하위에 박스 컬러를 넣을 수 있었는데 Row는 이런식으로 불가능하다. 그래서 찾아본 결과 SizedBox, 박스에 색상을 넣고 싶으면 child : 아래 DecoratedBox로 감싸서 d..

한 때 자주 썼던 숨고 레이아웃을 따라하려고 한다. 기본 디자인은 이렇게 되어 있고 나는 이 부분만 따라해보려고 한다. 현재까지는 이렇게 만들었다 - 11/27 더 수정할 필요한 부분을 생각해보자면, 1) 숨고 페이 사진을 저 공고 위에 붙일 것 2) 영어과외 부분에 위아래 마진을 더 줄 것 3) 위치와 받은 견적 부분에도 마진 4) 삭제 자세히 보기를 Flex로 3:7 비율로 설정할 것 - 시도는 했으나 왜인지 안먹혀서 막혔다 5) 박스 색상을 하얀색으로 줄 것, 하얀색 처럼 보이지만 약간의 회색이다.

title: Text('받은요청', style: TextStyle(color: Colors.black)), 맨날 헷갈린다 Text(안에다가, style: TextStyle(color:.......)

봉투가 열린 편지 모양을 찾으려고 한참 검색 하다가 발견한 사이트 여기에 필요한 아이콘을 입력하면 비슷한 것들을 찾아준다! Material Design Icons, Material UI, Vuetify List- Get All latest Materialdesign icons- Use Easily in HTML, CSS - Materialdesigni Material Design Icons, Material UI, Vuetify List- Get All latest Materialdesign icons- Use Easily in HTML, CSS - Materialdesignicons Get User icon, Search Icon, You can quickly access the Materialdesi..

파워쉘 powershell을 이용해서 Flutter 프로젝트 파일을 만들어 보았다 cd .. 이전 경로로 이동 mkdir 디렉토리/폴더 만들기 code . 하면 프로젝트가 실행된다. Visual studio code 가 실행되고 나서 Flutter/Dart extension 설치해준다. 해당 강의에서는 vs code를 이용했는데 개인적으로는 android studio가 더 빠르다..... 강의대로 VS Code 이용해볼지 아닐지는 생각해봐야겠다.