"Slider" object (using new touch statement)

[Henko]

' SLIDER OBJECT
' usage: value=slider(title$,xtop,ytop,height,xtouch,ytouch,mode)
'    where:
'        value = return value (percentage between 0 and 100)
'        title$ = name, displayed at the bottom
'        xtop and ytop = left upper corner of slider
'        height = length of the scale in the slider
'        xtouch and ytouch = touch coordinates (when mode=0)
'        mode = 1 for creation of the slider
'        mode = 0 for polling the slider if it was touched
'        mode =-1 for removing the slider from the screen
'
' The width of a slider is fixed: 70 pixels
' The value of the slider is displayed at the top of the slider
' The amount of sliders on the screen is not restricted. Just 
' take care that they do not overlap on the screen.
'
graphics
graphics clear .8,.8,.8
fill color .8,.8,.8
draw color 0,0,0
            ' put two sliders on the screen
slider("volume",300,200,300,0,0,1)
slider("pitch",500,300,250,0,0,1)
            ' scan for screen-touch 
loop2:
if touch_y(0)=-1 then loop2
            ' and pass the x- and y- values to the sliders
xtc=touch_x(0) ! ytc=touch_y(0)
vol=slider("volume",300,200,300,xtc,ytc,0)
pit=slider("pitch",500,300,250,xtc,ytc,0)
               ' use the return values "vol" and "pit" for 
               ' whatever they serve for
goto loop2
end

def slider (tit$,xt,yt,hgt,xtouch,ytouch,ind)
xb=xt+70 ! if hgt<120 then hgt=120 ! yb=yt+hgt+70 ! dy=hgt/10
if ind=-1 then
  fill rect xt-2,yt-2 to xb+2,yb+2 ! return
  end if
if ind=1 then
  draw size 3 ! draw font size 14
  draw rect xt,yt to xb,yb
  draw line xt,yt+20 to xb,yt+20
  draw text tit$ at xt+(70-8*len(tit$))/2,yb-20
  ys=yb-30
  else
  if xtouch<xt or xtouch>xb or ytouch<yt or ytouch>yb then return
  ys=ytouch
  if ys<yt+40 then ys=yt+40 ! if ys>yb-30 then ys=yb-30
  end if
draw size 2
graphics lock
fill color .8,.8,.8 ! draw font size 14
fill rect xt+2,yt+33 to xb-2,yb-25
draw rect xt+28,yt+40 to xt+32,yb-30
y=yb-30+dy
for i=0 to 100 step 10
  y=y-dy ! i$=i
  draw line xt+24,y to xt+36,y
  draw text i$ at xt+40,y-9
  next i
fill color 0,0,.6
fill rect xt+6,ys-4 to xt+54,ys+4 ! fill color .8,.8,.8
tt=(yb-ys-30)*100/(yb-yt-70)
fill rect xt+8,yt+2 to xb-2,yt+15
draw text n2a$(tt,5,1) at xt+8,yt
graphics unlock
draw font size 20
slider=tt
end def

def n2a$(num,lang,dec)
b$="               "
fac=10^dec
num$=int(fac*num+.5)/fac
tot=lang-len(num$)
if tot<1 then tot=1
a$=substr$(b$,1,tot) & num$
n2a$=a$
end def

[Mr. Kibernetik]

These sliders cannot be used simultaneously.

[Henko]

These sliders cannot be used simultaneously.

Indeed! They are polled one after another. But i think it is a theoretical point. In practice one would operate only one slider at the time. Moreover, due to limitations of SB one could never operate more than 11 sliders simultaneously . This too is a rather theoretical case

If it were necessary, the sliders can be operated simultaneously without the need to modify the slider function.
In the main (calling) program you would define a number of sliders using arrays and the read-data mechanisms. Then working with for next loops and the touch_x(i) staement it would work. So it is a question of the calling program and not of the slider function.

COMING NEXT: the color selector program with 3 simultaneous working sliders

[Operator]

Nice portable (def) sliders...
How can I make the blue slider transparent ( alpha ) ?
Tried but made all but the blue one transparent...

[Henko]

Nice portable (def) sliders...
How can I make the blue slider transparent ( alpha ) ?
Tried but made all but the blue one transparent...

All sliders use the same function code. You "personalize" each occurance of a slider via the parameters passed in the calling statements. So, if you want one slider to use transparency and the others not so, then you have to add an extra parameter or you "trick" one of the existing parameters. In this case i would prefer not to extend the amount of parameters and looked for a suitable "trickable" parameter. I select the height parameter, the height never beiing negative. So, in the function, if "hgt" is passed negative, a flag is set and the hgt is made positive, as it should be. Just before fill statement the alpha is set if the flag is on, and set back after the fill statement.
In the calling program the height of the second slider is changed to -250 in stead of 250 in both calls.

Hereafter the modified code.
By the way, the transparency idea is a good one for all sliders, so for my own use i will add it to the function without fiddling with the parameters.

' SLIDER OBJECT
' usage: value=slider(title$,xtop,ytop,height,xtouch,ytouch,mode)
'    where:
'        value = return value (percentage between 0 and 100)
'        title$ = name, displayed at the bottom
'        xtop and ytop = left upper corner of slider
'        height = length of the scale in the slider (if passed as negative, the slider will have transparency
'        xtouch and ytouch = touch coordinates (when mode=0)
'        mode = 1 for creation of the slider
'        mode = 0 for polling the slider if it was touched
'        mode =-1 for removing the slider from the screen
'
' The width of a slider is fixed: 70 pixels
' The value of the slider is displayed at the top of the slider
' The amount of sliders on the screen is not restricted. Just 
' take care that they do not overlap on the screen.
'
graphics
graphics clear .8,.8,.8
fill color .8,.8,.8
draw color 0,0,0
            ' put two sliders on the screen
slider("volume",300,200,300,0,0,1)
slider("pitch",500,300,-250,0,0,1)
            ' scan for screen-touch 
loop2:
if touch_y(0)=-1 then loop2
            ' and pass the x- and y- values to the sliders
xtc=touch_x(0) ! ytc=touch_y(0)
vol=slider("volume",300,200,300,xtc,ytc,0)
pit=slider("pitch",500,300,-250,xtc,ytc,0)
               ' use the return values "vol" and "pit" for 
               ' whatever they serve for
goto loop2
end

def slider (tit$,xt,yt,hgt,xtouch,ytouch,ind)
if hgt<0 then
  flag=1 ! hgt=-hgt
  end if
xb=xt+70 ! if hgt<120 then hgt=120 ! yb=yt+hgt+70 ! dy=hgt/10
if ind=-1 then
  fill rect xt-2,yt-2 to xb+2,yb+2 ! return
  end if
if ind=1 then
  draw size 3 ! draw font size 14
  draw rect xt,yt to xb,yb
  draw line xt,yt+20 to xb,yt+20
  draw text tit$ at xt+(70-8*len(tit$))/2,yb-20
  ys=yb-30
  else
  if xtouch<xt or xtouch>xb or ytouch<yt or ytouch>yb then
    slider=-1
    return
    end if
  ys=ytouch
  if ys<yt+40 then ys=yt+40 ! if ys>yb-30 then ys=yb-30
  end if
draw size 2
graphics lock
fill color .8,.8,.8 ! draw font size 14
fill rect xt+2,yt+33 to xb-2,yb-25
draw rect xt+28,yt+40 to xt+32,yb-30
y=yb-30+dy
for i=0 to 100 step 10
  y=y-dy ! i$=i
  draw line xt+24,y to xt+36,y
  draw text i$ at xt+40,y-9
  next i
fill color 0,0,.6
if flag then fill alpha .5
fill rect xt+6,ys-4 to xt+54,ys+4 ! fill color .8,.8,.8
fill alpha 1
tt=(yb-ys-30)*100/(yb-yt-70)
fill rect xt+8,yt+2 to xb-2,yt+15
draw text n2a$(tt,5,1) at xt+8,yt
graphics unlock
draw font size 20
slider=tt
end def

def n2a$(num,lang,dec)
b$="               "
fac=10^dec
num$=int(fac*num+.5)/fac
tot=lang-len(num$)
if tot<1 then tot=1
a$=substr$(b$,1,tot) & num$
n2a$=a$
end def

[Operator]

Hello Henko,
thx a lot for the big explanation and solution
including alpha in the function parameters (trick).
Works fine, I just have to adapt your snippets to
my iPhone 4 screen resolution...