Всплывающее окно - не отображается цвет фона для выбранного элемента (будущий вид списка) - PullRequest
0 голосов
/ 22 марта 2020

Я собираюсь объяснить, как я могу лучше всего, что я пытаюсь сделать, пожалуйста, дайте мне знать, если что-то не понятно. -В первую очередь, выберите элементы из списка во всплывающем окне и измените цвет фона на x. Во-вторых, поместить эти элементы в другой список и добавить его в другой виджет для отображения на экране (с теми элементами, которые я ранее выбирал), но не во всплывающем окне. (это не реализовано)

Так что главная причина , почему это не работает, заключается в том, что когда я выбираю некоторые элементы из всплывающего окна, цвет не меняется, только когда я открываю всплывающее окно, выберите элементы, закройте всплывающее окно, снова откройте (нажмите на него), закройте, а затем, когда я открою его снова, выберите его, когда фон изменился.

Я думаю, что это, вероятно, что-то относительно состояния или навигатора. .pu sh на PopupContent, но я пытаюсь все без каких-либо результатов ..

Структура выглядит следующим образом:

Сначала CustomPopup: (я думаю здесь это не проблема)

class CustomPopup extends ModalRoute{

  double top;
  double bottom;
  double left;
  double right;
  Color bgColor;
  final Widget child;

  CustomPopup(
      {Key key,
        this.bgColor,
        @required this.child,
        this.top,
        this.bottom,
        this.left,
        this.right});

  @override
  // TODO: implement barrierColor
  Color get barrierColor => bgColor == null ? Colors.black.withOpacity(0.5) : bgColor;

  @override
  // TODO: implement barrierDismissible
  bool get barrierDismissible => false;

  @override
  // TODO: implement barrierLabel
  String get barrierLabel => null;

  @override
  // TODO: implement maintainState
  bool get maintainState => false;

  @override
  // TODO: implement opaque
  bool get opaque => false;

  @override
  // TODO: implement transitionDuration
  Duration get transitionDuration => Duration(milliseconds: 300);

  @override
  Widget buildPage(
      BuildContext context,
      Animation<double> animation,
      Animation<double> secondaryAnimation,
      ) {
    if (top == null) this.top = 10;
    if (bottom == null) this.bottom = 20;
    if (left == null) this.left = 20;
    if (right == null) this.right = 20;

    return GestureDetector(
      onTap: () {
        // call this method here to hide soft keyboard
        SystemChannels.textInput.invokeMethod('TextInput.hide');
        print("Custompopup tocado");
      },
      child: Material( // This makes sure that text and other content follows the material style
        type: MaterialType.transparency,
        //type: MaterialType.canvas,
        // make sure that the overlay content is not cut off
        child: SafeArea(
          bottom: true,
          child: _buildOverlayContent(context),
        ),
      ),
    );
  }
  //the dynamic content pass by parameter
  Widget _buildOverlayContent(BuildContext context) {
    return Container(
      margin: EdgeInsets.only(
          bottom: this.bottom,
          left: this.left,
          right: this.right,
          top: this.top),
      child: child,
    );
  }
  @override
  Widget buildTransitions(BuildContext context, Animation<double> animation,
      Animation<double> secondaryAnimation, Widget child) {
    // You can add your own animations for the overlay content
    return FadeTransition(
      opacity: animation,
      child: ScaleTransition(
        scale: animation,
        child: child,
      ),
    );
  }
}

Это всплывающее содержимое, которое я назову из класса экрана, возможно, проблема здесь или в классе экрана, я не уверен.

class PopupContent extends StatefulWidget {

  final Widget content;

  const PopupContent({Key key,this.content}) : super(key: key);

  @override
  _PopupContentState createState() => _PopupContentState();

  showPopup(BuildContext context, Widget widget, String title,
      {BuildContext popupContext}) {
    Navigator.push(
      context,
      CustomPopup(
        top: 30,
        left: 30,
        right: 30,
        bottom: 50,
        child: PopupContent(
          content: Scaffold(
            appBar: AppBar(
              title: Text(title),
              leading: new Builder(builder: (context) {
                return IconButton(
                  icon: Icon(Icons.arrow_back),
                  onPressed: () {
                    try {
                      Navigator.pop(context); //close the popup
                    } catch (e) {e.toString();}
                  },
                );
              }),
              actions: <Widget>[
                new IconButton(
                  icon: new Icon(Icons.save,color: Colors.black),
                  onPressed: () => null,
                ),
              ],
              brightness: Brightness.light,
            ),
            resizeToAvoidBottomInset: false,
            body: widget,
        ),
      ),
      ),
    );
  }
}

class _PopupContentState extends State<PopupContent> {

  @override
  void initState() {
    // TODO: implement initState
    super.initState();

  }
  @override
  Widget build(BuildContext context) {
    return Container(
      child: widget.content,
    );
  }
}

Это класс экрана, где я хочу отобразить PopupContent.

class Screen extends StatefulWidget {

  Screen({Key key});

  @override
  State<StatefulWidget> createState() => ScreenState();
}

class ScreenState extends State<ScreenScreen> {

  Future<List<Data>> listItems ;
  var refreshIndicatorKey =  GlobalKey<ScreenState>();

  void initState(){
    super.initState();
    listItems = Client().list();
    refreshList();
  }


  Widget button(BuildContext context){
    return Material(
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          RaisedButton(
            onPressed: (){
              setState(() {
                PopupContent().showPopup(context, listwidget(), "List Items");
              });
            },
          ),
        ],
      ),
    );
  }

  Future<Null> refreshList() async{
    await Future.delayed(Duration(seconds: 2));
    if(!mounted){
      return;
    }
    else{
      setState(() {
        listItems = Client().list();
      });
    }
    return null;
  }

  Widget listwidget(){
    return FutureBuilder<List<Data>>(
        future: listItems,
        builder: (context, snapshot){
          if(snapshot.hasData){
            return RefreshIndicator(
              onRefresh: refreshList,
              key: refreshIndicatorKey,
              child: ListView.builder(
                itemCount: snapshot.data?.length,
                itemBuilder: (BuildContext context, int index) {
                  final item = snapshot.data;
                  return Material(
                    color: item[index].isSelected ? Colors.grey[300]: Colors.white,
                    child: ListTile(
                      onTap: (){
                        setState(() {
                          item[index].isSelected = !item[index].isSelected;
                          if(item[index].isSelected){
                            List data = [];
                            data.add(item[index].name);
                            data.add(item[index].boxArtUrl.replaceAll("{width}x{height}.jpg", "1000x1000.jpg"));
                            print(data);

                          }
                          print(item[index].boxArtUrl);
                        });
                      },
                      selected: item[index].isSelected,
                      title: Text(item[index].name),
                      leading: CircleAvatar(
                        radius: 25.0,
                        backgroundImage: NetworkImage(item[index].boxArtUrl.replaceAll("{width}x{height}.jpg", "1000x1000.jpg")),
                        backgroundColor: Colors.transparent,
                      ),
                    ),
                  );
                },
              ),
            );
          }
          else{
            return Text("${snapshot.error}");
          }
        }
    );
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: button(context),
    );
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...