Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ComboBox with TextInput #2057

Open
HaSa1002 opened this issue Sep 2, 2018 · 5 comments
Open

ComboBox with TextInput #2057

HaSa1002 opened this issue Sep 2, 2018 · 5 comments

Comments

@HaSa1002
Copy link

HaSa1002 commented Sep 2, 2018

Version/Branch of Dear ImGui:

1.64

Back-end file/Renderer/OS:

Back-ends: SFML, imgui-SFML
OS: Win10

Suggestion:
I needed a ComboBox, where you can simply enter Text and the combobox provides you with one proposal. If it doesn't fit, you simply enter the next character and get the next best fitting proposal. Besides you can click on the ComboBox Key or use the right mouse button to open the ComboBox and select an entry. The textinputcombobox.cpp.txt provides the full implementation of this widget, as well as an minimal example, which is also visible below. The solution is by far not perfect eceptionally the "backspace" (the action, if you want to delete text) support, since it uses SFML Keys, because I couldn't get this correctly done using imgui functions. Also deleting isn't always exxecuted, which could be related to my backend, since it worked when it was not in the function... I tried to use no stl container, but didn't came around one pair to pass the actual array as well as the size of this array.

Screenshots/Video
combobox

Standalone, minimal, complete and verifiable example:

ImGui::Begin("Combobox");
	static char buffer[20];
        const char* items[] = {"Item1", "Item2", "AAAA", "AAAB", "AABB", "ABBB", "ABBB"};
	ImGui::TextInputComboBox("Demo", buffer, 20, items, IM_ARRAYSIZE(items), 0);
ImGui::End();

Sourcecode:
textinputcombobox.cpp.txt

@ocornut
Copy link
Owner

ocornut commented Sep 3, 2018

Hello @HaSa1002

Thanks for posting this!

Some feedback:

  • Providing a GIF (instead of static pictures) would make the widget much more self explanatory to users. You can use ScreenToGif to create animated GIF easily.
  • I think you could rewrite TextInputComboBox() use use InputText + BeginCombo/EndCombo instead of reimplementing Combo().
  • For your std::string wrapper, see Allow for dynamic re-allocation of internal buffer while user is still typing in InputText? #2006.
  • Your function bool identical(const char* buf, const char* item) is equivalent to calling strcmp(buf, item) == 0, expect identical() is much slower. Remember strlen() is doing a full iteration over the string, so you are doing 2 iterations + 1 extra iteration in the loop while iterating. You could just do a single iteration and test for the zero terminator and never call strlen.
  • ImGuiInputTextFlags_CallbackAlways doesn't provide you with a key. I think your Key testing code will never run, but I'm not even sure to understand what it is trying to do, it appears that your Backspace code tries to emulate exactly what Backspace already does?
  • You can use a normal structure instead of std::pair if you want the code to work without reliance on STL stuff or templates.

@HaSa1002
Copy link
Author

HaSa1002 commented Sep 3, 2018

Thanks for the feedback. First of all I posted a gif (It was a bit late yesterday). Second, that could be possible, but the selection is saved using the buffer of the textinput and it depends on the sizing possiblities of the combo. Third is on the way. Fourth, I use now strncmp since it checkes the equality of the first n characters. Fifth, the custom delete is ncessary, because the user deletes the selection, but still want's to the delete on more char. If this isn't working you can't delete chars because only the proposal is selected to gurantee textinput. Six, yes, I forgot that.
I normally use a lot of the stl library, so programming it in the imgui way is sometimes a bit tricky for me.
I now tried to change the ImGuiInputTextFlags_CallbackAlways to ImGuiInputTextFlags_CallbackCharFilter, but my code always crashes, because using the charfilter callback I don't get the buffer (It is a nullptr, since the ). InputTextFilterCharacter() function has no access to it. It would be very nice if ether the key is passed when using ImGuiInputTextFlags_CallbackAlways or the buffer would be set when using ImGuiInputTextFlags_CallbackCharFilter. However a completly different solution would also be ok.

@JPGygax68
Copy link

@ocornut I'm trying to implement something similar. Regarding your suggestion to use InputText + BeginCombo/EndCombo: how can I align the drop-down selectables with the left of my InputText?

@ocornut ocornut added the popups label Apr 7, 2020
@ocornut
Copy link
Owner

ocornut commented Apr 7, 2020

May not have time to look at it, but linking this thread to #718

@JPGygax68
Copy link

Thanks @ocornut. That ought to work.

ocornut added a commit that referenced this issue Feb 7, 2024
Very highly requested feature (#6962, #5219, #3290, #4627, #5054, #3878, #2881, #1506, #1216, #968).
Also useful for interactive completion/selection popups (#2057, #718)
Based on @kudaba PR. Design for Inputtext V2 should make this obsolete.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants