flutter

Flutter/Riverpod

Flutter) Riverpod refresh / invalidate - 6

invalidate final countProvider = StateProvider((ref) => 0); class HomePage extends ConsumerWidget { const HomePage({Key? key}) : super(key: key); @override Widget build(BuildContext context, WidgetRef ref) { print("HomePage Build"); return Scaffold( body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text("Hello World"), Consumer( builder: (context, ref, widget)..

Flutter/Riverpod

Flutter) Riverpod Consumer 사용하기 - 5

class MyApp extends ConsumerWidget { const MyApp({super.key}); @override Widget build(BuildContext context, WidgetRef ref) { //ref를 사용해 프로바이더 구독하기 final counter = ref.watch(counterProvider); ref.listen(counterProvider, (previousState, newState) { print("The new value is $newState"); }); return MaterialApp( home: Scaffold( appBar: AppBar(title: Text("Riverpod Study")), body: Center( child: Column..

Flutter/기본

[Flutter] dark테마로 앱만들기

class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return MaterialApp( themeMode: ThemeMode.dark, darkTheme: ThemeData.dark(), debugShowCheckedModeBanner: false, home: const HomePage(), ); } } themeMode: ThemeMode.dark darkTheme: ThemeData.dark() 설정하시면 dark테마로 앱을 만들수 있습니다.

Flutter/Riverpod

Flutter) Riverpod watch,listen,read 사용하기 - 4

이 글은 Riverpod 공식문서를 참조 하였습니다. 이전글에서 "ref" 객체를 얻어오는 방법에 대해 알아봤습니다. 이제 "ref" 객체의 사용방법에 대해 알아보겠습니다. ref 주요기능 3가지 ref.watch - 프로바이더의 값을 얻고 값의 변화를 감지합니다. - 값의 변화를 감지하면 Widget을 재빌드 하거나 해당 값을 구독하고 있는 곳에 변경된 상태값을 전달 합니다. ref.listen - 프로바이더의 상태값을 구독하거나 - 상태값이 변했을때 어떠한 행위를 취해야할 경우 사용합니다. ref.read - 프로바이더의 상태값을 얻습니다. - 이벤트 콜백함수에 사용하기 유용합니다. - 예를 들어 버튼의 onPressed 콜백 함수에서 프로바이더의 필요한 상태값을 얻기위해 사용가능합니다. 기능을 구현..

Flutter/Riverpod

Flutter) Riverpod "ref" 얻기 - 3

이 글은 Riverpod 공식문서를 참조했습니다. 이 글에서는 "ref" 객체를 얻는 방법을 설명하겠습니다. "ref" 객체 얻기 프로바이더를 읽기전에 "ref" 객체를 얻어야 합니다. "ref"는 프로바이더간에 상호작용을 도와주고 위젯이나 다른 프로바이더에서 얻을 수 있습니다. 프로바이더로 부터 "ref" 객체 얻기 모든 프로바이더는 "ref" 객체를 파라미터로 받게 됩니다. final provider = Provider((ref) { // 다른 프로바이더 객체를 얻기위해 ref를 사용합니다. // 여기서 repositoryProvider 프로바이더를 Provider 에서 읽는 것을 확인합니다. final repository = ref.watch(repositoryProvider); return Som..

Flutter/Riverpod

Flutter) Riverpod 프로바이더란? - 2

해당글은 Riverpod 공식문서를 참조하였습니다. 이전 글에서 우리는 Riverpod를 설치하고 간단하게 사용해 보았습니다. 프로바이더는 Riverpod에서 가장 중요한 부분 입니다. 이제 "Provider"에 대해 알아보도록 하겠습니다. 프로바이더는 하나의 상태조각의 압축된 객체이자 상태의 변화를 감시하는 역할을 합니다. 왜 프로바이더를 사용하나요? 상태를 프로바이더로 감싸게 되면 아래의 서술된 내용들이 가능합니다. 코드상 다양한 위치에서 상태를 쉽게 접근할 수 있습니다. 프로바이더는 Singletons, Service Locators, Dependency Injection 또는 InheritedWidgets 과 같은 디자인 패턴들을 완벽하게 대체할 수 있습니다. 다른 프로바이더 상태와 간편하게 결합..

Flutter/Riverpod

Flutter) Riverpod 상태관리 시작해보기 - 1

이 글은 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 을 합니다. 이걸..

Flutter/기본

[Flutter] Text Height 주는 방법

해당 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 값에 계산한 값을 넣어주면 됩니다.

주톨
'flutter' 태그의 글 목록 (10 Page)