Hello
Can I display a text box in Codea.
For example:
The user can enter a number. (IF-structure)
and what is the code please?
thanks!
Hello
Can I display a text box in Codea.
For example:
The user can enter a number. (IF-structure)
and what is the code please?
thanks!
Does it need to be simple or does it need to look nice?
simple it’s for children (secondary school)
to learn the IF-structure
Ill see what I can do for you, class structure or in main code?
main code
the children learn programming
it are the first lessons…
How’s this:
function setup()
--Set starting variables of the text box
pos = vec2(WIDTH/2,HEIGHT-200)
size = vec2(200,35)
startertxt = "Enter a number"
txt = startertxt
editing = false
--Create a table to store values in.
texttbl = {}
end
function touched(t)
--Localise the position and size, makes variables shorter and quicker in a function
local p,s = pos,size
--Check if the touch position (t.x,t.y) is inside the box, we go out half (1/2) the size in
--each direction to create a box
if t.x > p.x-s.x/2 and t.x < p.x+s.x/2 and t.y > p.y-s.y/2 and t.y < p.y+s.y/2 then
--Check that the touch state has began
if t.state == BEGAN then
--Set text editing to true
editing = true
--Show the keyboard to start typing
showKeyboard()
end
else
--The else statement here means that all code below is executed if the touch is outside
--the text box
--Check if the touch has began and the text box is being edited.
if t.state == BEGAN and editing == true then
--Set editing to false and hide the keyboard
editing = false
hideKeyboard()
end
end
end
function draw()
local p,s = pos,size
background(150,255)
--Enclose the drawing parameters (strokeWidth,fill,stroke) inside a style
pushStyle()
--Set draw style
strokeWidth(5)
stroke(0,255)
fill(255,200)
--Draw box
rect(p.x-s.x/2,p.y-s.y/2,s.x,s.y)
--Change text colour according to whether the text box is editing or not.
if editing == true then
--Trig coming up, this use of sine allows us to make flashing text.
local n = math.sin(ElapsedTime*10)*75+25
fill(50+n,255)
elseif editing == false then
fill(50,255)
end
--The elseif statement is different to else in the case that if the first statement does
--not pass then it will go to the elseif and if the criteria matches the statement it will
--execute, but if the first statement does pass, the second will be ignored completely.
--Wrap text if bigger than the size of the box
textWrapWidth(s.x)
--Set the draw mode of the text to corner, same as rectangle.
textMode(CORNER)
fontSize(20)
--Draw text
text(txt,p.x-s.x/2+5,p.y-s.y/2+7.5)
popStyle()
for k,v in pairs(texttbl) do
fill(255,0,0)
text(v,pos.x,pos.y-s.y/2-30*k)
end
end
function keyboard(k)
--If the text box is not being edited then hide the keyboard (if it is still open) and return
--nothing on the function to stop it being executed any further.
if editing == false then hideKeyboard() return end
--Check that the text in the text box is not the same as the default text
if txt == startertxt then
txt = ""
end
if k == "\
" then
--Stop editing and hide keyboard if the enter key (represented by "\
") is pressed
editing = false
hideKeyboard()
--Check if the text entered in the box is not blank
if txt ~= "" then
--Add the text to a table then set it back to default
table.insert(texttbl,txt)
txt = startertxt
end
--The use of return can come in handy when we want to cut functions short, so if the
--enter key (\
) is pressed then we wont execute the rest of the keyboard function
return
end
--Add character to the string 'txt'
txt = txt..k
if txt == startertxt or string.sub(txt,1,txt:len()-1) == startertxt then
txt = k or ""
end
--If the key pressed is the back key the remove the last character from the string
if k == BACKSPACE then
txt = string.sub(txt,1,txt:len()-1)
end
end
Documented it as well as I could, not the best teacher around…
@AnnSophie Here’s something I posted for someone else, but I don’t remember who.
displayMode(FULLSCREEN)
function setup()
str = ""
col=color(255,0,0) --box color
x=300 -- position of box x value
y=500 -- y value
w=200 -- width of box
h=50 -- height of box
l=x-w/2 -- left side of box
r=x+w/2 -- right side
b=y-h/2 -- bottom
t=y+h/2 -- top
end
function draw()
background(30,30,0,255)
strokeWidth(6)
rectMode(CENTER)
textMode(CENTER)
fill(255)
text("Tap button then input data",x,700)
text("Press RETURN to show input",x,650)
text("Enter value",x,550)
fill(col)
rect(x,y,w,h) -- input area
fill(255)
if keyboardBuffer() ~= nil then
text(keyboardBuffer(),x,500) -- show data as it is keyed
else
text(str,x,500) -- show data in input area
end
text(str,x,y-100)
end
function touched() -- check if input area was touched
if CurrentTouch.x > l and CurrentTouch.x < r then
if CurrentTouch.y > b and CurrentTouch.y < t then
showKeyboard()
col=color(128,0,0) -- change color of box
end
end
end
function keyboard(key) -- move keyboard buffer to str when return is pressed
if key == RETURN then
str = keyboardBuffer()
hideKeyboard()
col=color(255,0,0) -- change color of box
end
end
it’s to difficult for the children.
I mean…
In Visual Basic you must type:
System.Console.Write (“Type a number:”)
number1 = System.Console.Readline ()
something like that?
You want a premade class then, its harder to create stuff like that than it is on visual
You could use the output pane.
print("Type a number in the box above")
parameter.text("number")
This stores whatever they type as number
(but note that it is dynamically updated so there’s no need to press “return”).
I made a calculator app once, if you want, I can share the code, you can only type numbers and the operations, though.
@AnnSophie If you want a basic type language, try “techBASIC”. That might be easier for them to try programming.