워라밸을 꿈꾸는 사람

이거다.지금까지 만든 앱의 현재 상황을 간략하게 보여주는 역할을 한다.그리고, Main Axis와 Cross Axis의 정렬 방향도 실시간으로 보여주고 여기에서 변경도 가능하다.그리고... 왼쪽 위에 있는 'Select Widget Mode' 버튼을 누르면 실행중인 에뮬레이터로 가면 왼쪽의 사진처럼Widget들을 선택할 수 있다그리고 Widget Details Tree를 통해서 Widget의 자세한 정보들을 모두 확인할 수 있다.       이 사진은 Widget Details Tree를 통해서 선택한 Widget의 자세한 정보를 볼 수 있는 곳이다.     왼쪽 사진은 1번 사진의 오른쪽 위쪽 부분에 있는 5개의 버튼(다음 사진에 있는 것을 말한다.)에서 왼쪽에서 두 번째 버튼을 누르면 나오는 화면이다..

https://dribbble.com/shots/19858341-Financial-Mobile-IOS-App Financial Mobile IOS App dribbble.com여기에 있는 디자인을 따라서 해본다고 한다.(단순히 UI만 따라서 할 것이다.)나는 'ColorZilla'라는 chrome extension을 이용해서 색상을 가져왔다.진행한 내용은 다음과 같다: appBar를 제거한다. -> 제목 없이 모두 body에 때려박는 것 같다. (AI가 만들어주던 앱은 appBar를 사용하던데...)backgroundColor : 배경화면이 #181818인데, 이를 '0xFF'를 앞에 붙이고 뒤에 181818를 붙여주면 된다.Padding을 통해서 좌우의 공백을 만들어준다.SizedBox를 이용해서 위의..

나는 flutter 설치 하는게 생각보다 조금 복잡해서, 설치할 때마다 강의를 찾아서 따라하는 편이다(2.0, 2.2)... 편하다...만약 설치하기 귀찮다면, dartpad.dev에 들어가면 설치 없이도 할 수 있다.(하지만, 새 파일을 만들 수 없다.)완전히 기초부터 시작할 것이다.flutter는 Widget들로 이루어져 있다.여기서 Widget은 레고 블럭이라고 생각하면 되는데, flutter에서는 이 Widget들을 합치는 방식으로 앱을 만든다.그래서 flutter를 보면 알겠지만 전부 Widget 떡칠이다.아래는 main 함수로 App이라는 이름의 Widget을 run한다는 뜻이다.그래서 'App'은 우리 앱의 'root Widget'이다. -근본 위젯-void main() {  runApp(A..

둘 다 여러가지 운영체제를 서비스 하기 위한 언어이다.그럼 어떤 것을 사용하는 것이 더 좋을까?(물론, 나는 flutter를 쓰겠지...)React Native운영체제가 자체적으로 제공하는 위젯을 사용하고 싶을 경우 사용iOS와 안드로이드에서 다르게 보임.자바스크립트를 통해 운영체제와 소통 -> 네이티브 앱Flutter엔진으로 모든 컴포넌트 렌더링 -> 네이티브 앱'처럼' 만들어야 함.디자인이나 애니메이션 등을 전부 직접 만지고 싶을 때 더 유용함.Dart 언어 공부해야 함 -> 쉽긴 함.많은 사람들은 javascript에 익숙해서 react native로 시작하는 사람이 있을 것이다.그런데, 나는 그냥 C와 python만 연구를 위해 사용한 게 전부라서 모른다.그래서 나는 flutter로 시작한다.....

Flutter는 ios, android, windows 등등 거의 모든 환경에서 실행 가능하다.어떻게 이게 되는 걸까?nomadcoders의 강의와 flutter 공식 문서를 기초 내용으로 할 것이다.공식문서 출처(Flutter architectural overview): https://docs.flutter.dev/resources/architectural-overview네이티브 앱 개발을 할 경우(Swift로 iOS, Java로 안드로이드)운영체제와 직접적으로 대화.Flutter로 개발하는 경우운영체제와 직접적으로 소통 X -> ex) 실제 안드로이드 버튼을 만들어내는 기능 X공식문서에서는...During development, Flutter apps run in a VM that offers sta..

단순하게, 그냥 여러 클래스에서 재활용하기 위해서 만드는 것이라고 생각하면 편하다.mixin Strong {  final double strengthLevel = 1500;}mixin QuickRunner {  void runQuick() {    print("Ruuuuuuuuun");  }}mixin Tall {  final double height = 1.80;}이렇게 정의한다. 원래 class로 선언할 수 있지만, 버전이 바뀌면서 mixin이라고 명시적으로 선언해야 하는 것 같다.어떻게 쓰냐고?class Player with Strong, QuickRunner, Tall {  final Team team;  Player({    required this.team,  });}with으로 쓰면 된다.상..

이번에는 Inheritance. 상속.python같은 다른 언어와 비슷하다고 하는데...사실 나는 코드를 직접 배워본 적이 없고 야매로 하는 사람이라 잘 몰랐다...Human이라는 이름을 갖는 class가 있다고 하자.class Human {  final String name;  Human(this.name);  void sayHello() {    print("Hi my name is $name");  }}이제 Player이라는 이름을 갖는 class를 만들 것이다.그런데, Player도 사람일테니 Human class를 그대로 가져오고 싶다.(상속)class Player extends Human {  final Team team;  Player({    required this.team,    req..

Abstract Classes(추상화 클래스)란?'이 method 만들어!!!!!!!!!!' 라고 소리치는 역할을 한다.일단, 이렇게 선언한다.abstract class Human {  void walk();}이렇게 적으면 Human이라는 abstract class를 상속받는 친구들은 무조건 walk라는 void 형태의 함수가 있어야 한다고 강제한다.class Player extends Human {  String name;  XPLevel xp;  Team team;  // 변수 순서 안중요함.  Player({    required this.name,    required this.xp,    required this.team,  });  void walk() {    print('I\'m walki..

내가 심심해서 만들고 있던 flutter 앱(gpt가 코딩을 다 해준다... 나는 하는 게 없음)에서 최근에 Enum을 사용했다.마침 이게 나오네.'enum'은 선택의 폭을 좁혀주는 역할을 한다.문자열로 쓰는게 아니다. 일종의 '변수' 선언 같다.enum Team { red, blue }enum XPLevel { beginner, medium, pro }이렇게 Team과 XPLevel의 이름을 갖는 enum을 만들었다고 하자.그러면, Player라는 이름을 갖는 class는 다음과 같이 된다.class Player {  String name;  // int xp;  XPLevel xp;  // String team;  Team team;  // 변수 순서 안중요함.  Player({    required..

신기한 문법이지만, 간단해서 다음의 코드만 첨부한다.class Player {  String name;  int xp;  String team;  // 변수 순서 안중요함.  Player({    required this.name,    required this.xp,    required this.team,  });  void sayHello() {    print("Hi my name is $name");  }}void main() {  var me = Player(name: 'me', xp: 1200, team: 'blue');  // name, xp, team을 바꾸고 싶다면?  me.name = 'another';  me.xp = 1000;  me.team = 'red';  // 아래와 같이 쓸..