Issues trying to create tabbed pages

[SBRuss]

Hi all,

I'm having some issues with my first program. I'm trying to create a set of pages with buttons on, and using a tab-like interface along the top to swap between the pages. I want to be able to press a given tab to swap to that page of buttons, along with a relevant visual indicator to the page and tabs (such as a colour change) to indicate the swap.

I was creating each panel and tab separately by drawing on the graphics screen, then creating a new sprite from the image area where the actual tab is. I can get that working OK, but the problem is with the sprites being inside the tabs, are, they are covered up each time I make the new page active.

The first thing that surprised me was that, even though the sprite images on non-active pages are are covered up graphically, I can still test SPRITE HIT against them, and it succeeds? Does that mean SPRITE HIT is independent of the active page?

Secondly, is it possible to make a portion of the page transparent? I guess what I need is an alpha mask so I can make most of the page opaque, but leave a transparent section at the top so you can see through to all the sprite tabs on the pages underneath the active page?

My other option I guess is to make a sepaarte page just for the tabs along the top. As long as SPRITE HIT is active page independent, then I don't need that tab page active to do the hit test, and then I can make all my other button pages below the tabs page so they don't get covered up.

Does that make sense? Anyone have any better suggestions on how to approach the problem?

Thanks.
Russell.

[Mr. Kibernetik]

The first thing that surprised me was that, even though the sprite images on non-active pages are are covered up graphically, I can still test SPRITE HIT against them, and it succeeds? Does that mean SPRITE HIT is independent of the active page?

Yes.

Secondly, is it possible to make a portion of the page transparent? I guess what I need is an alpha mask so I can make most of the page opaque, but leave a transparent section at the top so you can see through to all the sprite tabs on the pages underneath the active page?

By default page is transparent in any place which is not used by an object.

[SBRuss]

By default page is transparent in any place which is not used by an object.

OK given the clarification on SPRITE HIT, I've refactored to a separate page just for the tabs, and it seems to be going OK.

I'm confused about your above comment though, although it doesn't effect what I'm currently doing. My example currently has two pages overlayed, but a button on each page on different places, and different page colours. I hide one and show the other when swapping. When I swap between the pages, I can only see the button on the current page, not the one on the hidden page as well. I tried removing the hide commands and changed show to set, jus tto activate the one I want to use, but that stopped my hit tests working as well.

[Mr. Kibernetik]

By default page is transparent in any place which is not used by an object.

OK given the clarification on SPRITE HIT, I've refactored to a separate page just for the tabs, and it seems to be going OK.

I'm confused about your above comment though, although it doesn't effect what I'm currently doing. My example currently has two pages overlayed, but a button on each page on different places, and different page colours. I hide one and show the other when swapping. When I swap between the pages, I can only see the button on the current page, not the one on the hidden page as well. I tried removing the hide commands and changed show to set, jus tto activate the one I want to use, but that stopped my hit tests working as well.

Setting page color affects all page.
As by default page is transparent then you can cover any part of your page with proper objects to make it non-transparent there.
You were speaking about some mask, so you can easily use such mask to make page non-transparent in any place. You can use sprite for this purpose.

[SBRuss]

Ahh OK, I didn't think page colour would act like an object. I commented the COLOR option and you are correct, all buttons show through, not that that is what I want, but good to know how it works.

I did think of using a sprite to make a mask, but I didn't want multiple whole-screen sprites active, as I figured that may cause a performance impact.

Anyway, it's all working as needed for now, so thanks for the quick replies.

Russell.

[Mr. Kibernetik]

I did think of using a sprite to make a mask, but I didn't want multiple whole-screen sprites active, as I figured that may cause a performance impact.

Anyway, any mask would be a bitmap taking its resources.

[Dav]

I was making something like that using buttons the other day. I never finished it. You can have the code if you want. Hope there's something useful in there. I didn't get to work on the delete page part of it yet. Here it is:

- Dav

Code: Select all

option base 1
set buttons custom

maxpages=10 ' allow 10 pages

pagenums=1
currentpage=1

sw= screen_width()!sh=screen_height()

'assign tabs a browser number

dim tabs(maxpages)

for t=1 to maxpages
  tabs(t)=t
  browser str$(t) url "" at 0,60 size sw,sh-60
  s$="document.write("&q$&str$(t)&q$&")"
  u$=browser_text$(str$(t),s$)
  browser str$(t) hide
next t

'so tab(1)= browser 1, etc...

gosub updatepages

browser "1" show

do

   if button_pressed("+") and pagenums < 10 then
      pagenums = pagenums+1
      currentpage=pagenums
      browser str$(currentpage) show
      gosub updatepages
   end if

   if button_pressed("x") then
      button currentpage delete
      browser currentpage hide
      pagenums = pagenums-1
      currentpage=currentpage-1
      if currentpage<1 then currentpage=1
      browser currentpage show
      gosub updatepages
   end if

   'check for button press
   for tt = 1 to pagenums
     if button_pressed(str$(tt)) then
        currentpage = tt
        gosub hidebrowsers
        browser str$(currentpage) show 
        gosub updatepages
        break
     end if
   next tt

until 0

end

updatepages:

fill color 1,1,1
draw color 0,0,0

for t = 1 to maxpages
   if t <= pagenums then
      button t text str$(t) at t*60, 10 size 50,50
   else
      button t delete
   end if
   
next t

button "x" text "x" at (pagenums+1)*60, 20 size 35,35
button "+" text "+" at (pagenums+1)*60+40, 20 size 35,35

fill color .5,.5,1
draw color 1,1,1
button currentpage text str$(currentpage) at currentpage*60,10 size 50,50

if pagenums = 1 then button "x" delete
if pagenums = 10 then button "+" delete

return


hidebrowsers:
for t = 1 to maxpages
  browser t hide
next t
return

[SBRuss]

Thanks, I'll have a look through next time I get a chance.

As a side issue, does anyone know how to copy the code out of a forum post here, directly on an iPad? I tried the other day and couldn't select and copy the code in the "CODE" section of the post?

[Dav]

Does anyone know how to copy the code out of a forum post here, directly on an iPad? I tried the other day and couldn't select and copy the code in the "CODE" section of the post?

On my iPad mini I can copy forum code by pressing and holding finger in the code box until a blue box selects all the code and a "copy" appears. The "select" link at the top of the box doesn't work for me.

- Dav

[SBRuss]

Does anyone know how to copy the code out of a forum post here, directly on an iPad? I tried the other day and couldn't select and copy the code in the "CODE" section of the post?

On my iPad mini I can copy forum code by pressing and holding finger in the code box until a blue box selects all the code and a "copy" appears. The "select" link at the top of the box doesn't work for me.

- Dav

Thanks. Finally got it working. Selecting all is tricky, as press & hold would only select one word. I had to drag the selection across the line, then down before it selects all. Then it looks like you're selecting out of the code frame, but thats a visual glitch only, and finally it also copied the "code: select all" header text, which had to be deleted.