![]()
Overview. 이번에는 화면 이동을 위한 Routes 한마디로 네비게이터 경로 사용법을 알아봅시다. 화명 이동을 위한 Routes 이란? 명명된 네비게이터 이동 방식 1. 화면 이동을 위한 Routes 이란 모바일 앱은 종종 많은 수의 경로를 관리하며 이때 이름으로 참조하는 것이 가장 쉽습니다. 규칙에 따라 경로이름은 경로와 유사한 구조 (예 : '/a , /b , /c ')를 사용합니다. 이렇게 이름을 만들어서 routing 하는 방식을 명명된 네비게이터 경로 사용법이라고 합니다. 명명된 네비게이터 이동 방식 단순 객체를 이동하는 방식 라이브러리 사용하는 방식 방식이 있습니다. 2. 명명된 네비게이터 경로 방식 import 'package:class_login_app/pages/home_page.d..
![]()
https://www.designer-note.com/design-color-role/ [Design] 중요한 디자인 구성요소에는 중요한 컬러를 적용 – 비전공자를 위한 디자인 노트 이전 ‘비전공자를 위한 디자인 TIP! 01. 컬러와 폰트는 1~2개만 사용하자!‘와 ‘비전공자를 위한 디자인 TIP! 02. 레이아웃, 중요한 요소는 처음에, 크게 그리고 튀게!‘에서 중요한 역할을 하는 디 www.designer-note.com https://www.designer-note.com/category/design/ Design – 비전공자를 위한 디자인 노트 본문에 사용하면 가독성을 낮아지게 하는 폰트의 종류로는 필기체, 탈네모꼴, 이탤릭체(기울임꼴), 볼드체가 있습니다. 본문에 ‘고딕체 Regular’를 사..
![]()
🤝 문서 https://medium.com/flutter-korea/flutter%EC%9D%98-null-safety-%EC%9D%B4%ED%95%B4%ED%95%98%EA%B8%B0-dd4ee1f7d6a5 flutter의 null safety 이해하기 flutter를 이루고 있는 dart의 null safety에 대해 알아보겠습니다. medium.com 💪 들어가며 Flutter web stable 버전 출시와 더불어 Flutter 2.0의 가장 큰 변화는 Flutter 프로젝트에 null safety를 적용한 것이라 생각합니다. null safety가 무엇이고 어떻게 적용하는지 알아보겠습니다. 👋 null safety란 null safety는 말 그대로 null 에게서 안전한 프로그램 코드를 작성하..
https://api.flutter.dev/flutter/material/InkWell-class.html InkWell class - material library - Dart API A rectangular area of a Material that responds to touch. For a variant of this widget that does not clip splashes, see InkResponse. The following diagram shows how an InkWell looks when tapped, when using default values. The InkWell widget must have a Mate api.flutter.dev
![]()
OverView AspectRatio ClipRRect 1. AspectRatio AspectRatio로 이미지 비율 정하기 특정 종횡비로 자식 크기를 조정하는 위젯입니다. 이미지를 화면에 표시할 때는 비율로 표시하는 것이 좋습니다. AspectRatio 위젯은 먼저 레이아웃 제약에서 허용하는 가 장 큰 너비를 시도합니다. 위젯의 높이는 지정된 가로 세로 비율을 너비에 적용하여 결정되며 너비와 높이의 비율로 표 현됩니다. 예를 들어 넓이가 300이고 높이가 600인 화면이 있을 때 이 미지에 AspectRatio 위젯을 적용하여 비율을 2/1로 주게 되 면 넓이 300의 비율이 2가 되기 때문에 높이는 300의 절반 인 150이 됩니다. children: [ AspectRatio( aspectRatio:..
![]()
Overview Listview 에 대해 알아보자 ListView 사용시 주의점 1. ListView 만약 Column 위젯을 쓰다가 overflow 문제가 발생하게 됬다면? ListView 위젯을 활용하여 세로 스크롤 달기 ListView는 가장 일반적으로 사용되는 스크롤 위젯입니다. 스크롤 방향으로 자식을 차례로 표시합 니다. ListView를 사용하여 가로축으로 스크롤을 할 수 있고, 세로축으로 스크롤할 수 있습니다. Column을 ListView로 변경하고 crossAxisAlignment 속성을 제거합니다. ListView의 자식들의 기본 정렬은 왼쪽 정렬입니다. 이전 화면 바뀐 화면 2. ListView 를 사용할 시 주의점 💡 Expanded 위젯이나 Spacer 위젯은 화면의 남은 공간만큼..
Overview. Row 와 Column 위젯에는 주축 방향 과 교차축방향이 있다. MainAxisAlignment , CrossAxisAlignment Row 위젯 Column 위젯 1. MainAxisAlignment , CrossAxisAlignment MainAxisAlignment 는 주축방향을 말하며 CrossAxisAlignment는 교차축 방향을 뜻한다. 대표적으로는 Row 와 Column 위젯에 있으며 다음과 같다. 주축 방향이 가로이면 가로로 center , start , end 를 지정할 수 있고, 교차축 방향이 세로이면 세로로 center , start , end 를 지정할 수 있다. 2. Row 위젯 Row 위젯 의 주축 방향은 가로이며 , 교차축 방향은 세로다. 한마디로, 자식이..
![]()
Overview. 기본적인 폰트를 맞출 수 있는 사이트 소개, 적용법 사이트 pubspec.yml 적용하기 1. 사이트 아무 폰트나 다운받아서 ttf 파일을 2번 과 같이 넣어줍니다. https://fonts.google.com/selection/next-steps Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 2. pubspec.yml 아래와 같이 맞춤니다. 저희는 family 레벨의 옆 이름을 사용해 적용할 수 있습니다. ... # To add custom fonts to your application, add a fonts section here, # in this ..
Overview. 다트에서 제공하는 컬렉션 List , Map , Set 을 지원한다. List Map Set 1. List 자료구조 List는 데이터의 중복이 가능하고 순서가 있는 자료를 담는 컬렉션입니다. 자료는 순차적으로 index(번호)를 생성하여 쌓이게 됩니다. 이때 타입을 사용하게 되는데 제네릭 타입이라고 합니 다. 제네릭 타입이 처음인 분들은 크게 신경 쓰지 않아도 됩니다. 이유는 Dart는 타입 추론을 제공하 기 때문에 var로 선언할 수 있습니다. 모든 인덱스 번호는 0번부터 시작합니다. 결론 : 타입 지정 또는 추론을 지원한다. 타입 지정 List nums = [1,2,3,4]; 타입 추론 var nums = [1,2,3,4]; 인덱스 연산자를 활용해 값을 꺼낼수 있습니다. print(..
![]()
추상 클래스 추상 클래스는 추상적인 클래스입니다. 추상적이기 때문에 기본적으로 객체를 만들 수 없습니다. abstract class Animal { void sound(); } 추상 클래스란? 추상 클래스는 추상 메서드를 가지고 있습니다. 추상 클래스를 사용하는 이유는 수많은 객체를 추상 화하는 공통 부모를 만들 수 있기 때문입니다. 공통 부모를 만들면 어떤 이점이 있을까요? class Dog { void sound() { print('멍멍 배고파'); } } class Cat { void sound() { print('야옹 배고파'); } } void main() { Dog dog = Dog(); Cat cat = Cat(); Fish fish = Fish(); dog.sound(); cat.sound..
![]()
1. 상속 상속은 부모가 가진 상태와 행위를 자식이 물려받는 것과 동시에 다형성이 성립해야 합니다. 2. 다형성 다형성이란 여러 가지 형태를 가질 수 있는 능력을 의미합니다. 2 - 1. 다형성일까? - 엔진과 자동차 엔진과 자동차는 서로 반대 개념이다. 자동차 안에 엔진이 있기 때문이데, 이는 객체 지향 프로그래밍에서는 통용하지 않는 문법이란다 ..ㅎㅎㅎ.. 따라서 엔진이 자동차를 상속을 받는 것이 아닌 class 엔진 clas 자동차 { 엔진 } 포함 관계가 형성 되어야 하는 것이다!! 3. 이니셜라이져 [[ : ]] 간단하게 보면 Burger 가 먼저 만들어 지고 CheezeBurger 가 만들어지는 구조이다. 따라서 Burger 에 this.name( 단일 생성자 )가 있다면 부모에게 매개변수를 ..
late 키워드 late 키워드는 일반적으로 non-nullable 변수를 나타내는 late 변수를 정의할 때 사용됩니다. late로 선언된 변수는 초기화를 미루고, 변수가 실제로 사용되기 전에 초기화됩니다. late 키워드를 사용하는 이유 변수를 정의할 때 초기화할 수 있는 시점이나 방법이 없는 경우. 변수를 생성자나 함수에서 나중에 초기화해야 하는 경우. 변수를 사용하기 전에 null 여부를 확인하거나 예외 처리를 할 필요가 없는 경우 final 과 const final 상수 (불변) 런타임 상수 const 상수 (불변) 컴파일 상수
