Tuesday, January 31, 2023

Easy way to showcasing Flutter components with side-by-side source code view

An app showcasing Flutter components, with side-by-side source code view.

 New: Flutter Catalog is now available in the browser! Check it out here. And note there are some limitations to the web variant.


How to contribute by adding a new example page

  1. Create a dart file under lib/route/ (or just duplicate a file, e.g. cp widgets_icon_ex.dart new_example.dart);
  2. In the new file, create a class that extends MyRoute;
  3. Add constructor, the convention is to use the file path as constructor’s default parameter;
  4. (Optional) override getters: titledescriptionlinks;
  5. Override buildMyRouteContent(), try to make the code simple, as it’ll be shown on phone screens;
  6. Open lib/my_app_meta.dart, import the new file at the beginning of file;
  7. In kMyAppRoutesStructure, add an instantiation of the new class under the appropriate item group.