flutter - 如何从 Flutter Searchdelegate 中删除飞溅

Question

我正在制作第一个要放在 App Store 上的应用程序。这是一个天气应用程序。将其命名为 Aer，所以请尽快查看!但无论如何，我已经基本完成了。不过有一件事困扰着我。每当我搜索一个城市时(每当我在 SearchDelegate 中返回一个小部件或进入和离开它时)都会发生这种奇怪的飞溅。我的猜测是它与动画有关，但我不知道如何更改它，或者它是否就是这样。下面是我的代码(注意复制粘贴，因为我做的很快)。我真的很想得到一些帮助来摆脱这个。我还附上了一张 gif 以更好地展示我在说什么。谢谢!

place_search.dart

import 'package:aer/services/places.dart';
import 'package:aer/style.dart';
import 'package:flutter/material.dart';

class AddressSearch extends SearchDelegate<Suggestion> {
  AddressSearch(this.sessionToken) {
    apiClient = PlaceApiProvider(sessionToken);
  }

  final sessionToken;
  PlaceApiProvider apiClient;
  Suggestion firstItem;
  List<Suggestion> results;

  @override
  ThemeData appBarTheme(BuildContext context) {
    return ThemeData(
      primaryColor: Color.fromRGBO(45, 45, 42, 1.0),
      primaryIconTheme: IconThemeData(color: Color.fromRGBO(239, 247, 255, 1.0)),
      textTheme: TextTheme(
          title: Style.textStyle(size: 24, color: Color.fromRGBO(239, 247, 255, 1.0))
      ),
      inputDecorationTheme: InputDecorationTheme(
        hintStyle: Style.textStyle(size: 24, color: Color.fromRGBO(239, 247, 255, 1.0)),
      ),
      cursorColor: Color.fromRGBO(239, 247, 255, 1.0),
    );
  }

  @override
  Animation<double> get transitionAnimation => super.transitionAnimation;

  @override
  TextInputType get keyboardType => TextInputType.name;

  @override
  List<Widget> buildActions(BuildContext context) {
    return [
      Padding(
        padding: const EdgeInsets.symmetric(horizontal: 16.0),
        child: IconButton(
          tooltip: 'Clear',
          icon: Icon(Icons.clear),
          onPressed: () {
            query = '';
          },
        ),
      )
    ];
  }

  @override
  Widget buildLeading(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 16.0),
      child: IconButton(
        tooltip: 'Back',
        icon: Icon(Icons.arrow_back),
        onPressed: () {
          close(context, null);
        },
      ),
    );
  }

  @override
  Widget buildResults(BuildContext context) {
    if (query != '' && firstItem != null) {
      return Scaffold(
        backgroundColor: Color.fromRGBO(45, 45, 42, 1.0),
        body: ListView.builder(
          itemBuilder: (context, index) => ListTile(
            title:
            Padding(
              padding: const EdgeInsets.only(left: 16.0),
              child: Text((results[index]).description, style: Style.textStyle(size: 16, color: Color.fromRGBO(239, 247, 255, 1.0))),
            ),
            onTap: () {
              close(context, results[index]);
            },
          ),
          itemCount: results.length,
        ),
      );
    } else {
      query = '';
      return Scaffold(
        backgroundColor: Color.fromRGBO(45, 45, 42, 1.0),
        body: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Padding(
              padding: const EdgeInsets.only(bottom: 128.0),
              child: Center(child: Text("Oops! We couldn't find that one.\nTry again.", textAlign: TextAlign.center, style: Style.textStyle(size: 20, color: Color.fromRGBO(239, 247, 255, 1.0)))),
            )
          ],
        ),
      );
    }
  }

  @override
  Widget buildSuggestions(BuildContext context) {
    return Scaffold(
      backgroundColor: Color.fromRGBO(45, 45, 42, 1.0),
      body: FutureBuilder(
        future: query == ''
            ? null
            : apiClient.fetchSuggestions(
            query, Localizations.localeOf(context).languageCode),
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            if (snapshot.data.length != 0) {
              firstItem = snapshot.data[0] as Suggestion;
              results = snapshot.data;
            } else {
              firstItem = null;
              return Scaffold(
                backgroundColor: Color.fromRGBO(45, 45, 42, 1.0),
                body: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Padding(
                      padding: const EdgeInsets.only(bottom: 128.0),
                      child: Center(child: Text("Oops! We couldn't find that one.\nTry again.", textAlign: TextAlign.center, style: Style.textStyle(size: 20, color: Color.fromRGBO(239, 247, 255, 1.0)))),
                    )
                  ],
                ),
              );
            }
          }
          return query == ''
            ? Container(
        )
            : snapshot.hasData
            ? ListView.builder(
          itemBuilder: (context, index) => ListTile(
            title:
            Padding(
              padding: const EdgeInsets.only(left: 16.0),
              child: Text((snapshot.data[index] as Suggestion).description, style: Style.textStyle(size: 16, color: Color.fromRGBO(239, 247, 255, 1.0))),
            ),
            onTap: () {
              close(context, snapshot.data[index] as Suggestion);
            },
          ),
          itemCount: snapshot.data.length,
        )
            : Padding(
              padding: const EdgeInsets.only(left: 32.0, top: 16.0),
              child: Container(child: Text('Loading...', style: Style.textStyle(size: 16, color: Color.fromRGBO(239, 247, 255, 1.0)))),
            );
        }
      ),
    );
  }
}

main.dart (where I call the SearchDelegate)

onTap: () async {
   final sessionToken = Uuid().v4();
   final Suggestion result = await showSearch(
      context: context,
      delegate: AddressSearch(sessionToken),
   );
   if (result != null) {
      BlocProvider.of<WeatherBloc>(context).add(
         WeatherRequestedByCity(city: (result).description));
      RegExp regExp = RegExp('^(.+?),');
      String city = regExp.stringMatch((result).description).toString();
      if (city != 'null') {
         city = city.substring(0, city.length - 1);
      } else {
         city = (result).description;
      }
      setState(() {
         location = city;
         currentPage = 0.0;
      });
   }
}

Answer 1

有一个允许动画自定义的未决问题 here .我建议对它进行投票，以帮助提高它在 Flutter 团队中的优先级。