3

我是 Flutter 的初学者，我是第一次使用 Futurebuilder 和 provider。最后，我创建了一个添加地点的应用程序。使用下面的代码，我几乎已经实现了该应用程序。但是现在出现了一个小问题。当应用程序从提供者获取数据时，它会显示浮动操作按钮。我不希望这种情况发生。有没有办法在获取数据时隐藏浮动操作按钮并在从数据库获取数据后将其显示给用户？

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

import './add_place_screen.dart';
import '../providers/great_places.dart';
import './place_detail_screen.dart';

class PlacesListScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Your Places'),
        actions: <Widget>[
          IconButton(
            icon: Icon(Icons.add),
            onPressed: () {
              Navigator.of(context).pushNamed(AddPlaceScreen.routeName);
            },
          ),
        ],
      ),
      body: FutureBuilder(
        future: Provider.of<GreatPlaces>(context, listen: false)
            .fetchAndSetPlaces(),
        builder: (ctx, snapshot) => snapshot.connectionState ==
                ConnectionState.waiting
            ? Center(
                child: CircularProgressIndicator(),
              )
            : Consumer<GreatPlaces>(
                child: Center(
                  child: const Text('Got no places yet, start adding some!'),
                ),
                builder: (ctx, greatPlaces, ch) => greatPlaces.items.length <= 0
                    ? ch
                    : ListView.builder(
                        itemCount: greatPlaces.items.length,
                        itemBuilder: (ctx, i) => ListTile(
                              leading: CircleAvatar(
                                backgroundImage: FileImage(
                                  greatPlaces.items[i].image,
                                ),
                              ),
                              title: Text(greatPlaces.items[i].title),
                              subtitle:
                                  Text(greatPlaces.items[i].location.address),
                              onTap: () {
                                Navigator.of(context).pushNamed(
                                  PlaceDetailScreen.routeName,
                                  arguments: greatPlaces.items[i].id,
                                );
                              },
                            ),
                      ),
              ),
      
      ),
floatingActionButton:  FloatingActionButton(
            onPressed: () {
                         },
            child: Icon(Icons.add),
          ),      
  

  );
  
  }
}
4

3 回答 3

1

让你的班级成为StatefulWidget而不是StatelessWidget。这将有助于实现浮动操作按钮的可见性。并尝试在 build 方法中处理 setstate(){} ，该方法会在状态变化时不断调用。

于 2020-10-13T09:18:05.663 回答
0 
class PlacesListScreen extends StatelessWidget {
 var fbVisible = false;
......

builder: (ctx, greatPlaces, ch) {
if (greatPlaces.items.length <= 0){
fbVisible = false;
return ch;
}
else {
fbVisible = true;                    
return ListView.builder(
.....

    floatingActionButton:  Visibility(visible:fbVisible,
    child:
    FloatingActionButton(
                onPressed: () {
                             },
                child: Icon(Icons.add),
              )),
于 2020-10-13T10:00:04.407 回答
0

你可以试试ValueNotifier，https: //api.flutter.dev/flutter/foundation/ValueNotifier-class.html

一个包含单个值的 ChangeNotifier。

当值被替换为不等于由相等运算符 == 评估的旧值时，此类会通知其侦听器。

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

import './add_place_screen.dart';
import '../providers/great_places.dart';
import './place_detail_screen.dart';

class PlacesListScreen extends StatelessWidget {
  final ValueNotifier<bool> _isWaiting = ValueNotifier<bool>(false);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Your Places'),
        actions: <Widget>[
          IconButton(
            icon: Icon(Icons.add),
            onPressed: () {
              Navigator.of(context).pushNamed(AddPlaceScreen.routeName);
            },
          ),
        ],
      ),
      body: FutureBuilder(
          future: Provider.of<GreatPlaces>(context, listen: false)
              .fetchAndSetPlaces(),
          builder: (ctx, snapshot) {
            _isWaiting.value =
                snapshot.connectionState == ConnectionState.waiting;

            return _isWaiting.value
                ? Center(
                    child: CircularProgressIndicator(),
                  )
                : Consumer<GreatPlaces>(
                    child: Center(
                      child:
                          const Text('Got no places yet, start adding some!'),
                    ),
                    builder: (ctx, greatPlaces, ch) =>
                        greatPlaces.items.length <= 0
                            ? ch
                            : ListView.builder(
                                itemCount: greatPlaces.items.length,
                                itemBuilder: (ctx, i) => ListTile(
                                  leading: CircleAvatar(
                                    backgroundImage: FileImage(
                                      greatPlaces.items[i].image,
                                    ),
                                  ),
                                  title: Text(greatPlaces.items[i].title),
                                  subtitle: Text(
                                      greatPlaces.items[i].location.address),
                                  onTap: () {
                                    Navigator.of(context).pushNamed(
                                      PlaceDetailScreen.routeName,
                                      arguments: greatPlaces.items[i].id,
                                    );
                                  },
                                ),
                              ),
                  );
          }),
      floatingActionButton: ValueListenableBuilder(
          valueListenable: _isWaiting,
          builder: (BuildContext context, bool value, Widget child) {
            return Visibility(
                visible: !value,
                child: FloatingActionButton(
                  onPressed: () {},
                  child: Icon(Icons.add),
                ));
          }),
    );
  }
}
于 2020-10-13T09:26:31.950 回答