Stencyl 3.4.0 is now out. Get it now!

Simple input box

minu94

  • Posts: 30
Hello,

I  created this simple input box on Stencyl with blocks (no custom code).
So it's possible read, store and show on another scene a value from input box.
You can find the project here:  http://www.stencyl.com/game/play/37601
There are some issues though: you can't insert unlimited char, or it didn't read special characters, for example.
If you interested I can give you the files and a brief tutorial.

Please do not use this input to login form, or store password, I think there are many security issues.
Cheers

« Last Edit: October 03, 2017, 03:02:17 am by minu94 »
Follow my game projects on twitter: https://twitter.com/manuDaje

HopFrog

  • Posts: 32
Hi!

This is great. I have been looking for something like this for a while. I'm curious how you did it.

Thanks

minu94

  • Posts: 30
Update
Added a color when focused.

So here's a brief explenations:

I concieve every element as a Gui (Graphic User Interface) Element. So let's first create a group called "GUI Elements".
Now you can create 3 actors: input1, input2 and a button. To every actors created, change the group to GUI Elements.
Every element will import a behavior called "Gui Element". This behavior will handle the focus and apply an optional color effect. (Ideally, you can apply every effect you want).
Download the .zip below and attach the input image  to every input actors and button image to button actor.
Note: the behaviors are saved as png files, but contains code! So import in your stencyl project the "Gui Element.png" and "inputUI.png" as actor behavior.
Then, to the input actors, you will attach the "inputUI" behavior. This will handle a lot of things.
Now you can create a "default" font, with 16 px, color black, so you can pass the font to the behaviors InputUI through the input actors.
Note that for every input dimension or font dimension, you will need to configure the parameters on behavior inputUI (such as padding-left, pading-right, etc).
Attach the actors to the scene. You should be able to write in the input.
To read your value, you can check the image "how read values.png" inside the .zip.

As I mentioned in the previous post, there are some issues:
1) At the moment, you can't set focus at the middle of your input string. The focus will be positioned at the end of string only;
2) Some special caracters aren't readable;
3) The number of characters that can be inserted depends on the width of actors and the dimension of font.

I think I'll work  to add some features to the input, or work to realize a select box, dunno.
If you add some features, please share your informations.
I tested on flash and it's work fine. Then I tested on html5 but doesn't work properly.
You can also read numbers and set dinamically a property with that value, but I will explain on another tutorial.

PS: sorry if my English is not perfect 

Cheers



« Last Edit: October 03, 2017, 02:04:53 am by minu94 »
Follow my game projects on twitter: https://twitter.com/manuDaje

minu94

  • Posts: 30
You can read numeric values and change property of actors:
http://www.stencyl.com/game/play/37604

take a look at this pictures:

Cheers

« Last Edit: October 03, 2017, 02:49:11 am by minu94 »
Follow my game projects on twitter: https://twitter.com/manuDaje

HopFrog

  • Posts: 32
Thanks so much! I'll have a look at this tonight.

EducativeApps

  • *
  • Posts: 4
Nice, very good job.

hope this will be a built in blocks for next realese Stencyl 3.5