Typeahead suggestions goes up on appbar, its a overlay issue

[shrutikateiosys]

When i set autoflip for suggestions it goes overlay on app bar which looks not good kindly provide solution.

kindly provide solution

[d3xt3r2909]

Is there any information regarding this, I really need this to be fixed :(

[mahendragp]

I am also getting the same issue.

did you find any solution?

[shrutikateiosys]

No

On Fri, Apr 3, 2020 at 12:06 PM MahendraGP [email protected] wrote:

I am also getting the same issue.

did you find any solution?

[image: Simulator Screen Shot - iPhone 11 Pro Max - 2020-04-03 at 12 04 40] https://user-images.githubusercontent.com/15658830/78331364-82097b80-75a3-11ea-8e41-e1bd931e8903.png

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/AbdulRahmanAlHamali/flutter_typeahead/issues/115#issuecomment-608257447, or unsubscribe https://github.com/notifications/unsubscribe-auth/AJLR67DDQWGWESWIJBJDS4TRKV7X5ANCNFSM4IEPCIPQ .

-- Shrutika Tatkare | Eiosys Inc.

Tel: +91 22 6464 6561 | [email protected] | http://www.eiosys.com

[Stephen-Cronin]

I'm having the same problem.

If I set the direction to AxisDirection.up it goes up over the app bar, which I don't mind so much, except that if a user wants to select the top item, they can't, because it pulls down the notification drawer (my app is a full screen app).

If I set the direction to AxisDirection.down, it goes down behind the keyboard and the user can't see what the suggestions are at all... My app is a landscape app, which makes this issue much more problematic as there is very little space to work with.

I've tried all the permutations of the settings I can think of, such as:

• autoFlipDirection (doesn't take appbar or notifications pull down area or keyboard into account),
• boxConstraints (can make it so small there is less chance of bumping into the top, but nothing stopping the user using it when the text field is near the top)
• changing suggestionsBoxVerticalOffset to something larger (brings the top down, Yay!, but also brings the bottom up, disconnecting the suggestions from the text field)

I could be missing something, but I couldn't work out how to make this usable. I really hope something can be done about this as it works great in general. Thanks.

[shabeenabarde]

Is this fixed?? I'm facing the same issue

[harithm918]

Did any one find the solution for this? Please help

[clragon]

To solve this, create a new Overlay widget inside of the body of your Scaffold. the TypeAhead overlay box will not exceed its surrounding Overlay, so this will ensure it will not be drawn outside of the Scaffold body.

as an example:

return Scaffold(
  appBar: AppBar(
    title: const Text('My appbar'),
  ),
  body: Overlay(
    initialEntries: [
      OverlayEntry(
        builder: (context) => Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              TypeAheadField( /* ... */ ),
            ],
          ),
        ),
      )
    ],
  ),
);