Screen "jumping" (bouncing) after changes in 1.0.6 (1.0.5 and before is okay)

[pavkoccino]

Describe the bug
In some older project that we are maintaining we were currently upgrading to latest flutter (3.24.3) and together we were bumping our dependencies. One of them is searchField and we went from 0.8.4 to 1.1.7. After the changes however (interestingly) one of the screens that is using searchField is bouncing when I am typing and some search results are present. I've been investigating and the breaking change is what happened between v1.0.5 and v1.0.6.

Unfortunately I cannot reproduce it on your example, although I've been trying very hard, so I cannot give you minimal reproducible code (just video). However playing around with your code I was able to figure out which line is causing the issue. Maybe you will be able to understand what could be happening. If you could cooperate with me on this, I would be very grateful.

See attached video:

Screen_Recording_20241024_185017.mp4

The change that was done was this (see here #136):

if (searchResult.isEmpty) {
     selected = null;
} 
/// IF I REMOVE THIS ELSE, THE BOUNCING STOPS
else {
    selected = 0;
}

To Reproduce
Unfortunately, I am not able to produce minimal reproducible code.

[✅ ] By clicking this checkbox, I confirm I am using the latest version of the package found on pub.dev/searchfield

Expected behavior
The bouncing should not happen.

Actual behavior
There is bouncing when searchItems contain something and selected = 0;

[maheshj01]

Hi @pavkoccino, thanks for filing the detailed issue, I will investigate it and update you on this.

[maheshj01]

@pavkoccino Meanwhile, Can you please share a code sample that reproduces this issue? Is this happening only when Searchfield is in a newly navigated page?

[pavkoccino]

Hey @maheshj01, I am really sorry, but as I wrote in the original post, I am not able to reproduce it on some simple project (for example on your example project). So probably there needs to be other things that are involved in this. However I am unable to post here the codebase from the project, where we have this issue as that is not open source.

[maheshj01]

Sure, I will investigate this issue. I'm bit occupied with some work, Probably take a look at it this weekend.

[maheshj01]

Hello @pavkoccino,

I tried to reproduce the bug, but I am unable to reproduce it, Can you try to reproduce it with the below code sample or Atleast Share Some code sample that I can take a look?

import 'package:example/demo.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter App',
      theme: ThemeData(
        colorSchemeSeed: Colors.indigo,
        useMaterial3: true,
        brightness: Brightness.light,
      ),
      darkTheme: ThemeData(
        colorSchemeSeed: Colors.blue,
        useMaterial3: true,
        brightness: Brightness.dark,
      ),
      home: SearchFieldSample(),
      debugShowCheckedModeBanner: false,
    );
  }
}

class SearchFieldSample extends StatefulWidget {
  const SearchFieldSample({Key? key}) : super(key: key);

  @override
  State<SearchFieldSample> createState() => _SearchFieldSampleState();
}

class _SearchFieldSampleState extends State<SearchFieldSample> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text('Searchfield Demo')),
        body: Padding(
          padding: const EdgeInsets.all(8.0),
          child: ListView(
            children: [
              ElevatedButton(
                  onPressed: () {
                    Navigator.of(context).push(
                        MaterialPageRoute(builder: (context) => DemoApp()));
                  },
                  child: Text('tap me')),
            ],
          ),
        ));
  }
}


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

class DemoApp extends StatefulWidget {
  @override
  _DemoAppState createState() => _DemoAppState();
}

class _DemoAppState extends State<DemoApp> {
  final List<String> _suggestions = [
    'United States',
    'Germany',
    'Canada',
    'United Kingdom',
    'France',
    'Italy',
    'Spain',
    'Australia',
    'India',
    'China',
    'Japan',
    'Brazil',
    'South Africa',
    'Mexico',
    'Argentina',
    'Russia',
    'Indonesia',
    'Turkey',
    'Saudi Arabia',
    'Nigeria',
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: ListView(
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: SearchField(
              scrollbarDecoration: ScrollbarDecoration(thumbVisibility: false),
              suggestionItemDecoration: BoxDecoration(
                color: Colors.grey.withOpacity(0.2),
                gradient: LinearGradient(colors: [
                  Color(0xff70e1f5),
                  Color(0xffffd194),
                ], begin: Alignment.topLeft, end: Alignment.bottomRight),
              ),
              suggestions:
                  _suggestions.map((e) => SearchFieldListItem(e)).toList(),
              suggestionState: Suggestion.hidden,
              searchInputDecoration: SearchInputDecoration(
                floatingLabelBehavior: FloatingLabelBehavior.auto,
                labelText: 'SearchField',
                border: OutlineInputBorder(),
              ),
              hint: 'SearchField example 4',
              maxSuggestionsInViewPort: 6,
              suggestionDirection: SuggestionDirection.down,
              itemHeight: 45,
              onSuggestionTap: (x) {},
            ),
          ),
        ],
      ),
    );
  }
}

[maheshj01]

Hi @pavkoccino, I made a PR #191 which will probably fix this issue

v1.2.0 is now live on pub.dev see the Changelog for details. Please try it out and let me know if that fixes the issue.

[pavkoccino]

Thank you, I am going to try it today and will let you know.

[pavkoccino]

Unfortunately, after upgrading to 1.2.0 we can still observe the bouncing behavior :(

[maheshj01]

@pavkoccino Can you share a reproducible code sample?
See How to create a minimal reproducible code sample?

[pavkoccino]

I am little bit overwhelmed right now so I do not know when I could get to it.