ChangeNotifierの実装（メインページ） #16

thoth000 · 2020-07-12T07:34:07Z

issue

#13

やったこと

pagesディレクトリ内でmainディレクトリを作成
mainディレクトリ内にhome talk profileディレクトリを作成しdartファイルを分ける
ページごとにChangeNotifierを設計

ho2ri2s

一気にController作られたんですね:eyes:
こんな感じで、Controllerの作り方自体に修正があった際に少し修正範囲が大きくなってしまうので、ミニマムでPRを出してもらえると楽かもしれません！

ho2ri2s · 2020-07-12T08:06:02Z

lib/ui/pages/main/home/home.dart


 class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
+    final _homeController = Provider.of<HomeController>(context);


build配下に listen: true でProvideすると、HomeControllerに変更があるたびに、このcontext(HomePage)が丸ごと再描画されてしまうので、あんまり良くないかもです！
ここでは

listen: false で定義しておいて、単発呼び出しではこれを使ってあげる

変更を監視したいプロパティの場合はちょっとめんどうくさいけど、 Provider.of<HomeController>(context, listen: true).hoge みたいに逐一取得してあげる感じですかね

前に記事書いてみたので参考にしてみてください！
https://qiita.com/hohohoris/items/8aecf6a99b278d67d13b

retrun ChangeNotifierProvider<HomeController>( create: (_) => HomeController(), child: SingleChildScrollView( // 略 ) とすると `main.dart` でMultiProviderしなくてもpageごとにできると思います！

ho2ri2s · 2020-07-12T08:10:42Z

lib/ui/pages/main/home/home_controller.dart

+class HomeController with ChangeNotifier{
+  HomeController();
+
+  Future<User> getMeById(String userId) async {


基本Controllerのメソッドは戻り値を Future<void> にして、　Controllerのプロパティで Userを持ってあげます。
するとFuture型を処理せずともUserという型でWidgetに通知できるからです。
具体的には、

Suggested change

Future<User> getMeById(String userId) async {

User user;

Future<void> getMeById(String userId) async {

await Future.delayed(Duration(seconds: 1));

user = User(name: "test", imgUrl: "https://dot.asahi.com/S2000/upload/2019100100055_1.jpg");

notifyListeners()

MainページとしてHome,Talk,Profileは一体なのでMultiProviderとして4つのモデルを定義した。

ryu1sazae

恐縮ながら 🙇
間違ってたり、もうこれで決まってるからってとこあったら遠慮なく言ってください!

ryu1sazae · 2020-07-15T01:15:39Z

lib/ui/pages/main/main.dart

  @override
  Widget build(BuildContext context) {
+    final _mainController = Provider.of<MainController>(context);


メソッド内で定義されたものはそもそもメソッド内のスコープでしか使用できないのでprivateにする必要はなさそうですね 👌

ryu1sazae · 2020-07-15T01:17:01Z

lib/ui/pages/main/main.dart

    );
  }

-  Widget bottomNavigation() {
+  Widget bottomNavigation(BuildContext context) {


逆にここは他のファイルから参照されていなければprivateにして良さそうです 👌

ryu1sazae · 2020-07-15T01:17:34Z

lib/ui/pages/main/main.dart

    );
  }

-  Widget bottomNavigation() {
+  Widget bottomNavigation(BuildContext context) {
+    final _mainController = Provider.of<MainController>(context);


上に同じくprivateにする必要はなさそうですね 👌

ryu1sazae · 2020-07-15T01:19:12Z

lib/ui/pages/main/talk/talk.dart

@@ -10,8 +12,9 @@ class TalkPage extends StatefulWidget {
 class _TalkPageState extends State<TalkPage> {
  @override
  Widget build(BuildContext context) {
+    final _talkController = Provider.of<TalkController>(context);


privateにする必要はなさそうですね 👌
他にも同様の場所がありそうなので確認して頂けると 🙇

ryu1sazae · 2020-07-15T01:24:44Z

lib/ui/pages/main/home/home.dart

+                    return Center(
+                      child: Text("該当するユーザーがいません"),
+                    );


Suggested change

return Center(

child: Text("該当するユーザーがいません"),

);

return const Center(

child: Text("該当するユーザーがいません"),

);

のように書けますかね？
constをつけると、コンパイル時に確定できるので、パフォーマンスが上がります
以下参考

Use const widgets where possible. (This is equivalent to caching a widget and re-using it.)

https://medium.com/flutter-jp/state-performance-7a5f67d62edd

ryu1sazae · 2020-07-15T01:29:43Z

lib/ui/pages/main/home/home.dart

@@ -209,3 +75,102 @@ class HomePage extends StatelessWidget {
    );
  }
 }
+
+class MyTile extends StatelessWidget {


少しfileが必要以上に肥大化しいてるように思えるので、個別のWidgetは /Widgets/を作ってその中に入れても良さそうですね 🙆‍♂️
このままなら

Suggested change

class MyTile extends StatelessWidget {

class _MyTile extends StatelessWidget {

とできそうでしょうか？

ryu1sazae · 2020-07-15T01:31:48Z

lib/ui/pages/main/home/home.dart

-    );
-  }
-
+  HomePage({Key key}) : super(key:key);


これってないとコンパイルできませんっけ？ 🤔

ryu1sazae · 2020-07-15T01:33:27Z

lib/ui/pages/main/home/home.dart

@@ -7,7 +7,7 @@ import 'package:chat_flutter/config/app_text_size.dart';
 import 'package:provider/provider.dart';

 class HomePage extends StatelessWidget {
-  HomePage({Key key}) : super(key:key);
+  HomePage({Key key}) : super(key: key);


別の箇所で言及しましたが、ここがなくても良いって箇所が他にもありそうですね 🙇

ryu1sazae · 2020-07-15T01:34:59Z

lib/ui/pages/main/home/home_controller.dart

+    user = User(
+        name: "test",
+        imgUrl: "https://dot.asahi.com/S2000/upload/2019100100055_1.jpg");


Suggested change

user = User(

name: "test",

imgUrl: "https://dot.asahi.com/S2000/upload/2019100100055_1.jpg");

user = User(

name: "test",

imgUrl: "https://dot.asahi.com/S2000/upload/2019100100055_1.jpg",

);

の方が自然ですかね？

ryu1sazae · 2020-07-15T01:37:19Z

lib/ui/pages/main/main.dart

+        currentIndex: _controller.currentIndex,
+        items: [
+          BottomNavigationBarItem(
+            icon: Icon(


別箇所でも言及しましたが、const付けれそうですね 👌
https://github.com/flutter/flutter/blob/master/analysis_options.yaml
ここら辺の導入に関してもうまく決めれると良さそうですね 🙆‍♂️

ryu1sazae · 2020-07-15T01:40:28Z

コメントして気づきましたが、squashしてあげると別のコミットでの変更の上書きが無くなって良さそうですね 🙆‍♂️
参考

ryu1sazae

squashに関して
きっと @ho2ri2s あたりが詳しいと思うのでmtgのときに聞いてみてください 👍

constの付け忘れや、statelessWidgetの別ファイルへの切り出しなど、まだ改善の余地はありそうですがそこはまた後で決めるって感じでもいいかもですね(本当はお勧めしませんが) 🙆‍♂️

お疲れ様です 👍

ryu1sazae · 2020-07-15T12:18:38Z

#18 がマスターにマージされたら
git merge --no-ff
でマージした後修正加えてpushお願いします！ 🙇

ryu1sazae · 2020-07-15T12:33:26Z

lib/ui/molecules/home/friend_tile_list.dart

+              ),
+              ListView.builder(
+                physics: ScrollPhysics(),
+                scrollDirection: Axis.vertical,


https://api.flutter.dev/flutter/widgets/ListView/ListView.builder.html
今更で申し訳ないんですけどここは defaultがAxis.verticalなのでいらなさそうですね 🆗

Suggested change

scrollDirection: Axis.vertical,

ryu1sazae · 2020-07-15T12:34:18Z

lib/ui/molecules/home/group_tile_list.dart

+            ),
+            ListView.builder(
+              physics: ScrollPhysics(),
+              scrollDirection: Axis.vertical,


https://github.com/ProgrammableGroup/chat-flutter/pull/16/files#r455015776
に同じくです

ho2ri2s

お疲れ様でした👏

ryu1sazae

色々とありがとうございました 🙇

thoth000 added 9 commits July 12, 2020 14:57

ページごとにディレクトリを作成

b4aaa0c

ChangeNotifierクラスを定義

387cca8

mainController

f72e08d

talkController

9044e30

profileController

ebdf747

ProfileEditPageのProviderを変更

3cafa59

もろもろ修正

0cf5f17

homeController

abcd197

Providerをdi.dartでセット（仮）

9179ad5

ho2ri2s reviewed Jul 12, 2020

View reviewed changes

thoth000 added 7 commits July 12, 2020 17:36

Futureの戻り値をvoidに変更

02f1e31

HomePage修正

e41481e

MainController

1ef3712

メインページのコントローラ完成

4959e8f

MultiProviderをmainで作成

52cdb0c

MainページとしてHome,Talk,Profileは一体なのでMultiProviderとして4つのモデルを定義した。

flutter format .

53080e9

使わないdi.dartを削除

61ce4a2

ryu1sazae reviewed Jul 15, 2020

View reviewed changes

指摘部分の修正

7c87aa9

ryu1sazae approved these changes Jul 15, 2020

View reviewed changes

thoth000 added 2 commits July 15, 2020 21:11

別ファイルへの切り出し

1e9cb92

flutter format .

6b8e569

ryu1sazae reviewed Jul 15, 2020

View reviewed changes

Merge branch 'master' into feature/13/main

ab57921

ho2ri2s approved these changes Jul 15, 2020

View reviewed changes

不要なaxis.verticalの除去

0002225

ryu1sazae approved these changes Jul 15, 2020

View reviewed changes

thoth000 merged commit 4a73d39 into master Jul 15, 2020

thoth000 mentioned this pull request Jul 22, 2020

ChangeNotifierの実装(トークルームページ) #22

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

ChangeNotifierの実装（メインページ） #16

ChangeNotifierの実装（メインページ） #16

thoth000 commented Jul 12, 2020

ho2ri2s left a comment

ho2ri2s Jul 12, 2020

ho2ri2s Jul 12, 2020

ryu1sazae left a comment

ryu1sazae Jul 15, 2020

ryu1sazae Jul 15, 2020

ryu1sazae Jul 15, 2020

ryu1sazae Jul 15, 2020

ryu1sazae Jul 15, 2020

ryu1sazae Jul 15, 2020

ryu1sazae Jul 15, 2020

ryu1sazae Jul 15, 2020

ryu1sazae Jul 15, 2020

ryu1sazae Jul 15, 2020

ryu1sazae commented Jul 15, 2020

ryu1sazae left a comment

ryu1sazae commented Jul 15, 2020

ryu1sazae Jul 15, 2020

ryu1sazae Jul 15, 2020

ho2ri2s left a comment

ryu1sazae left a comment

-  Future<User> getMeById(String userId) async {
+  User user;
+  Future<void> getMeById(String userId) async {
+         await Future.delayed(Duration(seconds: 1));
+         user = User(name: "test", imgUrl: "https://dot.asahi.com/S2000/upload/2019100100055_1.jpg");
+         notifyListeners()

	class MyTile extends StatelessWidget {
	class _MyTile extends StatelessWidget {

ChangeNotifierの実装（メインページ） #16

ChangeNotifierの実装（メインページ） #16

Conversation

thoth000 commented Jul 12, 2020

issue

やったこと

ho2ri2s left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ryu1sazae left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ryu1sazae commented Jul 15, 2020

ryu1sazae left a comment

Choose a reason for hiding this comment

ryu1sazae commented Jul 15, 2020

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ho2ri2s left a comment

Choose a reason for hiding this comment

ryu1sazae left a comment

Choose a reason for hiding this comment