userInput Events in Multi-line Textboxes

born2b.epic · October 30, 2016, 7:44pm

Hey Corona,

Seeing as to how responsive and polite the Corona community is, I would like to ask a question regarding the userInputs in textboxes. I am working on the free Windows build of Corona and am making an app for android.

The functionality of this app depends on the app reading when the user is typing and not typing.

I understand the began, editing, and ended phases of corona. The problem is I cannot figure out how to allow corona to read when the user is typing something into the textbox and when the typing stops (when the user is “actually” editing/when the user is “actually” not “editing” and editing has not ended). The ended phase should not be called until the timer stops or if the user clicks out of the textbox.

To simplify the above,

The user is “currently typing”= clock start, clock text turns blue.

The user has stopped typing=clock text turns green for two seconds

The user has not typed in the two seconds= clock text turns red for five seconds.

The user does not type in all two seconds and five seconds= current text in the textbox is deleted, clock text stays red until the user types again.

Extra note: If the user start typing once again in any of the time periods(two or five seconds), the cycle(green then red then delete) is reset(blue), until he stops typing once again, meaning nothing will be deleted after the total seconds(seven)

I am relatively new to corona(beginner level of self-taught, (I’m 16 years old)), and greatly appreciate all the help I can get. Thanks everybody. If there is any other information that I can provide that you need, please let me know.

local function textListener( event ) if ( event.phase == "editing" ) then clockText:setFillColor( 0.7, 0.7, 1 ) timer.resume(countDownTimer) print( event.newCharacters ) end end local function textListener2( event ) if (not event.phase== "editing") then clockText:setFillColor(1,0,0) end end local function textListener3( event ) if ( event.phase == "ended" ) then clockText:setFillColor( 1, 0, 0 ) print( event.newCharacters ) end end local function updateTime() -- decrement the number of seconds secondsLeft = secondsLeft - 1 -- time is tracked in seconds. We need to convert it to minutes and seconds local minutes = math.floor( secondsLeft / 60 ) local seconds = secondsLeft % 60 if(minutes== 0 and seconds== 0) then native.setKeyboardFocus(nil) textbox.isEditable=false end -- make it a string using string format. local timeDisplay = string.format( "%01d:%02d", minutes, seconds ) clockText.text = timeDisplay end local function clickOutside() native.setKeyboardFocus(nil) end local function changescenes () composer.gotoScene("MainMenu", {effect= "fade", time= 300}) native.setKeyboardFocus(nil) end

Here the little beginner/simple code I got.

Update*- I found this code in corona about live search terms, not really sure how it is relevant. But that is what I’m asking, how I can ask corona to detect “live” typing. Thanks everybody, please let me know if you need anything.

Update**- This app is due for me by Nov.2 all help will be greatly appreciated, and ill give you a shout out at the presentation, where I have to present the app. Thanks guys.

rob · November 1, 2016, 2:04pm

Probably the best thing you can do is to set a variable when the person types (i.e. in the “editing” phase) with the current time (os.time()). Then outside of the text event listener you have an “enterFrame” Runtime event that compares the current time to the last time they typed in the field and put your coloring/field removing logic as part of that enterFrame. Something like:

local lastTyped = 0 local function checkLastTyped( event ) &nbsp; &nbsp; &nbsp; local now = os.time() &nbsp; &nbsp; &nbsp; local difference = now - lastTyped &nbsp; &nbsp; &nbsp; if difference \> 2 then &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;clockText:setFillColor(0, 1, 0) &nbsp; &nbsp; &nbsp; elseif difference \> 5 then &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;clockText:setFillColor(1, 0, 0) &nbsp; &nbsp; &nbsp; else &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;clockText:setFillColor(0, 0, 1) &nbsp; &nbsp; &nbsp; end end Runtime:addEventListener( "enterFrame",&nbsp;checkLastTyped )

or whatever logic works for you.

Then in your edited phase, just do:

lastTyped = os.time()

Rob

born2b.epic · November 2, 2016, 9:47pm

Hi Rob,

First off, I just want to say thank you so much for replying. Honestly, I am a huge fan of your work, your simplicity is amazing and many of the thing I know about Corona and Lua is thanks to you. I’m not sure if you noticed, but the timer in my code, was actually a tiny bit modified from the timer you posted (the countdown timer). All in all, getting a response from you is pretty awesome.

I have a few questions about the code and such. I modified the code a bit to get it working, since the elseif function was not working in the beginning. Every thing is working completely fine except for 2 things. I set the code up, so that is 5 seconds pass, the text inside the textbox gets deleted, and it worked. However, how can I stop this?

The second question, is not as important, but how can I sync the changes to the color with the count down timer? What I mean is that instead of the color changing midway second, it changes in the nearest second instead.

I just want to say, all of this, would not be possible without you. I will definitely be giving you a shoutout at the presentation, so is there any social media or anything you would like for me to distribute with your name?

To simplify what I am asking:
How can I stop the deletion of the text when timer is up?
How can I sync the color changes with the countdown timer?

Here’s the code, (top is countdown timer, bottom is the changing color clocktext)
I have also tried removing the event listener from Runtime when minutes and seconds reaches 0, but it does not work.

UPDATE IMPORTANT*** I just tested the app on android device and the keyboard came up, but the user was not allowed to type, please help the presentation is tomorrow.

Again, THANK YOU so much Rob.

local function updateTime() -- decrement the number of seconds secondsLeft = secondsLeft - 1 -- time is tracked in seconds. We need to convert it to minutes and seconds local minutes = math.floor( secondsLeft / 60 ) local seconds = secondsLeft % 60 if(minutes== 0 and seconds== 0) then native.setKeyboardFocus(nil) textbox.isEditable=false end -- make it a string using string format. local timeDisplay = string.format( "%01d:%02d", minutes, seconds ) clockText.text = timeDisplay end local function checkLastTyped( event ) local now = os.time() local difference = now - lastTyped if difference \> 1 then clockText:setFillColor(0.4, 1, 0.4) elseif difference == 0 then clockText:setFillColor( 0.7, 0.7, 1 ) end if difference \> 3 then clockText:setFillColor(1, 0, 0) elseif difference == 0 then clockText:setFillColor( 0.7, 0.7, 1 ) end if difference \> 8 then clockText:setFillColor(1,0,0) textbox.text="" elseif difference == 0 then clockText:setFillColor( 0.7, 0.7, 1 ) end end Runtime:addEventListener( "enterFrame", checkLastTyped )

rob · November 3, 2016, 10:58pm

There really isn’t enough code to be more helpful. If you’re using a timer to update your time, you could move your code you put in the enterFrame (or a variant of it) into your timer, so every time you change the clock, you set your text colors.

I don’t see code where you’re deleting the text, but simply don’t delete it or find another condition that deletes it.

Regarding not being able to type, make sure you’re not doing something like:

textbox.isEditable=false

at a point where you still need it editable.

Rob

rob · November 1, 2016, 2:04pm