Flutter: конструктор форм предварительного просмотра, такой как система предварительного просмотра форм Google во флаттере

Question

• 1000 детали также очень похожи на систему предварительного просмотра форм Google. У меня есть настройка конструктора форм, я не знаю, как преобразовать ее в экран предварительного просмотра. Ниже представлены два изображения ... кнопка добавления виджета позволяет пользователю выбрать виджет, а после выбора пользователь возвращается на тот же экран со встроенным виджетом. отсюда вперед экран предварительного просмотра ... Выбор виджета с помощью кнопки [ нажатие на виджет создает виджет

Это построитель формы, который является первым изображением, и когда пользователь нажимает кнопку добавления виджета, пользователь переходит на второй экран

Scaffold(
            appBar: AppBar(
              title: Text('Form Widgets'),
            ),
            body: LayoutBuilder(
              builder:
                  (BuildContext context, BoxConstraints viewPointConstrainsts) {
                return SingleChildScrollView(
                  padding: EdgeInsets.all(12.0),
                  child: ConstrainedBox(
                    constraints: BoxConstraints(
                      minHeight: viewPointConstrainsts.maxHeight,
                    ),
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: <Widget>[
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: <Widget>[
                            FormWidget(
                              key: UniqueKey(),
                              iconData: Icons.title,
                              widgetTxT: 'Short Text',
                              onTap: () {
                                setState(() {
                                  widget.newData.widgets
                                      .add(ShortTextWidget());
                                  widget.pickWidgetsView = false;
                                });
                              },
                            ),  

Я хочу показать предварительный просмотр формы, которая создается пользователь, это то, как я пытаюсь сделать, но дальше, чем это, я не знаю, двигаться вперед

Scaffold(
            appBar: AppBar(
              title: Text('Form Builder'),
              actions: <Widget>[
                IconButton(
                  icon: Icon(Icons.remove_red_eye),
                  onPressed: () => ShowPreviewScreen(data: widget.newData),
                ),  

мой класс предварительного просмотра

class ShowPreviewScreen extends StatelessWidget {
  final FormData data;

  ShowPreviewScreen({this.data});

  @override
  Widget build(BuildContext context) {
    return Text('Hello world');
  }
}  

Это мой класс данных формы, который Я использую для создания списка виджетов.

class FormData extends ChangeNotifier {
  List<Widget> widgets = [];
//  List<FormData> data = [];

  FormData();
} 

Я знаю, что опубликовал много кода, но, пожалуйста, помогите, я знаю, что мне нужно пометить каждый виджет своим уникальным ключом для создания экрана предварительного просмотра. Небольшой вспомогательный код, чтобы двигаться дальше .. заранее спасибо.