728x90 반응형 DART11 [Ultralytics Hub Flutter Clone Coding] #2. 홈 만들기 저번 포스팅에서 사이드 메뉴를 만들었다. 이번에는 홈 화면을 구성해보려고 한다. 오른쪽 아이템들은 카드로 구성되어 있다. 5개의 위젯을 가지고 구성하면 될 것 같다. 밑에 빠른 액세스 카드는 이미지가 없기 때문에 이미지는 optional 로 두고 인자에 따라 layout 을 다르게 구성하면 될 것 같다. Flutter 에서는 Card 위젯을 제공한다. 하지만 Card 위젯에는 사이즈를 지정하는 옵션이 없다. 찾아보니 SizedBox 라는 위젯이 있고 이를 사용해 Card를 감싸면 SizedBox 내의 사용가능한 공간 만큼 Card 가 expand 되어 표시되게 된다. Card 의 Layout 을 생각해보자 최상단 Layout 은 Row 가 될 것이고 왼쪽에는 Column 을 사용하면 될 것 같다. Col.. 카테고리 없음 2023. 2. 12. [Ultralytics Hub Flutter Clone Coding] #1. 사이드 메뉴 만들기 강의가 지루해서 클론 코딩을 시작해보려고 한다. 클론 코딩의 대상은 Yolo 를 만든 Ultralytics 라는 회사의 딥러닝 플랫폼 제품이다. https://hub.ultralytics.com/ Ultralytics HUB hub.ultralytics.com 프론트엔드 코딩에 대한 지식이 전무하지만 어떻게든 되겠지 하는 마음으로 해보려한다 ㅎㅎㅎ 홈 화면 왼쪽에는 접어지는 메뉴가 있고 홈, 데이터 셋, 프로젝트, 모델, 기타로 구성되어 있다. 클론 코딩 대상은 홈 ,데이터 셋, 모델 정도로 하려고 한다. 오른쪽에는 튜토리얼과 빠른 액세스, 계정 정보가 보여진다. 사이드 메뉴 flutter 위젯 중에 비슷한게 생긴 것을 찾아 보니 side_navigation 이라는 것이 있었다. pubspec.yaml .. 지식/Flutter 2023. 2. 11. [Flutter] Constructor(생성자) 기본적인 생성자 사용법은 다른 언어들과 크게 다르지 않다. 하지만 독특한 문법이 있어서 정리해본다. 단순한 사용법은 다음과 같다. class Person { String name; int age; // 기본 Person(String name, int age) { this.name = name; this.age = age; } // 조금 다르게 Person(String name, int age) : this.name = name, this.age = age; // 조금 짧게 Person(this.name, this.age); } 너무 방법이 다양해서 헷갈리는 것 같다..ㅠ 다른 언어에서는 인자의 개수나 타입을 다르게하여 여러개의 생성자를 만들 수 있다. 하지만 Dart 에서는 생성자 이름이 같으면 erro.. 지식/Flutter 2023. 2. 4. [Flutter] Stateless vs Stateful react 를 잠깐 공부했을 때 state 라는 개념을 접했었다. 그것과 똑같은 개념으로 Flutter 에도 state 가 존재한다. gui 프로그래밍을 해 본 적이 있는 사람은 알고 있겠지만 우리가 보는 화면에서는 계속 rendering 이 발생하고 있다. 이 때 모든 위젯 들을 다시 rendering 한다면 속도가 매우 느릴 것 이다. 이를 최적화 하기 위해 나타난 개념이 state 이다. flutter 에서 stateless 위젯은 위젯을 생성할 때 외에는 rendering 되지 않는다. 다만 stateful 위젯은 내부 변수가 바뀔 때 rendering 을 다시 수행한다. 이러한 철학 때문에 StatelessWidget의 변수를 final 이나 const 로 지정하지 않으면 기분 나쁜 줄이 생긴다.. 지식/Flutter 2023. 2. 3. [Flutter] 개요 본 포스팅은 udemy 의 강의를 기반으로 작성되었습니다. Flutter & Dart - The Complete Guide [2023 Edition] | Udemy Why Flutter Flutter 는 하나의 코드 베이스만으로 다양한 플랫폼에서 구동이 가능하다. 이는 크로스 플랫폼을 개발하기 위한 개발 비용 절감에서 큰 이득을 볼 수 있다. 네이버 블로그에서 Flutter 를 통해 지식IN 을 개발하게 된 이유와 과정을 잘 써주셨는데, 이런쪽에 경험이 전혀 없어서 모든 것을 이해하진 못했지만 좋은 글인 것 같다. 지식iN 앱을 Flutter로 개발하는 이유 (naver.com) 요약하면 기존에 사용하던 라이브러리를 사용하지 못하는 이슈나 아예 새로운 언어를 배워야한다는 단점을 제외하면 Flutter 를.. 지식/Flutter 2023. 1. 29. Dart 반복문 For loop c 언어와 동일하게 사용가능하다. for (var i = 0; i 2 -> do something -> 3 -> 2 -> do something -> 3 -> 2 -> ... python 의 for-in 구문도 사용 가능하다. for (final obj in objs) { // do something } in 뒤의 객체가 iterable 일 경우 사용 가능하다. while while (반복조건) { // do something } do { // do something } while (반복조건) 반복 조.. 지식/Flutter 2023. 1. 23. Dart 조건 분기 if else 문이다 이 이상 설명이 필요하지 않은 것 같다. 때로는 새로운 언어를 배울 때 그냥 그냥 넘어가는 것도 좋은 것 같다 Conditional Expression 은 짚고 넘어가자. 간단한 조건 로직의 경우 한 문장으로 쓸 수 있다. condition ? expr1 : expr2 condition 이 만족하는 경우 expr1 을 아닌경우 expr2 를 수행(리턴)한다. expr1 ?? expr2 expr1 값이 null 이 아니라면 expr1 을 null 이라면 expr2 를 수행(리턴)한다. 상황에 따라 잘 골라쓰면 될 것 같다. 예상하기로는 우선순위가 고려되는 로직의 경우 ?? 구문을 쓰는 것이 훨씬 가독성이 좋을 것 같다. 반대로 우선순위가 없는 단순 조건 분기의 경우에는 ? : 를 쓰는.. 지식/Flutter 2023. 1. 23. Dart functions 다트는 기본적으로 object-oriented language 로 python 과 유사한 점이 매우 많다. python 과 마찬가지로 function 도 function type 의 object 이다. 다음과 같이 함수 역할을 하는 클래스를 만들 수도 있다. class WannabeFunction { String call(String a, String b, String c) => '$a $b $c!'; } var wf = WannabeFunction(); var out = wf('Hi', 'there,', 'gang'); void main() => print(out); python 에서는 __call__ 을 정의하면 위와 똑같이 만들 수 있다. 함수 정의 함수를 정의하는 방법은 c 언어와 매우 유사하다... 지식/Flutter 2023. 1. 23. Dart Final 과 Const Language tour | Dart A tour of the Dart language A tour of all the major Dart language features. dart.dev Dart 에서는 상수를 두가지 방법으로 선언할 수 있다. Final 값을 수정할 수 없는 변수이다. 하지만 초기화를 안해도 된다. 선언 후에 딱 한번 값을 할당할 수 있다. final int a = 3; 이렇게도 할 수 있다. 타입 지정을 안하면 var 로 간주되어 dynamic 하게 받아온다. Const final 과 같이 값을 수정할 수 없다. 하지만 동작 과정에서 큰 차이가 있는데, final 은 runtime 중에 값이 메모리에 올라가고 Const 는 compile 타임에 올라간다. 런타임 중에 메모리 부하가 .. 지식/Flutter 2023. 1. 21. Dart 자료형 Language tour | Dart A tour of the Dart language A tour of all the major Dart language features. dart.dev Flutter 를 배우기전 Dart 와 조금 친해져보려고 한다. 결론부터 말하면 "타입 빡센 빠른 파이썬" 느낌이다. Built-in types Dart 에는 타입들이 존재한다. int, double, String, bool, List, Set, Map, Runes, Symbols. 각각은 매우 직관적이며 파이썬과 같이 모두 Object 이다. built-in 함수들도 많이 존재하는데 javascript 정도 인 것 같다. (직관적이고 쉽다.) 변수 선언시에 타입 변수명 = 값; 이렇게 해도 되지만 var 을 사용하면.. 지식/Flutter 2023. 1. 21. Dart 설치 플러터가 미래일 것 같다는 생각이 들어 플러터를 찍먹해보려고한다. 서피스 프로를 구매하게 되어 뭔가 딥러닝이 아닌 다른 분야의 개발을 해보고 싶었다. (무슨 말인지 나도 모르겠다 ㅋㅋ) 플러터는 듣기로 android, ios, window, linux, embedded 등 모든 플랫폼에서 사용 가능하다고 한다. 자체 엔진이 있어서 os 제약을 받지 않는 다는 장점이 있기 때문이다. 하지만 자체 엔진 때문에 조금 무겁다고 한다. 가벼운 토크로 다른 분들과 딥러닝 모델 최적화를 연구하는 속도랑 gpu 연산속도 발전 속도중 뭐가 더 빠를까 이야기 한적이 있다. 둘 다 중요하지만 개인적으로 gpu의 발전이 조금 더 critical 할 것이라는 생각이 든다. 플러터는 무겁지만 금방 적응 할 것이고, 모든 플랫폼에.. 지식/Flutter 2023. 1. 21. 이전 1 다음 728x90 반응형