颤振状态不会更新

Posted 2023-02-23

【中文标题】颤振状态不会更新

【英文标题】：Flutter State won't update

【发布时间】：2021-05-23 05:31:46

【问题描述】：

我正在尝试创建卡片列表视图，其图像仅在选择卡片时才会显示在列表视图中。选择小部件是 PopupSubscription()，我通过将特定图像的 bool 设置为 true 来选择要显示的卡片 (SubscriptionCard)。但是当应用选择时，即使在执行 setState() 之后，所选图像也不会立即出现。 但是，当我切换选项卡并再次返回屏幕时，它们确实会出现。我应该怎么做才能更改不在我当前状态类中的对象的状态？我尝试使用 Provider，但它让我对我应该做什么感到困惑。

这是在点击它时设置布尔值的 SubscriptionCard：

return InkWell(
  radius: 1.0,
  borderRadius: BorderRadius.circular(8.0),
  highlightColor: buttonBackground,
  onTap: () 
    setState(() 
      widget.currentSubscription.selected = !widget.currentSubscription.selected;
    );
  ,
  child: Card(
    elevation: 1.0,
    borderOnForeground: true,
    shape: widget.currentSubscription.selected ? RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(3.0),
      side: BorderSide(color: buttonBackground, width: 2.0),
    ) : ContinuousRectangleBorder(),
    color: bgDarkColor,
    child: SizedBox(
      width: SizeConfig.blockSizeHorizontal * 30,
      child: Stack(
        alignment: Alignment.topRight,
        children: [
          Row(
            mainAxisSize: MainAxisSize.max,
            children: [
              Image.asset(this.widget.currentSubscription.logo, height: 35.0,),
              Text(
                '  $this.widget.currentSubscription.name',
                style: TextStyle(fontFamily: 'Muli', fontSize: 16.0)
              ),
            ],
          ),
          widget.currentSubscription.selected ? Container(
            decoration: BoxDecoration(
              shape: BoxShape.circle,
              color: buttonBackground,
            ),
            child: Padding(
              padding: const EdgeInsets.all(2.0),
              child: Icon(
                Icons.check,
                size: 10.0,
                color: Colors.white,
              ),
            ),
          ) : Container()
        ],
      ),
    ),
  ),
);

这是呈现所选卡片图像的 ListView：

Container(
      height: 50,
      width: 350,
      child: ListView(
        scrollDirection: Axis.horizontal,
        children: [
          IconButton(
            onPressed: () 
              showDialog(
                context: context,
                builder: (BuildContext context) 
                  return PopupSubscription();
                
              );
            ,
            icon: Icon(Icons.add_box_rounded, size: 30.0,),
          ),
          StatefulBuilder(
            builder: (context, setState) 
              return ListView.builder(
                scrollDirection: Axis.horizontal,
                shrinkWrap: true,
                itemCount: subscriptionsList.length,
                itemBuilder: (context, index) 
                  return Container(
                    margin: EdgeInsets.symmetric(horizontal: 5.0),
                    child: ClipRRect(
                      borderRadius: BorderRadius.circular(25.0),
                      child: Image.asset(
                        subscriptionsList[index].selected ? subscriptionsList[index].logo
                        : "assets/elements/streaming-services/netflix.jpeg",
                      ),
                    ),
                  );
                ,
              );
            
          ),
        ],
      )
    ),

【参考方案1】：

根据您当前的代码，我猜您已在实际State 上方的StatefulWidget 中将currentSubscription 变量添加为final，例如：

class MyClass extends StatefulWidget
    final currentSubscription;
    // Rest of the code

class _MyClassState extends State<MyClass> 
    // Your ListView Code and other stuff.

当您想要更改 onTap 状态时，这将不起作用，我建议您在 _MyClassState 类中创建您在 setState 中使用的变量并在其中使用 setState。比如：

class _MyClassState extends State<MyClass> 
    bool _isSelected = false; 

    // And in your onTap method, something like:
    setState(() 
      _isSelected = !_isSelected;
    );