Flutter StatefulWidget 带参数

Posted

技术标签:

【中文标题】Flutter StatefulWidget 带参数【英文标题】:Flutter StatefulWidget with parameters 【发布时间】:2020-04-11 18:55:56 【问题描述】:

我是Flutter 的新手。我有一个StatefulWidget 和一个default parameter,我已经完成了我的研究,许多人已经用vivid 的例子回答了这个问题,例如izwebtechnologies 和*** 我仍然无法让我的代码工作。它给了我错误

Invalid argument(s)
The relevant error-causing widget was: 
Gallery file:///xxx/xxx/xxx/xxx/lib/main.dart:241:13

我的第 214 行看起来像

  var images = new List<String>();
  .
  .
  .
  class NewGallery extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    final _scafoldkey = GlobalKey<ScaffoldState>();
    return Scaffold(
      key: _scafoldkey,
      backgroundColor: Colors.transparent,
     //Where the exception is occurring from main.dart:241:13
      body: Gallery(images),
    );
  

我的画廊课

 class Gallery extends StatefulWidget 

  final List<String> images;
  const Gallery(this.images);

  @override
  State createState() => new _GalleryState();
 

我的画廊状态类

class _GalleryState extends State<Gallery> 
      int currentImageIndex;

      @override
      Widget build(BuildContext context) 
        return new Scaffold(
          backgroundColor: Colors.black,
          body: new Dismissible(
            //resizeDuration: null,
            onDismissed: (DismissDirection direction) 
              setState(() 
                currentImageIndex +=
                    direction == DismissDirection.endToStart ? 1 : -1;
                if (currentImageIndex < 0) 
                  currentImageIndex = widget.images.length - 1;
                 else if (currentImageIndex >= widget.images.length) 
                  currentImageIndex = 0;
                
              );
            ,
            key: new ValueKey(currentImageIndex),
            child: SizedBox.expand(
                child: Container(
                    color: Colors.black,
                    margin: const EdgeInsets.only(left: 0, top: 40),
                    child: FadeInImage.assetNetwork(
                        fit: BoxFit.fitWidth,
                        placeholder: "assets/images/placeholder.png",
                        image: widget.images.elementAt(currentImageIndex)))),
          ),
        );
      
    

请注意,我是 Flutter 的新手,很多东西还是不明白,因此我的代码可能没有优化。

【问题讨论】:

有什么问题? 我的问题是如何修复错误 Invalid argument(s) 相关的导致错误的小部件是:Gallery file:///xxx/xxx/xxx/xxx/lib/main.dart: 241:13 【参考方案1】:

您可以在下面复制粘贴运行完整代码 您需要使用 ListView 的错误设计,在这种情况下 currentImageIndex 将不起作用

工作演示

完整代码

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

//var images = new List<String>();
List<String> images = [
  "https://picsum.photos/250?image=9",
  "https://picsum.photos/250?image=9"
];

class NewGallery extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    final _scafoldkey = GlobalKey<ScaffoldState>();
    return Scaffold(
      key: _scafoldkey,
      backgroundColor: Colors.transparent,
      //Where the exception is occurring from main.dart:241:13
      body: Gallery(images),
    );
  


class Gallery extends StatefulWidget 
  final List<String> images;
  Gallery(this.images);

  @override
  State createState() => new _GalleryState();


class _GalleryState extends State<Gallery> 
  int currentImageIndex;

  @override
  Widget build(BuildContext context) 
    return new Scaffold(
      backgroundColor: Colors.black,
      body: ListView.builder(
        itemCount: images.length,
        itemBuilder: (BuildContext context, int index) 
          return Dismissible(
            onDismissed: (DismissDirection direction) 
              setState(() 
                images.removeAt(index);
              );
            ,
            secondaryBackground: Container(
              child: Center(
                child: Text(
                  'Delete',
                  style: TextStyle(color: Colors.white),
                ),
              ),
              color: Colors.red,
            ),
            background: Container(),
            child: Container(
                color: Colors.black,
                margin: const EdgeInsets.only(left: 0, top: 40),
                child: FadeInImage.assetNetwork(
                    fit: BoxFit.fitWidth,
                    placeholder: "assets/images/placeholder.png",
                    image: widget.images[index])),
            key: UniqueKey(),
            direction: DismissDirection.endToStart,
          );
        ,
      ),
    );
  


class MyApp extends StatelessWidget 
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) 
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: NewGallery(),
    );
  

【讨论】:

【参考方案2】:

尝试删除 Gallery 构造函数有状态小部件中的 const。

class Gallery extends StatefulWidget 

  final List<String> images;
  Gallery(this.images);

  @override
  State createState() => new _GalleryState();

【讨论】:

需要一个 const 构造函数,这个 Flutter 只重建应该更新的小部件。

以上是关于Flutter StatefulWidget 带参数的主要内容,如果未能解决你的问题,请参考以下文章

Flutter:将传递的参数更改为“StatefulWidget”

Flutter 中的 statefulWidget 中的屏幕未更新

了解 Flutter 中 StatefulWidget 的使用

Flutter:如何将变量从 StatelessWidget 传递到 StatefulWidget

Flutter控件——常用控件:StatefulWidget与State

[Flutter Widget] StatefulWidget