(Solved)Text Field

[ultraluxurylife]

I have 3 text fields on one of my screens. What coding do I need to make the fields interact with each other? I basically want the top box to subtract the lower box and enter the result in the 3rd field. Now that I’m thinking about it, the 3rd field probably shouldn’t be a text field since the person is not going to enter anything there. They are just going to see a result there. This is the coding I have.

[lua]numberField = native.newTextField( 180, 125, 120, tHeight, fieldHandler )
numberField.font = native.newFont( native.systemFontBold, inputFontSize )
numberField.inputType = “number”

numberField = native.newTextField( 180, 180, 120, tHeight, fieldHandler )
numberField.font = native.newFont( native.systemFontBold, inputFontSize )
numberField.inputType = “number”

numberField = native.newTextField( 180, 245, 120, tHeight, fieldHandler )
numberField.font = native.newFont( native.systemFontBold, inputFontSize )
numberField.inputType = “number”

– Add fields to our new group

fields:insert(numberField)[/lua] [import]uid: 72372 topic_id: 13448 reply_id: 313448[/import]

[User25689]

I haven’t used these text fields yet but try adding a listener to the second field to catch an onChange event and update the 3rd field. You might be better off to use a label for the 3rd field opposed to a text box. Example:

[lua]text1:addEventListener(“onChange”, textFunction)

function textFunction()
text3.text = text1.text - text2.text
end[/lua]

I havent tested this so I am not sure if it works but I’m sure there is a listener for a text change change event. If not, you can always have a button run the function for you. [import]uid: 63320 topic_id: 13448 reply_id: 49362[/import]

[ultraluxurylife]

Thank you! How would I do that with a button? Isn’t it the same thing? [import]uid: 72372 topic_id: 13448 reply_id: 49365[/import]

[User25689]

Yes it would look like:

[lua]button1:addEventListener(“tap”, textFunction)

function textFunction()
text3.text = text1.text - text2.text
end[/lua] [import]uid: 63320 topic_id: 13448 reply_id: 49369[/import]

[ultraluxurylife]

Okay I tried the above info and now i’m getting a Director error. I changed the wording to match mine but that may have been a mistake. This is what I wrote.

[lua]numberFieldTwo:addEventListener(“onChange”, textFunction)

function textFunction()
numberFieldFour.text = numberFieldTwo.text - numberFieldThree.text
end[/lua] [import]uid: 72372 topic_id: 13448 reply_id: 49453[/import]

[ultraluxurylife]

Any Help on this? this is my code below. I can enter data in Number Two and Number Three but of course nothing happens. I want it to automatically subtract the new numbers and enter in the 3rd space labeled number 4. I have that as an number entry box but know I should remove it.

[lua]module(…, package.seeall)

function new()
local localGroup = display.newGroup()
–> This is how we start every single file or “screen” in our folder, except for main.lua
– and director.lua
–> director.lua is NEVER modified, while only one line in main.lua changes, described in that file

---

local physics = require (“physics”)
physics.start ()

local ui = require(“ui”)

local tHeight – forward reference

local background = display.newImage (“blackbackground.png”)
background.x = 240
localGroup:insert(background)
–> This sets the background

local screen6 = display.newImage (“screen6.png”)
screen6.x = 240
localGroup:insert(screen6)
–> This sets Screen6

---

– General event handler for fields

– You could also assign different handlers for each textfield

local function fieldHandler( event )

if ( “began” == event.phase ) then
– This is the “keyboard has appeared” event
– In some cases you may want to adjust the interface when the keyboard appears.

elseif ( “ended” == event.phase ) then
– This event is called when the user stops editing a field: for example, when they touch a different field

elseif ( “submitted” == event.phase ) then
– This event occurs when the user presses the “return” key (if available) on the onscreen keyboard

– Hide keyboard
native.setKeyboardFocus( nil )
end

end

– Predefine local objects for use later
local numberField, numberFieldTwo, numberFieldThree, numberFieldFour, difference
local fields = display.newGroup()

---

– Create a Background touch event

– Tapping screen dismisses the keyboard

– Needed for the Number textField since there is
– no return key to clear focus.

local listener = function( event )
– Hide keyboard
print(“tap pressed”)
native.setKeyboardFocus( nil )
end

– Determine if running on Corona Simulator

local isSimulator = “simulator” == system.getInfo(“environment”)

– Native Text Fields not supported on Simulator

if isSimulator then
msg = display.newText( “Native Text Fields not supported on Simulator!”, 0, 280, “Verdana-Bold”, 12 )
msg.x = display.contentWidth/2 – center title
msg:setTextColor( 255,255,0 )
end

– Add listener to background for user “tap”
screen6:addEventListener( “tap”, listener )

local house = display.newImage (“house.png”)
house.x = 45
house.y = 35
house.xScale = .5
house.yScale = .5
localGroup:insert(house)
–>This places the House

local function touchedHouse (event)
if (“ended” == event.phase) then
director:changeScene (“titlescreen”)
media.playEventSound( “click_x.caf” )
end
end

house:addEventListener (“touch”, touchedHouse)
– Handlers for login dialog UI

local function onnumberFieldTwo( event )
if ( “began” == event.phase ) then
– Note: this is the “keyboard appearing” event
– In some cases you may want to adjust the interface while the keyboard is open.

elseif ( “ended” == event.phase ) then
– Automatically tab to numberFieldThree if user taps screen (convenient!)
native.setKeyboardFocus( numberFieldThree )

end
end

local function onnumberFieldThree( event )
– Hide keyboard when the user taps the screen
if ( “ended” == event.phase ) then
native.setKeyboardFocus( nil )

end
end

local smallbrain = display.newImage (“smallbrain.png”)
smallbrain.x = 425
smallbrain.y = 275
smallbrain.xScale = .5
smallbrain.yScale = .5
localGroup:insert(smallbrain)
–>This places the brain
local function touchedSmallbrain (event)
if (“ended” == event.phase) then
director:changeScene (“screen7a”)
media.playEventSound( “click_x.caf” )
end
end

smallbrain:addEventListener (“touch”, touchedSmallbrain)

local backbutton = display.newImage (“backbutton.png”)
backbutton.x = 60
backbutton.y = 280
backbutton.xScale = .4
backbutton.yScale = .4
localGroup:insert(backbutton)
local function touchedBackbutton (event)
if (“ended” == event.phase) then
director:changeScene (“screen5”)
media.playEventSound( “click_x.caf” )
end
end

backbutton:addEventListener (“touch”, touchedBackbutton)
–>This places the backbutton

---

– *** Create native input textfields ***

– Note: currently this feature works in device builds or Xcode simulator builds only

– Note: currently this feature works in device builds only
local isAndroid = “Android” == system.getInfo(“platformName”)
local inputFontSize = 30
local inputFontHeight = 30
tHeight = 50

if isAndroid then
– Android text fields have more chrome. It’s either make them bigger, or make the font smaller.
– We’ll do both
inputFontSize = 30
inputFontHeight = 30
tHeight = 50
end

numberFieldTwo = native.newTextField( 180, 125, 120, tHeight, fieldHandler )
numberFieldTwo.font = native.newFont( native.systemFontBold, inputFontSize )
numberFieldTwo.inputType = “number”

numberFieldThree = native.newTextField( 180, 180, 120, tHeight, fieldHandler )
numberFieldThree.font = native.newFont( native.systemFontBold, inputFontSize )
numberFieldThree.inputType = “number”

numberFieldFour = native.newTextField( 180, 245, 120, tHeight, fieldHandler )
numberFieldFour.font = native.newFont( native.systemFontBold, inputFontSize )
numberFieldFour.inputType = “number”

– Add fields to our new group

fields:insert(numberFieldTwo)
fields:insert(numberFieldThree)
fields:insert(numberFieldFour)

–>MUST return a display.newGroup()

---

–> This is how we end every file except for director and main, as mentioned in my first comment

return localGroup

end[/lua] [import]uid: 72372 topic_id: 13448 reply_id: 49618[/import]

[User25689]

Try putting the subtraction function in the keyboard “submitted” event phase. That way it runs the function as the user dismisses the keyboard. [import]uid: 63320 topic_id: 13448 reply_id: 49633[/import]

[ultraluxurylife]

Okay I have moved the subtraction piece around to several different places. I’m not getting an error now but it is still not working. Basically my screen comes up and I can enter numbers in the first two fields and dismiss the keyboard and nothing happens. How should the box be where I want the number to appear? Should it be a textfield also? I don’t want a person to enter anything on fieldNumberFour. I just want the answer to appear there. Lastly if I don’t have a text field, how do I identify the font and color when the answer does come up? Please take a look at my code and let me know what’s wrong.

[lua]module(…, package.seeall)

function new()
local localGroup = display.newGroup()
–> This is how we start every single file or “screen” in our folder, except for main.lua
– and director.lua
–> director.lua is NEVER modified, while only one line in main.lua changes, described in that file

---

local physics = require (“physics”)
physics.start ()

local ui = require(“ui”)

local tHeight – forward reference

local background = display.newImage (“blackbackground.png”)
background.x = 240
localGroup:insert(background)
–> This sets the background

local screen6 = display.newImage (“screen6.png”)
screen6.x = 240
localGroup:insert(screen6)
–> This sets Screen6

---

– General event handler for fields

– You could also assign different handlers for each textfield

local function fieldHandler( event )

if ( “began” == event.phase ) then
– This is the “keyboard has appeared” event
– In some cases you may want to adjust the interface when the keyboard appears.

elseif ( “ended” == event.phase ) then
– This event is called when the user stops editing a field: for example, when they touch a different field

elseif ( “submitted” == event.phase ) then
– This event occurs when the user presses the “return” key (if available) on the onscreen keyboard

– Hide keyboard
native.setKeyboardFocus( nil )
end

end

– Predefine local objects for use later
local numberField, numberFieldTwo, numberFieldThree, numberFieldFour, difference, textFunction
local fields = display.newGroup()

---

– Create a Background touch event

– Tapping screen dismisses the keyboard

– Needed for the Number textField since there is
– no return key to clear focus.

local listener = function( event )
– Hide keyboard
print(“tap pressed”)
native.setKeyboardFocus( nil )
end

– Determine if running on Corona Simulator

local isSimulator = “simulator” == system.getInfo(“environment”)

– Native Text Fields not supported on Simulator

if isSimulator then
msg = display.newText( “Native Text Fields not supported on Simulator!”, 0, 280, “Verdana-Bold”, 12 )
msg.x = display.contentWidth/2 – center title
msg:setTextColor( 255,255,0 )
end

– Add listener to background for user “tap”
screen6:addEventListener( “tap”, listener )

local house = display.newImage (“house.png”)
house.x = 45
house.y = 35
house.xScale = .5
house.yScale = .5
localGroup:insert(house)
–>This places the House

local function touchedHouse (event)
if (“ended” == event.phase) then
director:changeScene (“titlescreen”)
media.playEventSound( “click_x.caf” )
end
end

house:addEventListener (“touch”, touchedHouse)
– Handlers for login dialog UI

local function onnumberFieldTwo( event )
if ( “began” == event.phase ) then
– Note: this is the “keyboard appearing” event
– In some cases you may want to adjust the interface while the keyboard is open.

elseif ( “ended” == event.phase ) then
– Automatically tab to numberFieldThree if user taps screen (convenient!)
native.setKeyboardFocus( numberFieldThree )

numberFieldTwo:addEventListener(“onChange”, textFunction)

end
end

local function onnumberFieldThree( event )
– Hide keyboard when the user taps the screen
if ( “ended” == event.phase ) then
native.setKeyboardFocus( nil )
end

end

local function onnumberFieldFour( event )
– Hide keyboard when the user taps the screen
if ( “ended” == event.phase ) then
native.setKeyboardFocus( nil )

local function textFunction()
numberFieldFour.text = numberFieldTwo.text - numberFieldThree.text

end

end
end

local smallbrain = display.newImage (“smallbrain.png”)
smallbrain.x = 425
smallbrain.y = 275
smallbrain.xScale = .5
smallbrain.yScale = .5
localGroup:insert(smallbrain)
–>This places the brain
local function touchedSmallbrain (event)
if (“ended” == event.phase) then
director:changeScene (“screen7a”)
media.playEventSound( “click_x.caf” )
end
end

smallbrain:addEventListener (“touch”, touchedSmallbrain)

local backbutton = display.newImage (“backbutton.png”)
backbutton.x = 60
backbutton.y = 280
backbutton.xScale = .4
backbutton.yScale = .4
localGroup:insert(backbutton)
local function touchedBackbutton (event)
if (“ended” == event.phase) then
director:changeScene (“screen5”)
media.playEventSound( “click_x.caf” )
end
end

backbutton:addEventListener (“touch”, touchedBackbutton)
–>This places the backbutton

---

– *** Create native input textfields ***

– Note: currently this feature works in device builds or Xcode simulator builds only

– Note: currently this feature works in device builds only
local isAndroid = “Android” == system.getInfo(“platformName”)
local inputFontSize = 30
local inputFontHeight = 30
tHeight = 50

if isAndroid then
– Android text fields have more chrome. It’s either make them bigger, or make the font smaller.
– We’ll do both
inputFontSize = 30
inputFontHeight = 30
tHeight = 50
end

numberFieldTwo = native.newTextField( 180, 125, 120, tHeight, fieldHandler )
numberFieldTwo.font = native.newFont( native.systemFontBold, inputFontSize )
numberFieldTwo.inputType = “number”

numberFieldThree = native.newTextField( 180, 180, 120, tHeight, fieldHandler )
numberFieldThree.font = native.newFont( native.systemFontBold, inputFontSize )
numberFieldThree.inputType = “number”

numberFieldFour = native.newTextField( 180, 245, 120, tHeight, fieldHandler )
numberFieldFour.font = native.newFont( native.systemFontBold, inputFontSize )
numberFieldFour.inputType = “number”

– Add fields to our new group

fields:insert(numberFieldTwo)
fields:insert(numberFieldThree)
fields:insert(numberFieldFour)

–>MUST return a display.newGroup()

---

–> This is how we end every file except for director and main, as mentioned in my first comment

return localGroup

end[/lua] [import]uid: 72372 topic_id: 13448 reply_id: 49725[/import]

[User25689]

Putting the function in the keyboard submitted event should work fine. Can you submit you main.lua to Pastie so I can run it in my simulator? [import]uid: 63320 topic_id: 13448 reply_id: 49801[/import]

[ultraluxurylife]

I will have to do around 7 this evening. I’m not at my computer at the moment but will do it then. [import]uid: 72372 topic_id: 13448 reply_id: 49802[/import]

[ultraluxurylife]

this is my main file

[lua]module(…, package.seeall)

function new()
local localGroup = display.newGroup()
–> This is how we start every single file or “screen” in our folder, except for main.lua
– and director.lua
–> director.lua is NEVER modified, while only one line in main.lua changes, described in that file

---

local physics = require (“physics”)
physics.start ()
local background = display.newImage (“blackbackground.png”)
background.x = 240
localGroup:insert(background)
–> This sets the background

local titlescreen = display.newImage (“titlescreen.png”)
titlescreen.x = 240
localGroup:insert(titlescreen)
–> This sets the titlescreen
local brain = display.newImage (“brain.png”)
brain.x = 240
brain.y = 220
brain.xScale = .5
brain.yScale = .5
localGroup:insert(brain)
–>This places the brain

local function touchedBrain (event)
if (“ended” == event.phase) then
media.playEventSound( “click_x.caf” )
director:changeScene(“screen2”) – director should clean up the rest
cleanUp() – Call the cleanUp function to remove what director can’t

end
end

brain:addEventListener (“touch”, touchedBrain)

–>MUST return a display.newGroup()

---

–> This is how we end every file except for director and main, as mentioned in my first comment

return localGroup

end[/lua] [import]uid: 72372 topic_id: 13448 reply_id: 49830[/import]

[ultraluxurylife]

dacriburden,
Did it work for you? [import]uid: 72372 topic_id: 13448 reply_id: 49984[/import]

[User25689]

Maybe it is a conflict with director. Unfortunately I haven’t used director before so I wont be able to help much there. [import]uid: 63320 topic_id: 13448 reply_id: 49996[/import]

[ultraluxurylife]

One thing I see that is wrong with my coding is calling out the location for the result to be. How do I do that? It’s not an object, so would I just display text field? I was calling it number 4 and it was a number filed but that’s not what I need. I just need a place to locate the result. The x, y, coordinates for that location is 180, 245. So I would need to identify the location and then put your text above? [import]uid: 72372 topic_id: 13448 reply_id: 50002[/import]

[renvis1]

The problems I found with your code are

1. you are forward referencing textFunction but in function declaration you are re declaring it with local. remove the local keyword from textFunction declaration.

2. you have declared 3 field handlerfunctions for the 3 textboxes but the textboxes are linked to the function fieldHandler.that leaves the 3 field handling functions you created as unlinked and never called.
   so you have to create your textbox like this
   [lua]numberFieldFour = native.newTextField( 180, 245, 120, tHeight, onnumberFieldFour )[/lua] [import]uid: 71210 topic_id: 13448 reply_id: 50088[/import]

[peach_pellen]

Hey,

As I said in http://developer.anscamobile.com/forum/2011/08/07/native-keyboard-2#comment-50147 - the actual sum may not work without using tonumber() - that is what I found when making my template. [import]uid: 52491 topic_id: 13448 reply_id: 50149[/import]

[ultraluxurylife]

Peach,

How do you use tonumber? I tried this yesterday and it was obviously wrong. Is there a certain way to set it up or a specific location

[lua]function handlerFunction()
MyResult = tonumber(numberFieldTwo.text) - tonumber(numberFieldThree.text)
numberFieldFour.text = MyResult[/lua]

Michelle [import]uid: 72372 topic_id: 13448 reply_id: 50168[/import]

[renvis1]

i tried the code that i have send to you and its working properly. just make the changes that I have mentioned in my previous post.

[lua]local localGroup = display.newGroup()

local ui = require(“ui”)

– Predefine local objects for use later
local numberField, numberFieldTwo, numberFieldThree, numberFieldFour, difference, textFunction
local fields = display.newGroup()
local inputFontSize = 30
local inputFontHeight = 30
local tHeight = 50

– Tapping screen dismisses the keyboard
local listener = function( event )
– Hide keyboard
print(“tap pressed”)
native.setKeyboardFocus( nil )
end
Runtime:addEventListener( “tap”, listener )
– Determine if running on Corona Simulator – Native Text Fields not supported on Simulator
local isSimulator = “simulator” == system.getInfo(“environment”)
if isSimulator then
msg = display.newText( “Native Text Fields not supported on Simulator!”, 0, 280, nil, 12 )
msg.x = display.contentWidth/2 – center title
msg:setTextColor( 255,255,0 )
end

local function onnumberFieldTwo( event )
if ( “ended” == event.phase ) or ( “submitted” == event.phase ) then
native.setKeyboardFocus( numberFieldThree )
numberFieldFour.text = numberFieldTwo.text - numberFieldThree.text
end
end
local function onnumberFieldThree( event )
if ( “ended” == event.phase ) or ( “submitted” == event.phase ) then
native.setKeyboardFocus( nil )
numberFieldFour.text = numberFieldTwo.text - numberFieldThree.text
end
end

local function onnumberFieldFour( event )
if ( “ended” == event.phase ) or ( “submitted” == event.phase ) then
native.setKeyboardFocus( nil )
numberFieldFour.text = numberFieldTwo.text - numberFieldThree.text
end
end

function textFunction()
numberFieldFour.text = numberFieldTwo.text - numberFieldThree.text
end

numberFieldTwo = native.newTextField( 180, 125, 120, tHeight, onnumberFieldTwo )
numberFieldTwo.font = native.newFont( native.systemFontBold, inputFontSize )
numberFieldTwo.inputType = “number”

numberFieldThree = native.newTextField( 180, 180, 120, tHeight, onnumberFieldThree )
numberFieldThree.font = native.newFont( native.systemFontBold, inputFontSize )
numberFieldThree.inputType = “number”

numberFieldFour = native.newTextField( 180, 245, 120, tHeight, onnumberFieldFour )
numberFieldFour.font = native.newFont( native.systemFontBold, inputFontSize )
numberFieldFour.inputType = “number”

– Add fields to our new group

fields:insert(numberFieldTwo)
fields:insert(numberFieldThree)
fields:insert(numberFieldFour)
numberFieldTwo:addEventListener(“onChange”, textFunction)
numberFieldThree:addEventListener(“onChange”, textFunction)[/lua] [import]uid: 71210 topic_id: 13448 reply_id: 50171[/import]

[ultraluxurylife]

I just tried and they are working GREAT! Thank you so much!!

One problem I am having though is that when I go to the next screen after that information is entered. The boxes still show up. Do I have to put a remove listener somewhere or something?

Michelle [import]uid: 72372 topic_id: 13448 reply_id: 50176[/import]

[renvis1]

you are returning localGroup from the new() function. so to remove the objects automatically you should add your textfields to localGroup. [import]uid: 71210 topic_id: 13448 reply_id: 50179[/import]