Hi, I’ve searched the forum and this is the only Scrollbox example I’ve found. Has anyone found any other examples I may use to help me learn?
@Ignatz, thanks! It has some future stuff I need like switches, but Not a scroll box from what I’ve seen.
@FearMe2142 Here’s a small example of a scroll box. Slide your finger up or down in the box to scroll the text. Double tap in the box to show the keyboard. When you start to key text, the text in the scroll box will shift so the text is entered at the bottom of the box. One thing you need to know is if the height of all the text exceeds 1024 pixels, all the text will disappear. That’s a limit of the text command. Since I don’t know what plans you have for this, I just did the basics.
displayMode(FULLSCREEN)
function setup()
textMode(CORNER)
fontSize(12)
str=readProjectTab("Main")
x,y=200,400
w,h=200,300
sw=2
textWrapWidth(w)
dy=0
end
function draw()
background(0)
noFill()
stroke(255)
strokeWidth(sw)
rect(x-sw,y-sw,w+sw*2,h+sw*2)
clip(x,y,w,h)
fill(255)
text(str,x,y+dy)
end
function touched(t)
if t.x>x and t.x<x+w and t.y>y and t.y<y+h then
if t.tapCount==2 then
if not showKeyboard() then
showKeyboard()
end
end
if t.state==MOVING then
dy=dy+t.deltaY
end
end
end
function keyboard(k)
if k==BACKSPACE then
str=string.sub(str,1,string.len(str)-1)
else
dy=0
str=str..k
end
end
@dave1707 so if I made each line in the box a string in a table
Line = {}
Would that fix the text problem?
I will need it to be able to do more than 1024 in pixels
And that was a perfect example!!! Thank you!!!
@FearMe2142 Here’s a version that uses a scroll class just in case you need more that 1 scroll box. You might be able to use a line table, but then you’ll have to do the calculations on line breaks to keep it within the scroll box width. I wasn’t sure how much text you would be putting in the scroll box, that’s why I did it the easy way.
displayMode(FULLSCREEN)
function setup()
textMode(CORNER)
temp=readProjectTab("Main") -- something to display
temp=string.sub(temp,1,400) -- only use the first 400 characters
fontSize(12)
scr={} -- scroll table
table.insert(scr,scroll(100,400,100,300))
table.insert(scr,scroll(400,400,200,300))
end
function draw()
background(0)
for a,b in pairs(scr) do
b:draw()
end
end
function touched(t)
for a,b in pairs(scr) do
b:touched(t)
end
end
function keyboard(k)
for a,b in pairs(scr) do
b:keyboard(k)
end
end
scroll=class()
function scroll:init(x,y,w,h)
self.x=x
self.y=y
self.w=w
self.h=h
self.sw=2
self.dy=0
self.selected=false
self.color=color(255)
self.str=temp -- something to display
end
function scroll:draw()
textWrapWidth(self.w)
noFill()
stroke(self.color)
strokeWidth(self.sw)
rect(self.x-self.sw,self.y-self.sw,self.w+self.sw*2,self.h+self.sw*2)
clip(self.x,self.y,self.w,self.h)
fill(255)
text(self.str,self.x,self.y+self.dy)
clip()
end
function scroll:touched(t)
self.selected=false
self.color=color(255)
if t.x>self.x and t.x<self.x+self.w and t.y>self.y and t.y<self.y+self.h then
self.selected=true
self.color=color(255,0,0)
if t.tapCount==2 then
if not showKeyboard() then
showKeyboard()
end
end
if t.state==MOVING then
self.dy=self.dy+t.deltaY
end
end
end
function scroll:keyboard(k)
if not self.selected then
return
end
if k==BACKSPACE then
self.str=string.sub(self.str,1,string.len(self.str)-1)
else
self.dy=0
self.str=self.str..k
end
end
@FearMe2142 Here’s a quick example that uses a table. It’s not very good, but I don’t have time to make it better right now. It won’t have the 1024 pixel problem but it needs work on the scrolling part to speed it up.
function setup()
fontSize(12)
textMode(CORNER)
str=readProjectTab("Main")
str=str..str
str=str..str -- make a long string to display
str1=""
tab={}
tab1={}
wid=200
dy=0
end
function draw()
background(40, 40, 50)
noFill()
stroke(255)
strokeWidth(2)
rect(100,300,wid,400)
clip(100,300,wid,400)
tw=0
tab1={}
fill(255)
for z=1,string.len(str) do
v=string.sub(str,z,z)
w,h=textSize(v)
if tw+w>wid or v=="\
" then
table.insert(tab1,str1)
str1=v
tw=0
else
tw=tw+w
str1=str1..v
end
end
th=0
for a,b in pairs(tab1) do
w,h=textSize(b)
text(b,100,700-th+dy)
th=th+h/2
end
end
function touched(t)
if t.state==MOVING then
dy=dy+t.deltaY
end
end
@dave1707 thanks for all the help Dave! also creating a table that holds each lines does allow the box to hold more pixels.
Would you happen to know in a string.find() if there is an end index? I know I can chose to start the search, but I need it to end early as well. I’ve googled string.finds and haven’t found anything with that yet either. Cheers.
@FearMe2142 There isn’t an end indicator on string.find, just a start value. I’m not sure if this would help, but if you’re not searching a really big section, you could use string.sub to copy a section of the larger string into a temporary string and do a string.find on the temporary string. I have a better example of the above scroll box code using a table that I’ll post once I clean it up. I have a lot going on today and tomorrow, so I’m not sure how soon it will be.
I’m not sure whether this would help, but $
at the end of a pattern anchors that search to the end of the string
@dave1707 oh that’s fine! I’d like to say I really appreciate how helpful everyone is here! I will be really excited to show my final product when it’s done. Hopefully by the end of this year is what I’m shooting for.
@FearMe2142 Here’s the updates version of the scroll box. This version allow you to vary the width and height of the box. I also changed the way I determine how many characters fit in the box width. When using textSize, it returns a rounded up value of the characters width. That results in sometimes not enough characters being put in a line because all the rounding values were added. By checking a string width as a character is added, then the string is filled with enough characters to fit the width. I don’t know it you want to use anything in this version, but it was fun to write.
function setup()
parameter.watch("st")
fs=10
fontSize(fs)
textMode(CORNER)
str=readProjectTab("Main") -- something to display
str=str..str
str=str..str
str=str..str -- make the string even larger
str1=""
st=1
x,y=200,100 -- x,y position of bottom left corner
parameter.integer("recWidth",25,300,100,set)
parameter.integer("recHeight",100,650,300,set)
resizeTab()
end
function set()
resize=0 -- resize sliders are being moved
end
function resizeTab() -- resize the string to fit in scroll box
lines=recHeight/fs-1 -- number of lines in rectangle
tab={}
str1=""
temp=""
-- determine number of characters that fit in rectangle width
for z=1,string.len(str) do
v=string.sub(str,z,z)
temp=temp..v
w1,h1=textSize(temp)
if z==string.len(str) then
table.insert(tab,temp)
elseif v=="\
" then
table.insert(tab,str1)
str1=""
temp=""
elseif w1>recWidth then
table.insert(tab,str1)
str1=v
temp=v
else
str1=str1..v
end
end
output.clear()
print(string.len(str).." characters") -- characters in string
print(#tab.." table lines") -- number of entries in table
end
function draw()
background(40, 40, 50)
if resize<4 then -- delay resizing while changing rectangle size
resize=resize+1
if resize==4 then
resizeTab()
resize=5
end
end
noFill()
stroke(255)
strokeWidth(2)
rect(x-2,y-2,recWidth+4,recHeight+4)
clip(x,y,recWidth,recHeight)
fill(255)
if #tab>0 then
th=0
st=math.max(st,1)//1
en=math.min(st+lines,#tab)
for z=st,en do
th=th+fs
text(tab[z],x,y+recHeight-th)
end
end
clip()
end
function touched(t)
if t.state==MOVING then
st=st+t.deltaY/5
end
end