이 글은 Riverpod 공식문서를 참조 하였습니다. 이전글에서 "ref" 객체를 얻어오는 방법에 대해 알아봤습니다. 이제 "ref" 객체의 사용방법에 대해 알아보겠습니다. ref 주요기능 3가지 ref.watch - 프로바이더의 값을 얻고 값의 변화를 감지합니다. - 값의 변화를 감지하면 Widget을 재빌드 하거나 해당 값을 구독하고 있는 곳에 변경된 상태값을 전달 합니다. ref.listen - 프로바이더의 상태값을 구독하거나 - 상태값이 변했을때 어떠한 행위를 취해야할 경우 사용합니다. ref.read - 프로바이더의 상태값을 얻습니다. - 이벤트 콜백함수에 사용하기 유용합니다. - 예를 들어 버튼의 onPressed 콜백 함수에서 프로바이더의 필요한 상태값을 얻기위해 사용가능합니다. 기능을 구현..
이 글은 Riverpod 공식문서를 참조했습니다. 이 글에서는 "ref" 객체를 얻는 방법을 설명하겠습니다. "ref" 객체 얻기 프로바이더를 읽기전에 "ref" 객체를 얻어야 합니다. "ref"는 프로바이더간에 상호작용을 도와주고 위젯이나 다른 프로바이더에서 얻을 수 있습니다. 프로바이더로 부터 "ref" 객체 얻기 모든 프로바이더는 "ref" 객체를 파라미터로 받게 됩니다. final provider = Provider((ref) { // 다른 프로바이더 객체를 얻기위해 ref를 사용합니다. // 여기서 repositoryProvider 프로바이더를 Provider 에서 읽는 것을 확인합니다. final repository = ref.watch(repositoryProvider); return Som..
해당글은 Riverpod 공식문서를 참조하였습니다. 이전 글에서 우리는 Riverpod를 설치하고 간단하게 사용해 보았습니다. 프로바이더는 Riverpod에서 가장 중요한 부분 입니다. 이제 "Provider"에 대해 알아보도록 하겠습니다. 프로바이더는 하나의 상태조각의 압축된 객체이자 상태의 변화를 감시하는 역할을 합니다. 왜 프로바이더를 사용하나요? 상태를 프로바이더로 감싸게 되면 아래의 서술된 내용들이 가능합니다. 코드상 다양한 위치에서 상태를 쉽게 접근할 수 있습니다. 프로바이더는 Singletons, Service Locators, Dependency Injection 또는 InheritedWidgets 과 같은 디자인 패턴들을 완벽하게 대체할 수 있습니다. 다른 프로바이더 상태와 간편하게 결합..
이 글은 Riverpod 공식문서를 참조하여 작성했습니다. Riverpod 설치하기 Riverpod에는 여러종류에 패키지가 있습니다. 패키지마다 사용 목적이 있으며, 만드는 앱의 형태에 맞게 설치하시면 됩니다. 기본적으로 flutter_riverpod 패키지를 사용합니다. 1. 패키지 추가 pubspec.yaml에 사용하고자 하는 패키지를 추가 해줍니다. 버전은 https://pub.dev/packages/flutter_riverpod/install 에서 확인해 줍니다. 작성기준 버전은 2.1.3 입니다. -pubspec.yaml 파일에 패키지를 추가합니다. dependencies: flutter: sdk: flutter flutter_riverpod: ^2.1.3 그리고 Pub get 을 합니다. 이걸..
해당 Text 처럼 Text 사이의 약간의 Height를 지정 하고 싶다면 이렇게 해보세요. 준비물 1. 해당 Text Size 를 알아야 합니다. 2. Text Design 에 Line height 을 알아햐 합니다. 이제 Line height % Text Size 를 계산 해야 합니다. 준비는 끝났습니다. Text( "유저 간 시그널, 제휴업체의 골든벨 등\n지도기반 서비스를 활용하기 위해 사용합니다.", style: TextStyle(fontSize: 12, color: Color(0xff7C7C7C), height: 1.583), ), TextStyle의 height 값에 계산한 값을 넣어주면 됩니다.
Align 부모의 위젯 안에서 자식 위젯을 배치시킬 수 있는 위젯. 생성자 Align({Key? key, AlignmentGeometry alignment = Alignment.center, double? widthFactor, double? heightFactor, Widget? child}) 속성 alignment 자식을 배치시키는 방법. heightFactor -> double 자식을 기준으로 가상의 높이를 가진 부모를 만들어 그 안에 배치. widthFactor -> double 자식을 기준으로 가상의 넓이를 가진 부모를 만들어 그 안에 배치. Align 사용해보기. 100*100 사이즈의 빨간 Container 를 생성했습니다. 이 Container를 중앙으로 위치하게 하고 싶으면 어떻게 해야 ..
AbsorbPointer 각종 터치이벤트를 제어할 수 있는 위젯. 생성자 AbsorbPointer ({Key? key, bool absorbing = true, Widget? child, bool? ignoringSemantics}) 속성 absorbing -> bool true = 터치이벤트 제어켬 false = 터치이벤트 제어끔 기본 값 true ignoringSemantics -> bool? 뭔지 알려주시면 감사하겠습니다. 잘 안쓰는거같아요. 기본값 null AbsorbPointer 사용해보기. + 버튼을 누르면 숫자가 올라가고 - 버튼을 누르면 숫자가 내려가는 이벤트를 하는 버튼들이 있습니다. AbsorbPointer 를 사용해 이 버튼들의 터치를 제어 하도록 하겠습니다. AbsorbPointer..
pub.dev 에서 제공하는 google_maps_flutter 를 사용해서 간단하게 지도를 띄워보자. 프로젝트 생성 flutter 프로젝트를 생성후 main에 있는 코드들을 전부 지우고 시작! google map api key 받기 구글맵을 사용하려면 api key를 받아야 한다. https://mapsplatform.google.com/ Google Maps Platform - Location and Mapping Solutions Create real world and real time experiences for your customers with dynamic maps, routes & places APIs from Google Maps Platform’s location solutions. m..
