根据颤动中按下的按钮显示卡片

Question

我正在尝试实现一项功能，以便在我按下按钮时它会显示一张包含一些信息的卡片。我有 2 个按钮，根据我按下的按钮，它应该显示一张或另一张卡片。

我稍微简化了代码，不包括一些与此问题无关的参数。

class DogCardDetails extends StatelessWidget {

  bool _visibleBehavior = true;
  bool _visiblePhysical = true;

  DogCardDetails({
    Key? key,

  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Padding(
        child: Column(
          children: <Widget>[
            Container(
              margin: EdgeInsets.only(
                right: 20,
                left: 20,
              ),
              child: Row(
                children: [
                                    ElevatedButton(
                  onPressed: () {
                    _visibleBehavior = false;
                  },
                  child: Text('Physical info'),
                  style: ButtonStyle(
                      shape:
                          MaterialStateProperty.all<RoundedRectangleBorder>(
                              RoundedRectangleBorder(
                                  borderRadius:
                                      BorderRadius.circular(160.0),
                                  side: BorderSide(color: Colors.white))))),
              ElevatedButton(
                  onPressed: () {
                    _visibleBehavior = true;
                  },
                  child: Text('Behavior info'),
                  style: ButtonStyle(
                      shape:
                          MaterialStateProperty.all<RoundedRectangleBorder>(
                              RoundedRectangleBorder(
                                  borderRadius:
                                      BorderRadius.circular(160.0),
                                  side: BorderSide(color: Colors.white))))),,
                  
                      
            _visibleBehavior == true
                ? BehaviorCard()
                : PhysicalCardInfoDog()
          ],
        ),
      ),
    );
  }
}

Answer 1

您需要用 setState 包装您的函数才能重绘 ui，像这样

onPressed: () {
    setState(() {
     _visibleBehavior = true;
})
}

还要使用 setState 方法，您必须将 DogCardDetails StatelessWidget 重构为 StatefullWidget

根据颤动中按下的按钮显示卡片

Showing card depending on button pressed in flutter

flutter