I found this: field1:setTextColor( 255, 128, 0 ) in the APIs but I want to know if there is a way to set a different background color for the text box itself. For instance an off-white color or beige. I have a few textboxes and all the scattered bright white boxes are not aesthetically pleasing. Thanks for any help! [import]uid: 35535 topic_id: 30255 reply_id: 330255[/import]
Yes: http://developer.coronalabs.com/content/input-text-boxes
I’m not sure about a setBackgroundColor() function, but you can set a text box to have no background and just put your own background colour or image behind it. (Native inputs sit on top of all graphics elements because they are on top of the OpenGL canvas.)
AFAIK you can’t set the background for textFields, though.
The new documentation seems to omit the above information: http://docs.coronalabs.com/api/library/native/newTextBox.html [import]uid: 8271 topic_id: 30255 reply_id: 121219[/import]
The other way people handle this is to have the native text field off screen and a display object on screen and just update the text on screen as the offscreen native field updates. [import]uid: 19626 topic_id: 30255 reply_id: 121237[/import]
I’m brand new so this may be of no help, but I found your post while waiting for a reply to my own question (lol) and if I’m understanding you correctly I might have a solution.
I am making my own game and the text couldn’t be seen clearly on the screen so I created a rectangular box behind each for which you can set a fill color and even a stroke color(border). Then I just put my text over it.
Like I said I’m new so this might not be the best solution but it worked for me!
Here’s the syntax:
local rect = display.newRect(110, 100, 250, 250)
rect:setFillColor(255, 255, 255)
rect:setStrokeColor(45, 180, 100)
rect.strokeWidth = 10 [import]uid: 170524 topic_id: 30255 reply_id: 121530[/import]
Robmiracle- Do you mind explaining that once more for me? I’m thinking that if the text field is off screen, will there a way to have the user able to input his/her data and then from there update the text on screen? [import]uid: 35535 topic_id: 30255 reply_id: 121535[/import]
Yes: http://developer.coronalabs.com/content/input-text-boxes
I’m not sure about a setBackgroundColor() function, but you can set a text box to have no background and just put your own background colour or image behind it. (Native inputs sit on top of all graphics elements because they are on top of the OpenGL canvas.)
AFAIK you can’t set the background for textFields, though.
The new documentation seems to omit the above information: http://docs.coronalabs.com/api/library/native/newTextBox.html [import]uid: 8271 topic_id: 30255 reply_id: 121219[/import]
The other way people handle this is to have the native text field off screen and a display object on screen and just update the text on screen as the offscreen native field updates. [import]uid: 19626 topic_id: 30255 reply_id: 121237[/import]
You can set the input focus to the input field in code, when you detect a touch on your display object and make it look like your display object is the input field. [import]uid: 8271 topic_id: 30255 reply_id: 121908[/import]
I’m brand new so this may be of no help, but I found your post while waiting for a reply to my own question (lol) and if I’m understanding you correctly I might have a solution.
I am making my own game and the text couldn’t be seen clearly on the screen so I created a rectangular box behind each for which you can set a fill color and even a stroke color(border). Then I just put my text over it.
Like I said I’m new so this might not be the best solution but it worked for me!
Here’s the syntax:
local rect = display.newRect(110, 100, 250, 250)
rect:setFillColor(255, 255, 255)
rect:setStrokeColor(45, 180, 100)
rect.strokeWidth = 10 [import]uid: 170524 topic_id: 30255 reply_id: 121530[/import]
Robmiracle- Do you mind explaining that once more for me? I’m thinking that if the text field is off screen, will there a way to have the user able to input his/her data and then from there update the text on screen? [import]uid: 35535 topic_id: 30255 reply_id: 121535[/import]
You can set the input focus to the input field in code, when you detect a touch on your display object and make it look like your display object is the input field. [import]uid: 8271 topic_id: 30255 reply_id: 121908[/import]
So I’m working off your suggestions, but when switching between device simulators, the textsize doesn’t cross over well between the different devices. Sometime the text looks to small and other times too large. Is there a way to have a text size depending on the device used instead of a fixed value such as 20? [import]uid: 35535 topic_id: 30255 reply_id: 122914[/import]
Depending on the operating system, the background of a text field may not be a solid color by default. It may be “themed”, like how it is done in Android. In which case, it doesn’t make sense for Corona to make the background color settable.
That said, you can hide the background of the text field and show your own display object behind it. Just realize that this also hides the text field’s frame too. For example…
[lua]local textBackground = display.newRect(0, 0, 100, 30)
textBackground:setFillColor(0, 0, 0)
local textField = native.newTextField(textBackground.x, textBackground.y, textBackground.contentWidth, textBackground.contentHeight)
textField.hasBackground = false[/lua]
[import]uid: 32256 topic_id: 30255 reply_id: 122915[/import]
I was under the impression that only text boxes has the .hasBackground option. Is this a mistake?
Also I implemented what you said into the simulator but it has the same appearance in the simulator (I can still see the textField on top of the background). Is that normal? [import]uid: 35535 topic_id: 30255 reply_id: 122917[/import]
>> I was under the impression that only text boxes has the .hasBackground option.
I’ve seen our iOS code. The [lua]hasBackground[/lua] property applies to TextFields, TextBoxes, and even WebViews. I’m the Android developer here at Corona Labs, so I haven’t tested this on iOS for myself… but I know for a fact that [lua]hasBackground[/lua] is supported on these native objects on Android.
>> Also I implemented what you said into the simulator but it has the same appearance in the simulator (I can still see the textField on top of the background). Is that normal?
The Corona Simulator isn’t perfect when simulating native fields and has more limitations. I would say try it on your mobile device and see how well it works. I’m quite confident that my example code will work on an Android device.
*Fingers crossed on iOS* [import]uid: 32256 topic_id: 30255 reply_id: 122922[/import]
So I’m working off your suggestions, but when switching between device simulators, the textsize doesn’t cross over well between the different devices. Sometime the text looks to small and other times too large. Is there a way to have a text size depending on the device used instead of a fixed value such as 20? [import]uid: 35535 topic_id: 30255 reply_id: 122914[/import]
Depending on the operating system, the background of a text field may not be a solid color by default. It may be “themed”, like how it is done in Android. In which case, it doesn’t make sense for Corona to make the background color settable.
That said, you can hide the background of the text field and show your own display object behind it. Just realize that this also hides the text field’s frame too. For example…
[lua]local textBackground = display.newRect(0, 0, 100, 30)
textBackground:setFillColor(0, 0, 0)
local textField = native.newTextField(textBackground.x, textBackground.y, textBackground.contentWidth, textBackground.contentHeight)
textField.hasBackground = false[/lua]
[import]uid: 32256 topic_id: 30255 reply_id: 122915[/import]
I was under the impression that only text boxes has the .hasBackground option. Is this a mistake?
Also I implemented what you said into the simulator but it has the same appearance in the simulator (I can still see the textField on top of the background). Is that normal? [import]uid: 35535 topic_id: 30255 reply_id: 122917[/import]
>> I was under the impression that only text boxes has the .hasBackground option.
I’ve seen our iOS code. The [lua]hasBackground[/lua] property applies to TextFields, TextBoxes, and even WebViews. I’m the Android developer here at Corona Labs, so I haven’t tested this on iOS for myself… but I know for a fact that [lua]hasBackground[/lua] is supported on these native objects on Android.
>> Also I implemented what you said into the simulator but it has the same appearance in the simulator (I can still see the textField on top of the background). Is that normal?
The Corona Simulator isn’t perfect when simulating native fields and has more limitations. I would say try it on your mobile device and see how well it works. I’m quite confident that my example code will work on an Android device.
*Fingers crossed on iOS* [import]uid: 32256 topic_id: 30255 reply_id: 122922[/import]