Add search field for languages

ManeraKai / simplytranslate_mobile

Privacy friendly frontend to Google Translate

https://manerakai.github.io/simplytranslate_mobile/

GNU General Public License v3.0

173 stars 15 forks source link

Add search field for languages #7

Closed Aga-C closed 3 years ago

Aga-C commented 3 years ago

Hi,

It would be very useful to add a search field for a languages lists, especially that there are many languages to choose. Here is an example how it could be done: https://www.woolha.com/tutorials/flutter-using-autocomplete-widget-examples

ManeraKai commented 3 years ago

You're right. I've now replaced Dropdown menus with searchable menus.

Aga-C commented 3 years ago

I think that it could work a bit better. Now user has to delete the whole textbox and write anything to get any suggestions. That's not exactly what I was thinking about. Maybe it would be better if it would select the text on focus, or clear the input on the start.

Also, there is another option. After some searching, I've found two components for searchable dropdowns for Flutter. I think, one of these would be even better solution:

They offer both at once - selecting from the list and searching for a proper item.

ManeraKai commented 3 years ago

I tried to do those things without installing additional packages.

ManeraKai commented 3 years ago

Note: it won't work in Polish. Just in English. I'll try to fix that.

ManeraKai commented 3 years ago

I think it's fixed now.

Aga-C commented 3 years ago

It looks better, but I still see some issues:

Swapping languages doesn't work. Inputs in textfield seems ok, but target language doesn't change.
I think it would be good to show on the click all the options that are available and later typing text would start filtering them
Empty space on the beginning of the list doesn't look good
Autodetect is not on the top of the list anymore and long text of it doesn't wrap (e.g. in Polish it's very long and I can see only part of it)

Are you sure you don't want to use any of the ready solutions? I think it would be easier and faster to achieve full functionality of dropdown-search this way.

ManeraKai commented 3 years ago

This is fixable
It's not shown because a one was typed before. Changing that behavior on the first click is possible though.
Is it the padding that your talking about?
This is fixable.
the AutoComplete widget is so customizable. The app's design is somewhat different from regular android apps. I need that customizability. However, if it turned out to be complicated. Yeah, I will switch to the packages.

Aga-C commented 3 years ago

Yes, it would be better from UX point of view.
Yes.

ManeraKai commented 3 years ago

I've fixed the issues above. However, There is a limitation with AutoComplete that I didn't find a real solution for it yet. You can see here that the fromLanguage options' container can be stretched more to the right: However, I can't stretch the toLanguage options' container to the left: I can't move it behind the red line: A workaround for it is by wrapping the text:

Aga-C commented 3 years ago

Super, it looks and works good 👍