@Mark But the problem is when a user creates more than one toggle button, we dont know which toggle was used in the event.
Whoop whoop extra components, how nice!!!
The CreateToggle block would return the ID that the extension generated. The user can then save that and use it to identify the toggle.
Amazing idea. I’ll surely work on it. I’m hoping that the new create toggle method will return the id of the toggle, similar to adding markers in the maps component.
The Designer’s Brainchild
This update brings along plenty of new features along with a few changes to previous blocks. Feel free to provide your valuable feedback!
This update may break apps using the older versions. Continue at your own risk and discretion.
CreateToggle block has been changed in accordance with @Mark 's suggestions. The id of the toggle will be generated automatically and will be returned as a number. This works similar to the markers in the Maps component. The same approach has been carried over to other methods as well.
This method creates a horizontal progress bar on the screen. Similar to the
CreateToggle method, the id is returned as an integer. The progress bar scales according to the width of the horizontal arrangement.
The current progress can be obtained from the
CurrentProgress block. To change the progress, use the
The following methods will surely be a boon to app designers and those keen on decent UX/UI.
Gone are the days when teal was the only colour for components. With this method, you can change the colour of the checkbox to your app’s theme, all while maintaining the smooth animations.
Similar to the previous method, this one allows you to change the colour of the border line of the textbox.
One of Thunkable’s strengths is its integration of Material Design. Unfortunately, changing the button’s background would ruin the shape and effect of the button. Fret no more! With this method, you can change the colour of the button while retaining the effects and sizing.
With this method, you can dynamically change the type of the text box. The method expects an integer from 1 to 7 with the legend as follows:
1: Normal text input, suits most purposes
2: Text password input, for entering masked text
3: Name input, capitalises the first letter of each word.
4: Email address input, changes keyboard layout for ease of input
5: Number input, self explanatory
6: Numerical password input, to enter masked numbers
7: Date/time input, changes keyboard layout to facilitate entry of dates and time.
This is something that has been asked for a lot. While there are workarounds with clocks and timers, it is usually a long and tiresome process. This method adds a listener to a text box such that an event is fired when the user pressed the enter key. Extremely beneficial if you are making forms or login screens.
(The method expects an intger id, which can be any unique number. The id is just for reference and isn’t the actual id of the textbox.)
When the user presses the enter key, this event is invoked:
The id is returned as an integer. As sample use, I’ve set it to hide the keyboard when the event fires. You may also request focus to another textbox so that the user can continue the input. (Best example: Two textboxes to input first and last names separately. When the user presses enter on the first, the second text box gains focus.)
Please let me know what you think about each of these methods. Feedback is greatly appreciated.
Download: com.vishwas.ExtraComponents.aix (34.5 KB)
Textbox and label border
How do I trigger an event when the user is done typing?
Dynamic components extension
[Free] Switch Button (Toggle Button)
Change hint color
Buttons lose material properties upon editing
Material design using Materialize
Default button color?
How do I trigger an event when the user is done typing?
Go to next textbox when "Enter" is pressed
Great work! Lots of new components.
Thank you Helios. Amazing skills, you are a real Dev-programmer
1 question for you,
does the CreateToggle block support make color block for thumb colour and track colour options?
It doesn’t work the way you are currently using it. You should store the ID in a TinyDB and then retrieve it whenever you want to perform a method relating to a toggle. Since the IDs are created dynamically, they are bound to change and aren’t constant.
Unfortunately, it doesn’t. All colours are currently input as Hex codes. I will surely fix this in the next version.
WoW! This is one of the most amazing extensions I’ve ever seen for Thunkable. This is very much needed! Thank you!
Now all we need is cards…
I prefer to use my own IDs than automade ones. But still, dope (very good) extension.
This is amazing, thank you very much, I’m using the AddEnterPressListener method and it works great whit numbers
It is always better to leave the dirty job to the compiler. Even in Android Studio, view IDs are automatically generated and are referenced to as R.id.button1 or something similar.
In Thunkable, you can store the ID of the component in a global variable, say,
toggle1ID. When there is an event related to the toggle, you can reference its ID from the variable. It’s almost similar to creating your own IDs.
Hi Does not compile in AppyBuilder…
AppyBuilder is unable to compile this project.
The compiler error output was
________Preparing application icon
________Creating animation xml
________Creating fragment xml
________Generating manifest file
________Attaching native libraries
________Attaching component assets
________Compiling source files
(compiling com/appybuilder/werner/Masskot_Data_Entry/Screen1.yail to com.appybuilder.werner.Masskot_Data_Entry.Screen1)
(compiling /tmp/runtime6587957236434921872.scm to com.google.youngandroid.runtime)
Kawa compile time: 4.733 seconds
YAIL compiler - DX execution failed.
Please don’t double post.
Also, this is a Thunkable forum.
As the extensions work fine on Thunkable, it must be a problem with AppyBuilder. Try asking on the AppyBuilder forums instead.
A more sophisticated slider component
A possible integration of a progressbar on to the action bar, so as to achieve native UI while making loading animations.
Keep your fingers crossed!