일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
- C로 시작하는 컴퓨터 프로그래밍4판
- html
- 자바
- nico
- DART
- CSS
- ruby
- rails7
- springboot
- 연습문제
- 반다이몰
- java
- メソッド
- 単語
- jsp
- 日本語
- 인프런
- Flutter
- 일본어
- Spring
- rails
- 건담베이스
- vscode
- Web
- Python
- 비즈니스일본어
- 디지몬
- 건담
- 一日一つメソッド
- javascript
- Today
- Total
목록Dart (44)
AR삽질러

Flutter 기초 - Widget Stack (15) Widget Stack - Stack위젯은 자식 위젯들을 겹쳐서 배치할 수 있게 해주는 위젯으로 Stack의 자식들은 기본적으로 왼쪽 상단 모서리에서 시작하여 쌓고 다른 위젯과 달리 각 자식 위젯들은 서로의 위치를 고려하지 않고 독립적으로 배치된다. - Stack은 가장 먼저 선언된 Container가 가장 아래에 위치하고 이후 선언된 위젯들은 위로 쌓이게 된다. Stack - Align - Align위젯은 Stack내에서 특정한 위치에 자식을 배치하고자 할때 사용되며 Stack전체 공간 내에서 자식 위젯의 정확한 위치를 조정하고 alignment속성을 통해서 결정한다. Stack - Align - alignment - alignment속성은 A..

Flutter 기초 - Widget 비율 (14) Flexible, Expanded - Flutter에서 Container공간 내의 공간비율을 조정할 때 사용되며 두 위젯은 비슷한 기능을 수행하지만 공간 할당 방식에서 약간의 차이가 존재한다. 1. Flexible - 자식 위젯에게 남은 공간을 어떻게 분배할지 결정한다. - Flexible의 속성을 통해서 제어가 가능하다. - 여러 자식간의 크기 비율을 조금더 세밀하게 조정하고 싶을 경우 사용Flexflex값이 다른 위젯 들과 비교해 공간의 분배 비율을 결정한다.Fit기본값은 FlexFit.loose로 자식 위젯이 필요한 만큼의 공간만 차지하게 되어 할당된 공간을 최대한 채우도록 강제한다. 2. Expanded - fit속성을 FlexFit.tight..

Flutter 기초 - SingleChildScrollView (13) SingleChildScrollView - 단일 자식 위젯에 스크롤 기능을 추가할 수 있도록 해주는 위젯으로 수직 스크롤과 수평 스크롤 두가지 사용방식이 있다. 1. SingleChildScrollView (Vertical Scroll) - 수직 스크롤은 Column위젯과 함께 사용되며 목록, 이미지, 텍스트 등의 요소들을 수직 방향으로 스크롤할 수 있도록 한다. - SingleChildScrollView의 기본 스크롤 방향으로 Column위젯을 사용해 위젯을 수직으로 나열한다.import 'package:flutter/material.dart';void main() { runApp(MaterialApp( home: ..
Flutter 기초 - Widget상하 좌우 배치 (12) Column과 Row는 수직 및 수평 방향으로 자식 위젯들을 정렬하고 배치하는데 사용된다. 1. Column - 자식들을 수직 방향으로 배열한다. mainAxisSizeColumn높이를 결정한다.MainAxisSize.minMainAxisSize.maxmainAxisAlignment주축(수평)에 대한 자식 위젯들의 정렬 방식을 결정한다.MainAxisAlignment.startMainAxisAlignment.endMainAxisAlignment.centerMainAxisAlignment.spaceBetweencrosAxisAlignment교차 축(수직)에 대한 자식 위젯들의 정렬 방식으로 결정한다.CrossAxisAlignment.startC..

Flutter 기초 - Container, Center Widget (11)import 'package:flutter/material.dart';void main() { runApp( MaterialApp( home: Scaffold( appBar: AppBar( title: Text('Study to Container'), ), body: CustomContainer(), ), ), );}class CustomContainer extends StatelessWidget { const CustomContainer({super.key}); @override Widget build(BuildContext conte..

Flutter 기초 - MaterialApp, Scaffold (10) 1. MaterialApp - 앱의 최상위 레벨에 위치하며 Material Design앱을 만드는데에 필요한 여러 설정과 기능을 제공한다.네비게이션Navigator를 이용해 화면간의 라우팅 관리를 한다.(홈 화면, 상세 화면 등)테마전체 애플리케이션에 일관된 테마(색상, 폰트, 아이콘 스타일 등)를 적용해 앱의 외관을 통일할 수 있다.로케일다국어 지원을 위한 로케일 설정void main(){ runApp(MaterialApp( home: Scaffold( ), ))} - main함수에서 시작해 MaterialApp 위젯을 앱 전체를 감싸 MaterialApp 위젯이 최상위 컨테이너 역할 을 수행한다. - h..

Flutter 기초 - Hot restart, Hot reload (9) Hot restart - 앱을 재시작하는 형태로 앱의 모든 상태가 초기화 되고 변경사항을 반영할 수 있다.작동 방식전체 앱을 다시 컴파일하여 기존의 상태를 초기화후 앱을 다시 실행한다. 앱 빌드 시간이 걸리지만 Hot Reload보다 포괄적인 코드 적용이 가능하다.사용 시기전역 변수, 초기화 코드, 앱의 실행 흐름을 변경했을때 필요하며 Hot Reload에서 해결되지 않는 문제가 발생했을 때 유용하다.한계애플리케이션의 상태가 완전히 초기화되어 데이터나 이전 상태는 모두 반영되지 않는다. Hot reload - 앱을 재실행하지는 않지만 코드의 변경 사항을 반영하는 기능으로 앱의 상태를 유지한 상태로 코드의 수정사항을 확인해 빠른 개..
Flutter 기초 - Widget (9) Flutter State Basic - Flutter에서 상태(State)는 앱이 실행될 때 동적으로 변경될 수 있는 정보로 상태는 기본적으로 State Widget에서 관리된다. StatefulWidget - 변할 수 있는 상태를 가진 위젯으로 변경사항에 따라 내용이 변할 수 있다. Stateful Widget은 State객체를 생성해 상태를 관리하고 상태가 변경될때 마다 위젯을 다시 빌드하도록 한다. StatelessWidget - 불변의 상태를 가지는 위젯으로 위젯 생성 시점에 전달된 구성 정보를 기반으로 UI를 구성해 변경되지 않고 간단한 UI표현에서 주로 사용된다. Flutter Architecture - 위젯, 렌더링엔진, 패키지 매니저 이 요소는 U..

Dart 기초 - 레코드 (9) 1. 레코드란 - Dart3.0 이상 부터 사용할 수 있는 새로운 타입으로 포지셔널 파라미터(positional parameter), 네임드 파라미터(named parameter)가 이 두 방식은 함수에 값을 전달할 때 유연성과 명확성을 제공한다. 2. 포지셔널 파라미터(Positional Parameter) - 포지셔널 파라미터는 값을 전달할 때 순서에 따라 결정되므로 표시한 타입의 순서를 지켜야한다. 필수 포지셔널 파라미터 : 함수를 호출할 때 반드시 값을 제공해야 한다. 선택적 포지셔널 파라미터 : 대괄호 [ ] 를 사용해 정의하며 호출시 값을 생략할 수 있다.void main(){ (String, int) arang = ('아랑', 25); print(arang..

Dart 기초 - 비동기 프로그래밍 (8) 1. 동기 프로그래밍(Synchronous) - 동기 / 비동기는 프로그램의 작업의 실행순서나 방식에 대한 특성을 나타낸다.동기(Synchronoous) - 동기 프로그래밍은 순차적으로 실행되는 방식 - 하나의 작업이 끝나고 나서 다음 작업이 시작된다. - 하나씩 실행되기 때문에 순서가 명확하고 예측하기 쉽지만 작업시간이 많이 요소되는 어떠한 작업이 있을 경우 전체적인 프로그램의 효율이 저하될수 있다. ex) 웹 페이지에서 광고를 로딩하는 경우 광고가 완전히 불러와지기 전까지는 다른 웹 페이지가 차단될 수있다.import 'dart:io';void main(){ print("동기 시작"); time(); print("동기 완료");}void time()..