Refactoring in Flutter?

Sample UI
  1. Extract method.
  2. Extract class.
  3. Extract variable.

Refactoring with Extract Method

  1. Open any file you have on your project.
  2. Click on the first widget you would like to extract, then right click on it. In the case above, it would be the Container method of every child of the Column widget of the build method.
  3. Select Refactor > Extract method.
  4. In the Extract method dialog, you can name your method to whatever you want. But in this case, the first one would be _buildCreateReport() .
  5. The Container widget in the build method is then replaced by the _buildCreateReport() method call. And if you scroll down, you should see the _buildCreateReport() method which returns the Container widget.

Refactoring with Extract Class

CustomCard
  1. Open any file on your project.
  2. Place the cursor on the widget you would like to extract then right click on it.
  3. Select Refactor > Extract Widget
  4. In the dialog, choose a name for your class. In this case, it is CustomCard .
  5. You should be able to see the class if you scroll down.

Refactoring with Extract Variable

  1. Open any file in your project.
  2. Place the cursor in widget you would like to extract then right click on it.
  3. Select Refactor > Extract Local Variable
  4. In the dialog, pick a describable name for the variable. In the case above, it will be myTabBarView and tabBar .
  5. You should be then able to see the local variable if you scroll up.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store