본문 바로가기

전체 글248

플러터 - Future, FutureBuilder 본 글은 [Do it! 깡샘의 플러터&다트 프로그래밍] 의 내용을 발췌한 것입니다. 책의 모든 내용을 저자 직강으로 진행한 강의는 ssamz.com 에서 들으실 수 있습니다. 퓨처 — Future 다트 언어에서 제공하는 Future, Stream, await, async는 모두 비동기 프로그래밍을 지원하는 기능입니다. 비동기 프로그래밍이란 시간이 오래 걸리는 작업을 실행한 후 끝날 때가지 기다리지 않고 다음 작업을 실행하는 것입니다. 비동기 프로그래밍과 반대되는 개념은 동기 프로그래밍으로 어떤 작업을 실행하고 끝날 때까지 기다렸다가 그다음 작업을 수행하는 것입니다. 먼저 동기로 실행되는 예를 들어 비동기 프로그래밍이 왜 필요한지 알아보겠습니다. 다음 코드에서 버튼을 클릭하면 onPress() 함수가 호출.. 2023. 3. 13.
플러터 - dio 본 글은 [Do it! 깡샘의 플러터&다트 프로그래밍] 의 내용을 발췌한 것입니다. 책의 모든 내용을 저자 직강으로 진행한 강의는 ssamz.com 에서 들으실 수 있습니다. 앞에서 서버와 HTTP 통신할 때 http 패키지를 이용하는 방법을 알아봤는데, 만약 더 많은 기능을 제공하는 패키지가 필요하다면 dio가 있습니다. dio를 사용하는 구체적인 방법은 pub.dev/packages/dio에서 확인할 수 있으며 여기서는 기본 사용법만 소개하겠습니다. 우선 dio 패키지를 이용하려면 pubspec.yaml 파일에 다음처럼 추가합니다. dependencies: dio: ^4.0.4 간단하게 GET 방식으로 서버에 요청하는 코드는 다음과 같습니다. Dio 객체의 get() 함수를 호출하여 서버에 요청하며 .. 2023. 3. 13.
플러터 - Navigation 본 글은 [Do it! 깡샘의 플러터&다트 프로그래밍] 의 내용을 발췌한 것입니다. 책의 모든 내용을 저자 직강으로 진행한 강의는 ssamz.com 에서 들으실 수 있습니다. 라우트 이해하기 플러터에서는 화면과 관련된 모든 것이 위젯입니다. 화면을 구성하는 문자열, 이미지도 위젯이며 화면 전체도 위젯입니다. 이제껏 살펴본 것처럼 위젯은 계층 구조로 구성됩니다. 그런데 대부분의 앱은 여러 화면으로 구성됩니다. 예를 들어 쇼핑 앱이라면 다음 그림처럼 로그인, 상품 목록, 장바구니 화면 등으로 구성됩니다. 이런 화면도 하나의 위젯으로 만들어 계층 구조로 구성해야 합니다. 이 그림처럼 화면이 3개인 앱을 만든다고 가정해 보겠습니다. 각각의 화면을 MyLoginScreen, MyCatalogScreen, MyCa.. 2023. 3. 13.
플러터 - Scaffold 본 글은 [Do it! 깡샘의 플러터&다트 프로그래밍] 의 내용을 발췌한 것입니다. 책의 모든 내용을 저자 직강으로 진행한 강의는 ssamz.com 에서 들으실 수 있습니다. 스캐폴드(Scaffold)는 앱 화면의 골격을 제공하는 위젯입니다. 앱의 화면 상단에 타이틀, 메뉴 아이콘 등을 출력하는 앱바, 화면 하단에 탭 버튼, 화면 오른쪽 아래에 둥근 버튼, 화면 왼쪽이나 오른쪽 가장자리에서 열리는 드로어 등을 포함할 수 있습니다. 이런 화면의 기본 골격을 스캐폴드 위젯으로 구성할 수 있습니다. 책의 모든 내용을 저자 직강으로 진행한 강의는 ssamz.com 에서 들으실 수 있습니다. Scaffold는 앱의 화면을 구성하는 다음의 속성을 제공합니다. 각 속성에 위젯을 지정하면 해당 영역에 콘텐츠를 구성할 .. 2023. 3. 13.
플러터 - ListView 본 글은 [Do it! 깡샘의 플러터&다트 프로그래밍] 의 내용을 발췌한 것입니다. 책의 모든 내용을 저자 직강으로 진행한 강의는 ssamz.com 에서 들으실 수 있습니다. 리스트 뷰는 크게 2가지 목적으로 사용합니다. 여러 위젯을 세로나 가로로 나열하면서 화면을 벗어날 때 스크롤을 지원하고자 사용하고, 일반 목록 화면처럼 항목을 나열하고자 사용합니다. 물론 목록 화면도 항목을 여러 개 나열하여 화면을 벗어날 때 자동 스크롤을 지원하므로 리스트 뷰의 목적은 하나라고 봐도 됩니다. 단지 위젯을 항목처럼 나열할 것인지 차이만 있습니다. 화면 스크롤 지원하기 다음은 위젯 여러 개가 나열되다가 화면을 벗어나서 스크롤이 필요한 상황입니다. Column( children: [ Container(height: 30.. 2023. 3. 13.
플러터 - TextField 본 글은 [Do it! 깡샘의 플러터&다트 프로그래밍] 의 내용을 발췌한 것입니다. 책의 모든 내용을 저자 직강으로 진행한 강의는 ssamz.com 에서 들으실 수 있습니다. 텍스트 필드(TextField)는 사용자에게 글을 입력받는 위젯입니다. 입력된 글을 출력해야 하므로 Text 위젯에서 살펴본 TextAlign, TextStyle 등으로 출력할 문자열을 정렬하거나 스타일을 지정할 수 있습니다. TextField( style: TextStyle(fontSize: 15), textAlign: TextAlign.center ) 책의 모든 내용을 저자 직강으로 진행한 강의는 ssamz.com 에서 들으실 수 있습니다. 입력된 데이터 얻기 — TextEditingController 텍스트 필드에 사용자가 입.. 2023. 3. 13.

티스토리툴바