차근차근 배움터

재생 버튼을 누르면 재생되고 멈춤 버튼을 누르면 멈추는 기능을 만들어 봤다. 이런 작업을 할 때 boolean을 이용한다는 것 잊지 말기 그리고 함수 안에 setState() 넣기도 잊지 말자 다음 시간에는 숫자가 시간 형태로 59 이상을 넘어갈 때 00으로 넘기는 작업을 한다.

재생 버튼을 누르면서 현재 시간이 줄어드는 기능을 추가해봤다 다음 시간에는 멈춤 기능을 만들어 본다. import 'dart:async'; import 'package:flutter/material.dart'; class HomeScreen extends StatefulWidget { const HomeScreen({super.key}); @override State createState() => HomeScreenState(); } class HomeScreenState extends State { int totalSeconds = 1500; late Timer timer; void onTick(Timer timer) { setState(() { totalSeconds = totalSeconds - 1..

사이즈를 하드 코딩하는 것보다 사실 flexible을 사용하는 것이 기기의 비율을 바탕으로 꽉 채워주기 때문에 이게 제일 이상적인 크기 설정 방법이 아닐까 싶다. import 'package:flutter/material.dart'; class HomeScreen extends StatefulWidget { const HomeScreen({super.key}); @override State createState() => HomeScreenState(); } class HomeScreenState extends State { @override Widget build(BuildContext context) { return Scaffold( backgroundColor: Theme.of(context).bac..

statefulWidget에 대해서 한 가지 더 알아야 할 점은 Live cycle라는 것이다. 한 번 씩 확인하는 게 좋은 것 initState는 state를 initialize하기 위함이다. 하지만 그냥 int count = 0; 쓰듯이 state를 initialize할 수도 있다. 대부분의 경우 initState()를 사용하지 않아도 된다. 하지만 가끔 위젯은 initilaitze some datas depends on the paretns, ocontext를 사용해야 할 수도 있다. context/subscribe를 사용해야할 수도 있다. initState method build 메서드 전에 호출되며 오직 한 번만 호출된다. initState()를 사용할 때는 super.initState()가 필..

이번 강의에서는 Theme 설정을 주는 방법을 알아본다 매번 위젯에 색상 설정을 하는 게 아니라 아예 앱의 디폴트 값을 설정하는 방법이다. import 'package:flutter/material.dart'; void main() { runApp(App()); } class App extends StatefulWidget { @override State createState() => _AppState(); } class _AppState extends State { @override Widget build(BuildContext context) { return MaterialApp( theme: ThemeData( textTheme: const TextTheme( titleLarge: TextStyle..

다시 한 번 setState() 의 용법에 대해서 설명을 했다. 프로그램이 데이터를 저장하고 보여주기를 희망할 때, 이렇게 사용하라는 것 하지만 setState()가 사실 플러터에서 그렇게 많이 사용되지 않는다는 이야기를 하니............... 무엇이 더 사용되는 걸까 Where can I use setState Flutter? We call setState only when we want the change in a variable to reflect on the UI of the screen. For instance, say you have a form containing a text field and a button to submit it. User types in the text fiel..

한 가지를 잊었는데 모든 것이 적용되게 하기 위해서는 setState funcion을 적용해야 한다. state class에게 데이터가 바뀐다는 것을 알리기 위해서 사용해야 한다. setState our state hey man the data is new so react do something react yourself void onClicked() { setState(() { counter = counter + 1; }); } 즉 setState() 안에 담지 않으면, when you call setState, telling flutter, data is new build method again :0 calling this method once more with the new data. 그리고 함수를..

Stateless는 데이터가 없는 것 Statefull은 반대로 데이터를 갖고 사용할 수 있는 것 State of the widget is where we put the data data/ui를 data가 변하면 ui of the widget changes as well 입력한 숫자를 Text로 받을 때 Text('$counter'), State.. 클릭했을 때 숫자가 올라가는 기능을 만들어본다 import 'package:flutter/material.dart'; void main() { runApp(App()); } class App extends StatefulWidget { @override State createState() => _AppState(); } class _AppState exten..

지난 시간에 SingleChildScrollView로 overflow 에러 없이, 스크롤 가능하게 하는 법을 확인해 봤다. 그리고 결과물을 이렇게 만들었고, 현재는 외운다기 보다는 어떻게 작동하는 지 그 과정을 이해하고 이용할 줄 알면 된다. 챌린지는 생성자 변수에 offSet 정보를 넣으라는 것인데........... 흠.......... 숙제로 생각해봐야 겠다

Transform.scale 몇 배만 큼 그게 할 것인지 그리고 그 안의 child에 들어가는 transform. Translate() 는 x축 y축으로 얼만큼 옮길 것인지를 정한다. 그리고 overflow한 부분을 자르기 위해서 Container 하위에 Clip clipBehavior를 넣음으로서 자른다. clipBehaviour : Clip.hardEdge, 깔끔하게 자르게 한다. reusable한 기능을 사용하기 위해서 crurency_card.dart 파일을 생성하고 import 'package:flutter/material.dart'; class CurrencyCard extends StatelessWidget { @override Widget build(BuildContext context) ..