Добавление виджета Dynami c с помощью кнопки - PullRequest
Новая
       145

Добавление виджета Dynami c с помощью кнопки

2 голосов
/ 05 августа 2020

Я сталкиваюсь со странной ошибкой, когда пытаюсь добавить виджет Dynami c в свое приложение. При нажатии кнопки добавления экран становится полностью белым, я не могу понять, почему это происходит. Я использую https://www.youtube.com/watch?v=xPW1vtDDlt4 в качестве ресурса. Я действительно новичок во Flutter, возможно, я забыл что-то добавить, но проверяю много раз. Вот мой код: 

class DynamicWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: new TextField(
        decoration: new InputDecoration(hintText: 'Press + to Add Field'),
      ),
    );
  }
}

Инициализация списка. 

  List<DynamicWidget> listDynamic = [];

Моя функция для добавления виджетов в список. 

  addDynamic() {
    listDynamic.add(new DynamicWidget());
    print("addDynamic");
    setState(() {});
  }

Я не уверен но проблема может быть здесь, 

final testText = Visibility(
  child: new Column(
    children: <Widget>[
      new Flexible(
        child: new ListView.builder(
          itemCount: listDynamic.length,
          itemBuilder: (_, index) => listDynamic[index],
        ),
      ),
    ],
  ),
);

Здесь я вызываю свой виджет, который объявляю здесь переменной. 

final body = Container(
      child: SingleChildScrollView(
        child: Column(
          children: <Widget>[
            testText,
            strPhoto
          ],
        ),
      ),
    );

И, наконец, моя кнопка. 

    return Scaffold(
        appBar: new AppBar(title: new Text(device_type), centerTitle: true),
        drawer: Menu(),
        body: body,
        floatingActionButton: Column(
          crossAxisAlignment: CrossAxisAlignment.end,
          mainAxisAlignment: MainAxisAlignment.end,
          children: <Widget>[
            FloatingActionButton(
              heroTag: null,
              child: Icon(
                Icons.add,
                color: Colors.white,
              ),
              onPressed: () {
                addDynamic();
              },
            ),
          ],
        ));

Спасибо за помощь.

Ответы [ 2 ]

0 голосов
/ 05 августа 2020

На первом этапе я создал виджет под названием CustomTextField 

import 'package:flutter/material.dart';

class CustomTextField extends StatelessWidget {
final String hint;
final TextEditingController controllers;

CustomTextField(this.hint, this.controllers);

    @override
    Widget build(BuildContext context) {
    return Padding(
        padding: EdgeInsets.only(top: 2.0, left: 6.0, right: 6.0, bottom: 2.0),
        child: Column(
          children: <Widget>[
            TextField(
                decoration: InputDecoration(hintText: hint),
                controller: controllers),
            SizedBox(height: 4.0),
          ],
        ),
      );
    }
}

этот виджет дал мне один текст для отображения в подсказке и один контроллер для текстового поля управления

И на следующем шаге , Я изменяю класс домашней страницы таким образом, у меня есть список Custom TextField (мой виджет) и отображается в списке с использованием списка сопоставлений метода сборки 

import 'package:flutter/material.dart';
import 'CustomTextField.dart';

class PageTutorial extends StatefulWidget {
  @override
  _PageTutorialState createState() => _PageTutorialState();
}

class _PageTutorialState extends State<PageTutorial> {
  List<CustomTextField> widgets = [
    CustomTextField("UserName", TextEditingController())
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ListView(
        children: widgets.map<Widget>((widget) => widget).toList(),
      ),
      floatingActionButton: FloatingActionButton(
          onPressed: () {
            setState(() {
              widgets.add(CustomTextField("Password", TextEditingController()));
            });
          },
          child: Icon(Icons.add)),
    );
  }
}

получайте удовольствие

0 голосов
/ 05 августа 2020

вы должны создать переменную Widget и добавить в контекст сборки на Scaffold

...