FlutterのWigdgtをクラスとして切り出す

UdemyにあるFlutterの動画をみて学習している際に、書いていたContainer内のwidgetでクラスとして切り分ける便利なやり方が紹介されていたのでメモ書きです。以下の内容はVisual studio でのやり方です。

以下の画像では、ListVIewというWidgetがあり、こちらには後ほど処理を書き加えていくので、ListView自体をクラスとして切り分けたい状態にあります。

切り分けたい場合は、一度クラスを作って呼び出す方法をとるのですが、そのクラスの作成と呼び出しの処理を自動的に生成する方法を紹介していました!

やり方としては以下の手順です。

  1. Flutter Outlineを開く
  2. ListViewを右クリック
  3. Extract Widgetを選択
  4. Widget nameを記入しRefactor

この手順を通すと以下のようにWidgetのクラスが自動的に生成されました。