Видимость не будет переключаться в трепетании? - PullRequest
0 голосов
/ 07 февраля 2020

У меня есть gridView, где у каждой сетки есть FlatButton. Кнопка должна активировать видимость для другой кнопки, которая у меня есть за пределами GridView. Я установил состояние в onPressed для изменения bool showCard при каждом нажатии кнопки GridView. В моем заявлении о печати говорится, что он работает, выдает true и false при каждом нажатии кнопки, но не меняет видимость другой кнопки под названием «CheckoutCard ()». Кто-нибудь может мне помочь?

import 'package:flutter/material.dart';
import 'package:flutter/painting.dart';
import 'package:bee/Cards/Items%20Card.dart';
import 'package:bee/Constants/Constants.dart';
import 'package:bee/MerchantCategories/My Categories.dart';
import 'package:bee/MenuButtons/Color Changer.dart';
import 'package:bee/Cards/Checkout Card.dart';
import 'package:bee/main.dart';
import 'Basket Menu.dart';

class MyMenu extends StatefulWidget {

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

}

class _MyMenuState extends State<MyMenu> {

//  bool showCard = _MyButtonState().showCard;

  @override
  Widget build(BuildContext context) {


    return Scaffold(

      appBar: AppBar(

        brightness: Brightness.light,

        leading: new IconButton(
          icon: new Icon(Icons.arrow_back, color: Colors.black),
          onPressed: () { Navigator.of(context).pop();},
        ),

        backgroundColor: Colors.white,
        title: Padding(
          padding: const EdgeInsets.all(6.0),
          child: Image(image: AssetImage('images/Merchants/My_Image.png'),),
        ),
        elevation: 1.0,
        centerTitle: true,

        actions: <Widget>[
          Padding(
            padding: const EdgeInsets.only(right: 15.0),
            child: IconButton(icon: Icon(Icons.shopping_basket, color: Colors.blue[800],),
            onPressed: (){ Navigator.push(context, MaterialPageRoute(builder: (context){return BasketMenu();})); }
            ),
          ),

        ],
      ),





      body: Stack(
          children: <Widget>[
            Flex(
              direction: Axis.vertical,
              children: <Widget>[
                Expanded(
                  flex: 1,
                  child: Padding(
                    padding: const EdgeInsets.all(5.0),
                    child: Container(
                      child: ListView(children: <Widget>[
                        MyCategories(categoryText: Text('Restaurants', style: categoryTextStyle),),
                        MyCategories(categoryText: Text('Bars', style: categoryTextStyle),),
                        MyCategories(categoryText: Text('Games', style: categoryTextStyle),),

                      ],
                        scrollDirection: Axis.horizontal,
                      ),
                    ),
                  ),
                ),

              Expanded(
                  flex: 10,
                  child: Container(

                    child: GridView.count(

                      crossAxisCount: 2,

                      children: <Widget>[


                        ItemsCard(
                          categoryName: Text('Fast Food', style: secondCategoryTextStyle,),
                          itemText: FastFoodText,
                          priceText: Text('£21.67', style: priceTextStyle,),
                          gridOutline: MyButton(
                            tile: GridTile(
                              child: FastFoodImage,
                          ),
                          ),
                        ),


                        ItemsCard(
                          itemText: SnubbText,
                          priceText: Text('£44.95', style: priceTextStyle,),
                          gridOutline: MyButton(
                            tile: GridTile(
                                child: SnubbImage,
                              ),
                          ),
                        ),


                        ItemsCard(
                          itemText: FreshText,
                          priceText: Text('£41.23', style: priceTextStyle,),
                          gridOutline: MyButton(
                            tile: GridTile(
                                child: FreshImage,
                              ),
                          ),
                        ),


                        Container(),


                      ],
                    ),
                  ),
                ),
              ],
            ),

            Visibility(visible: _MyButtonState().showCard ? _MyButtonState().showCard : !_MyButtonState().showCard, child: CheckoutCard()),

          ],
      ),

    );

  }
}


class MyButton extends StatefulWidget {

  @override
  State<StatefulWidget> createState(){
    return _MyButtonState();
  }

  MyButton({this.tile});
  final GridTile tile;

  bool isVisible = false;
  int itemNumber = 0;

  bool showCheckoutCard(){
    return isVisible = !isVisible;
  }

  int itemCounter(){
    return itemNumber++;
  }

}


class _MyButtonState extends State<MyButton> {

  bool changeColor = false;

  static var myNewButtonClass = MyButton();

  bool showCard = myNewButtonClass.isVisible;

  @override
  Widget build(BuildContext context) {
    return FlatButton(
      shape: Border(bottom: BorderSide(color: changeColor ? Colors.blue[800] : Colors.transparent, width: 3.0)),
      child: widget.tile,
      onPressed: (){
        setState(() {
          changeColor = !changeColor;
          myNewButtonClass.itemCounter();
          print(myNewButtonClass.itemCounter());
          setState(() {
            showCard = !showCard;
            print(showCard);
          });
        });
      },
    );
  }
}

Ответы [ 2 ]

0 голосов
/ 07 февраля 2020

Вы вызываете метод setState внутри вашего Button. Я не думаю, что это изменит состояние вашего MyMenu виджета. Я бы посоветовал вам изменить Button следующим образом:

class MyButton extends StatelessWidget {
  final Color color;
  final GridTile tile;
  final VoidCallback onPressed;

  const MyButton({Key key, this.color, this.tile, this.onPressed})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return FlatButton(
      shape: Border(bottom: BorderSide(color: color)),
      child: tile,
      onPressed: onPressed,
    );
  }
}

После этого вам необходимо объявить две переменные в вашем виджете MyMenu следующим образом:

class _MyMenuState extends State<MyMenu> {
  bool changeColor = false;
  bool showCard = false;

  @override
  Widget build(BuildContext context) {
    yourBuildMethod()

In В свой MyMenu виджет вы можете вызвать кнопку следующим образом:

MyButton(
  tile: GridTile(child: SnubbImage),
  color: changeColor
    ? Colors.blue[800]
    : Colors.transparent,
  onPressed: () {
    setState(() {
      changeColor = !changeColor;
      showCard = !showCard;
    });
  },
),

А теперь проверьте свой Visibility следующим образом:

Visibility(
  visible: showCard,
  child: CheckoutCard(),
)

Теперь ваши переменные находятся в вашем MyMenu виджете и вы вызываете функцию setState в виджете MyMenu. Так что он сможет обновлять состояние вашего виджета. Я надеюсь, что это будет полезно для вас.

0 голосов
/ 07 февраля 2020

Чтобы вызвать перестроение вашего представления на основе изменения значения переменной, вам нужно использовать setState. Если вы изменяете значение переменной isVisible, вам необходимо заключить его в setState:

setState(() {
  isVisible = !isVisible;
});
...