LessonsIntermediate: Stacks, objects and dataLesson 28

Cards and going between them

Make cards, move between them, share a background of controls across cards, and keep each card's own text.

  • Intermediate
  • Lesson 28 of 83
  • About 13 minutes
  • 10 examples

A stack of cards

A stack shows one card at a time. Each card is a screen of its own: a page of a book, a step of a quiz, a record in an address list. Object > New Card adds a card after the one you are on and goes to it, Object > Card Inspector names it, and the View menu moves between them: Go First, Go Prev, Go Next and Go Last. In a script, create card adds one and go moves.

Build it with the Tools palette and the Property Inspector
  1. Start a new stack. In the Card Inspector (Object > Card Inspector), name its card Home.
  2. Choose Object > New Card and name the new card Help; then again, and name the third card About. You are left on About.
Message BoxType each line in the Message Box and press Return
put the number of cards
put the short name of this card
go to card "Home"
put the short name of this card
go next card
put the short name of this card
go last card
put the short name of this card
go next card
put the short name of this card
Message Box (what each put shows)
3
About
Home
Help
About
Home

go next card on the last card goes round to the first, and go previous card on the first to the last, so a stack is a ring of cards. You can also go first card, go to card 2, or go back to the card you were on before.

Which card is this?

Build it with the Tools palette and the Property Inspector
  1. Start a new stack with three cards (Object > New Card twice), and name them Page 1, Page 2 and Page 3 in the Card Inspector.
Message BoxType each line in the Message Box and press Return
put the cardNames of this stack
go to card "Page 2"
put the number of this card
put the short name of this card
Message Box (what each put shows)
Page 1
Page 2
Page 3
2
Page 2

the number of this card is its place in the stack, and the cardNames lists every card's name, a line each. The Project Browser (Tools > Project Browser) shows the same list, and goes to a card when you double-click it.

Each card gets ready: openCard

Going to a card sends it openCard, and leaving it sends closeCard. A handler in a card's script hears them only for that card; one in the stack's script hears them for every card that does not handle them itself. On a stack of three cards, put this in the stack's script (Object > Stack Script):

Build it with the Tools palette and the Property Inspector
  1. Start a new stack with three cards (Object > New Card twice), and go back to the first (View > Go First).
ScriptThe script of this stack
on openCard
   put "openCard on card" && the number of this card
end openCard
Message BoxType each line in the Message Box and press Return, with the script above in place
go next card
go next card
go first card
Message Box (what each put shows)
openCard on card 2
openCard on card 3
openCard on card 1

Controls on every card: backgrounds

Many stacks want the same controls on every card: a title, Next and Back buttons, a field for each part of a record. Put them in a group and tick Behave like a background in the group's Inspector (its backgroundBehavior): every card you make after it gets the same group. It is one group, placed on many cards.

Build it with the Tools palette and the Property Inspector
  1. Start a new stack. Drag a Field, make it fill most of the card, name it Text, and set its Text size to 24. Drag a Standard Button to the bottom right corner and name it Next.
  2. Select both and choose Object > Group Selected. Name the group Page, and in its Basic section tick Behave like a background.
  3. In Run mode, type First page into the field. Choose Object > New Card: the new card has the field and the button too. Type Second page into the field there.
Message BoxType each line in the Message Box and press Return
put the number of this card
put the number of controls
put field "Text"
go to card 1
put field "Text"
Message Box (what each put shows)
2
3
Second page
First page
Your card as the OXT-Beyond engine draws it
Your card, the first of the stack: a large field that says First page and a Next button in the bottom right corner.

Three controls: the field, the button and the group that holds them. The field is shared, but each card keeps its own text in it: that is what a field's sharedText (Share text), false unless you change it, means. So a stack of cards with a background is a little database, one record a card, the way HyperCard's address books worked.

Tick Share text for a field that should show the same text on every card, like a heading:

Build it with the Tools palette and the Property Inspector
  1. Start a new stack. Drag a Field, name it Heading, and tick Share text in its Basic section.
  2. Group it (Object > Group Selected) and tick the group's Behave like a background.
  3. Type My recipes into the field in Run mode, then add two cards with Object > New Card.
Message BoxType each line in the Message Box and press Return
put the number of this card
put field "Heading"
go first card
put field "Heading"
Message Box (what each put shows)
3
My recipes
My recipes

The Next button of the background above needs a script. Back on its first card (View > Go First), give it this one and click it twice in Run mode:

Build it with the Tools palette and the Property Inspector
  1. The stack with the background Page from above, on its first card.
ScriptThe script of button "Next", then in Run mode click it twice
on mouseUp
   go next card
   put field "Text"
end mouseUp
Message Box (what it shows after each click)
Second page
First page

The button is on every card, so the same script works from each, and the second click goes round from the last card to the first. visual effect animates the change of card; the effects include dissolve, wipe, push, scroll and reveal, with a direction where it makes sense:

ScriptThe script of button "Next"
on mouseUp
   visual effect push left fast
   go next card
end mouseUp

A Back button is the same with push right and go previous card, and a Home button just says go first card. Each goes in its own button's script: one script can have only one handler of each name.

Deleting cards

Object > Delete Card removes the card you are on, and delete card does the same from a script, with the controls that are only on it. A stack always keeps at least one card.

Build it with the Tools palette and the Property Inspector
  1. Start a new stack and name its card Start. Add a card with Object > New Card and name it Scratch, then go back to the first (View > Go First).
Message BoxType each line in the Message Box and press Return
put the number of cards
delete card "Scratch"
put the number of cards
put the short name of this card
Message Box (what each put shows)
2
1
Start

Try it yourself

Build a three-card flash-card stack: a background group with a field Word in large, centred type and a button Next, and the words bonjour, merci and au revoir typed on the three cards. Give Next a script that goes to the next card and puts its word. Then, from the first card, click Next three times.

Build it with the Tools palette and the Property Inspector
  1. Start a new stack. Drag a Field to the middle, name it Word, set its Text size to 32 and its Text align to center. Drag a Standard Button under it and name it Next.
  2. Group the two and tick Behave like a background. Type bonjour into the field.
  3. Add a card with Object > New Card and type merci; add another and type au revoir. Go back to the first card.
Show a solution
ScriptThe script of button "Next", then in Run mode click it 3 times
on mouseUp
   go next card
   put field "Word"
end mouseUp
Message Box (what it shows after each click)
merci
au revoir
bonjour
Your card as the OXT-Beyond engine draws it
Your card: a field in its centre showing the word bonjour in large type, with the Next button below it.

The third click goes round from the last card to the first.

Words in this lesson

cardNew CardCard Inspectorcreate cardgonextpreviousfirstlastbackthe number of this cardcardNamesgroupbackgroundBehaviorsharedTextvisual effect

Each one finds every lesson that uses it. The Dictionary has the whole story of each, with its syntax and more examples.