Hi, I have a very small List View (**FRListView)**containing 3 items: the first a blank item (no text); the second has the text value “FRAME”; and the 3rd has the text value “REG”.
I wish to use this List Viewer as a dropdown menu. But I also want the List Viewer box to be the same size as the other text boxes.
This List Viewer is to be situated situated amongst six Text Input Boxes and replace the current Text Input named “AddText_InputFR” (shown as Frame or Reg in the image below).
The results I have found in the Community only seem to cover selecting an item from the dropdown to create a message elsewhere on the screen.
I have tried copying the blocks from the results and applying them to my needs but I can’t get them to work.
What I am trying to do is this:
As mentioned above, the dropdown menu will only contain 3 values: a blank cell;space; “FRAME” and “REG”
When screen opens, the user will be presented with a blank input box which will contain the dropdown menu. Which will be presented to the user as closed. When the blank input box is clicked, the dropdown menu will appear. The user will click on one of the text values and the dropdown menu will disappear leaving only the selected item showing in the input box. This text must be able to be entered like regular text into the Source Google Sheet just like the values in the other text input boxes showing
I wish to use the this box to replace the regular text input box currently present. (As shown above).
Any help to resolve this would be greatly appreciated.
You’d just need to modify it to appear closed when the screen starts. I would probably hide the list viewer and show a button that looks like it is closed. Then when the button is clicked, show the list viewer and hide the button. Unfortunately, that means the user would have to click twice (once on the button and then once on the list viewer) to see the choices. It’s a shame that Thunkable doesn’t have better mouse up/mouse released/mouse down detection events.
Hi @tatiang, I had already looked at that post but couldn’'t quite grasp it. I also tried another post link within that post and got completely muddled up. See my blocks below:
List Viewers are not that aesthetically pleasing. What they are is simple and quick to use. If you want something that looks better, I would go with a Data Viewer List (DVL) or – if you’re using the older Snap to Place (StP) interface instead of the Drag and Drop (DnD) interface, you can use clone blocks to create your own drop-down list. Then you have much more flexibility in terms of how it works and how it looks. But it will be more work!
So when the user clicks an item from the list of choices, the list viewer’s text items get set to that single item. And then when the single item is clicked, the list viewer’s text items get set back to the full list of choices.
By default, a list viewer doesn’t “do” anything when you click on an item except store the text of the item in the green item block and the row number of the item in the green index block. It doesn’t close or change the appearance of the component. That’s why I had to figure out another way to do it.
I, initially, found the above paragraph very confusing. I understand it now.
I was thinking of this workaround…
Based on the first click to select the item from the list, is there a way that the first click could write the “text” from the selected item to an input text field and then close itself?
I asked because the field I was thinking of writing the text to is the “AddRecText_InputFR” Text_Input field located in the "AddRecBtnSave/ Click block. (Image below).
By creating a "when Frame is selected from the dropdown menu, enter the text “Frame” into the “AddRecText_InputFR” Text_Input field function maybe? and obviously the same for when the “Reg” item is selected.
What do you think?
I can’t help feeling that this is possible but again, I am not sure how to make this work.
Sure but just to be clear: list viewers can’t “close.” They can be hidden by setting their visible property to false. In the Item Click block, assign the green item block to a text input’s text value. Then change the list viewer’s visible property to false.
I used @tatiang’s suggestion of using the “set FRListView’ s Visible to” blocks to achieve the desired visibilty effects and then tweaked the label and column sizes to achieve the perfect aesthetic appearance.