목록개발/flutter (131)
파파비의 블로그
스넥바를 보여주는 방법은, 그 화면의 scaffold 에 접근해서 띄우게 하면 된다. Scaffold.of(context)를 하면 해당 위젯에서 제일 가까운 Scaffold로 연결된다. 즉, 자신이 존재하는 화면의 Scaffold에게 접근하는 것이다. Scaffold.of(context).showSnackBar를 실행하고 인수로는 SnackBar위젯을 넣는다. SnackBar위젯은 content인수를 필수로 가지며 Text위젯을 받는다. 장바구니 버튼을 누르면 이렇게 SnackBar가 뜨도록 해두었다. 하단에 잘 뜨는 것을 확인하였다. SnackBar에 duration 속성에 Duration위젯을 설정해두면 뜨는 시간을 조정할 수 있다. SnackBar에 action 속성에 SnackBarAction을 ..
이렇게 스와이프 기능을 넣을 수 있다. 저기서 손을 떼면 저 UI는 위로 올라가면서 사라진다. 기능을 넣는 방법은 매우 쉽다. 저 card 위젯 위로 Dismissiable 위젯을 넣는다. 추가적으로 Key를 꼭 넣어야하며, (valuekey로 하니까 에러 생겨서 위젯을 uniqueKey로 바꿈) 백그라운드로는 color가 아니라, Container를 넣었다는 것이 포인트이다. 컨테이너에 색 밖에 안넣었지만, 거기에 Icon을 넣거나 하면 더 엣지있는 스와이프를 만들 수 있다. 그리고 실제로 저것은 UI만 지워지는 것일뿐, data적으로는 어떠한 변화도 없다. 따라서 OnDismissed를 통해서 해결해주어야 한다. 여기를 보면 여러가지 기능들을 추가했다. Ondismiss로 해당 아이템을 지우도록 da..
https://www.youtube.com/watch?v=T4Uehk3_wlY CircleAvatar에서 Text의 사이즈가 커서 안예쁘가 나왔지만 FittedBox를 통해 이쁘게 꾸겨넣기를 성공했다.
1) Chip 여기서 보라색 위젯을 chip 위젯이라고 한다. 기본적으로 label이 안의 내용물을 의미하며, 꾸미는 방법은 더 다양하게 많다. 2) Spacer() https://www.youtube.com/watch?v=7FJgd7QN1zI 이 동영상이 최고인듯 하다. Expand와 비슷한 기능을 하는 박스인데, 그냥 있는 공간을 다 차지 한다. Spacer 여러개 두고 flex를 통해 좀 더 customized 된 공간처리를 할 수 있다. columns나 row에서 유용하게 쓸 수 있다. 보이는 바와 같이 그냥 Spacer(), 이렇게 넣어도 되고, 여러개면 속성으로 flex를 통해 조절도 가능하다. 3) Badge https://pub.dev/packages/badges badges | Flutt..
Provider를 같은 위젯에 여러개 공유시킬 땐 어떻게 할까? ChangeNotifierProvider의 child로 또 ChangeNotifierProvider를 넣고, 그 child로 또 다른 ChangeNotifierProvider를 넣으면서 공유하는 형태도 가능은 하다만, 지저분 해질 것이 분명하다. 이를 위한 방법은 MultiProvider를 이용하는 것이다. MultiProvider의 providers: 속성에 리스트로, [ ] provider들을 원하는 만큼 넣으면 끝난다. 이런식으로 말이다.
of.context와 Consumer는 성능상으로 완전히 똑같다. 다만 Consumer는 사용하기에 따라 of.context보다 더 퍼포먼스를 높일 수도 있다. of.context를 사용하고, notifyLisiteners() 가 실행되면 of.context를 사용하는 위젯 전체가 rebuild된다. Consumer는 해당 위젯에서 일부부만 rebuild되도록 설정할 수 있는 것이다. 만약에 큰 위젯이 존재하면, 따로 쪼개서 of.context를 사용하던가 or Consumer를 사용해서 해당 부분만 rebuild되게 하면 되는 것이다. 아니면 해당 위젯 전체는 한번만 읽어들인 뒤, 나머지 일부분만 rebuild 되게 하려면 of.context로 한 뒤에 listen: false 로 구독은 취소해두고, ..
Provider 객체를 공유할 때, 우리는 ChangeNotifierProvider( create + child) 해서 한다. 특히 create 부분에서는 (context) => 객체 이런식으로 꼭 context를 인수로 넣어야 하는데 만약 객체가 context를 필요로 하지 않는다면? 그러면 (context) 대신 (_)로 표기해도 되지만, 다른 방법이 있기도 하다. 바로 ChangeNotifierProvider.value 를 사용하는 것. 여기를 value는 멀티생성자를 활용한 것인데, value: 속성에 그냥 공유하고 싶은 값을 넣으면 된다. ChangeNotifierProvider 와 ChangeNotifierProvider.value는 쓰임새가 다르다. ChangeNotifierProvider의..