如何在条件下查看FloatingActionButton

时间:2018-09-22 16:21:45

标签: flutter

我有订单清单orderList。如果那是Empty,则FloatingActionButton被隐藏。如果orderList有产品-将显示FAB。我的代码:

bool statusFAB = false;   

_getFABState(){
        setState(() {
          if(!orderList.isEmpty){
            statusFAB = true;
          }
        });
      }

      @override
      Widget build(BuildContext context) {
        return Scaffold(
          floatingActionButton: _getFAB(),
          backgroundColor: _kAppBackgroundColor,
          body: Builder(
            builder: _buildBody,
          ),
        );

      Widget _getFAB() {
        if(statusFAB){
          return FloatingActionButton(
              backgroundColor: Colors.deepOrange[800],
              child: Icon(Icons.add_shopping_cart),
              onPressed: null);
        }
      }

这不起作用,因为条件只能工作一次,但是orderList的状态可以随时更改。

3 个答案:

答案 0 :(得分:3)

您不需要存储statusFAB变量,您可以随时对其进行评估。请参阅下面的更新示例:

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButton: _getFAB(),
      backgroundColor: _kAppBackgroundColor,
      body: Builder(
        builder: _buildBody,
      ),
    );

  Widget _getFAB() {
    if (orderList.isEmpty) {
      return Container();
    } else {
      return FloatingActionButton(
          backgroundColor: Colors.deepOrange[800],
          child: Icon(Icons.add_shopping_cart),
          onPressed: null);
    }
  }

答案 1 :(得分:0)

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<Product> orderList = List();
  int counter = 0;

  void getCount(){
    setState(() {
      counter = orderList.length;
    });
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: Center(
        child: Container(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              IconButton(
                onPressed: (){
                  if(orderList.isNotEmpty)
                  orderList.removeLast();
                  getCount();
                },
                icon: Icon(Icons.remove),
                color: Colors.red,
              ),
              Text('$counter'),
              IconButton(
                onPressed: (){
                  orderList.add(Product('product'));
                  getCount();
                  print('product added');
                },
                icon: Icon(Icons.add),
                color: Colors.blue,
              )
            ],
          ),
        ),
      ),
      floatingActionButton: _getFAB()
    );
  }

 Widget _getFAB() {
   if (orderList.isEmpty) {
     return Container();
   } else {
     return FloatingActionButton(
         backgroundColor: Colors.deepOrange[800],
         child: Icon(Icons.shopping_cart),
         onPressed: null);
   }  }
}

class Product {
  String title;
  Product(this.title);
}

答案 2 :(得分:0)

有一个快捷方式可以与三元运算符一起使用,并且可以在有状态小部件的脚手架中用作

100L

除非您需要冗长而复杂的功能,否则此方法效果很好。即使您需要复杂的功能,也只有在需要绘图时才能调用该功能

l = [4,3,1,5,3,5,8,11,10,4,12,2,1]
n = 2
k = 3

chunk_l = [y for x in [l[i:i+n] for i in range(0,len(l), n+k)] for y in x]
print(chunk_l)
#[4, 3, 5, 8, 12, 2]