ok, so here's an example with the FontSprite object: At least try the exe:)
even if the original poster doesn't want to use it, this will explain some of the things you can do with it, and how to do them. hope it helps someone
try the exe first, so you know what the events you're looking at are for, and what they will do in the end.
I only made it work with first and second options, and once you open the option, you can't do anything else. though, as you will see, adding new options only requires you to add one small event, and no guesswork as to how tall all the text for the submenu is
look through the cap a little, to get a basic idea of what's going on before reading the tutorial
after each screenshot, I will break down the actions one by one, so don't let them overwhelm you.
link to plugin
also, before we get started, don't be intimidated by the long post, it's actually only four main events, and I broke down each step really far since most people have never used this plugin:
how it works:
ok, in the start of layout, you choose your sprite, and set up which characters are which,
basically you tell it which frames of the sprite animation have which letters.
it's not as confusing as it looks in the screenshot, basically I'm giving a range of characters like 'a' through 'z', and saying these letters start of frame 33,
the letters are stored in a sprite animation,
frame 33 is 'a', frame 34 is 'b', frame 35 is 'c', etc. if you have questions, look at the cap later, don't let this part worry you for now. it's really quite simple when you try it for yourself
you'll notice that the last line contains our whole menu, if you've never used the newline expression before, it's like pressing enter, so
will type on the screen:
you can ignore the actions in the brackets, that's setting up a new fontsprite the same way as the first, if you are familiar with the 'function' object, you'll only need those actions once
so it goes like this,
[code:l8egaw9v]On Left Clicked on sprite[/code:l8egaw9v]
each letter is a sprite, so that means if the player clicks on any letter
this event triggers
[code:l8egaw9v]Pick Current Word[/code:l8egaw9v]
this takes that sprite, and goes back to the fontobject
now it's picked every sprite that makes up the word that the sprite was a part of
so if you click on the sprite for "i" in the word "first"
it picks every sprite that makes up the word "first"
[code:l8egaw9v]SpriteFont.CurrentWord Equal to "first"[/code:l8egaw9v]
here's where the magic happens
if the word they clicked on (the 'CurrentWord') is equal to "first", this event will trigger
you then create a SpriteFont2 object (just another spritefont, for the submenu)
I created it at
x= spritefont.phraseleft (the left edge of the all the letters) +30 (for an indent)
y = Sprite.Top+spritefont.newlineheight
remember, when we picked Current Word, we picked the sprites that make up that word,
spritefont ignores hotspots, so 'newlineheight' measures from the top of the letter sprite (the sprites that make up the word we clicked on),
so sprite.top+newlineheight, is where it would be writing the next line if you weren't doing a weird menu thing,
this means that your submenu (we just created, SpriteFont2) is positioned exactly as if you had just put a regular newline after the word you clicked on, with no guesswork
then those actions in brackets, are the same setup things we did for the original menu
the Showtext again, this time with SpriteFont2 with all our submenu option separated again by Newlines
[code:l8egaw9v]SpriteFont:Set private variable "option" to spritefont.WordPositionInPhrase[/code:l8egaw9v]
we make a private variable called option, to keep track of what the player clicked on. as you'll see, you won't need a different event for each option from here on out
WordPositionInPhrase is just that
[code:l8egaw9v]"hello, how are you?"[/code:l8egaw9v]
so the WordPositionInPhrase for "hello" is 0, "how" is 1, "are" is 2, etc...
you are setting the private variable "option", to this number, so you can remember which word you clicked on for later, this will make sense in a minute
[code:l8egaw9v]SpriteFont:Set private variable "submenuopen" to "yes"[/code:l8egaw9v]
the default is set to "no", so we can use this later to see if the submenu is open or not
[code:l8egaw9v]SpriteFont2:For Each Character
Sprite:Set opacity to 0[/code:l8egaw9v]
I did this so the submenu is invisible until we've made space for it
[code:l8egaw9v]"submenuopen" equal to "yes"
once the menu is open, we want to do this one time
[code:l8egaw9v]SpriteFont:for each character
SpriteFont:Private Variable "option" less than SpriteFont.WordPositionInPhrase[/code:l8egaw9v]
Remember how we set "option" to the word number earlier?
now every letter that is in a word AFTER that original option, will trigger this event
so we set in each letter/sprite:
a private variable:
[code:l8egaw9v]StartHeight = .y (the current y position)[/code:l8egaw9v]
(where it is now, the beginning of the scrolling)
[code:l8egaw9v]EndHeight = StartHeight + SpriteFont2.PhraseHeight + 7[/code:l8egaw9v]
and we want it to end at the end of our submenu
PhraseHeight calculates the distance from the top pixel of the highest word in the phrase, to the lowest pixel at the bottom of the phrase, so this is how big, vertically, the submenu is.
because as I said before, spritefont ignores hotspots, so this is to compensate
you can just do this by trial and error, or by checking the position of the sprite hotspot in the sprite editor
[code:l8egaw9v]SpriteFont:private variable SubmenuOpen equal to "yes"?
For Each Word
Value of "option" less than WordPositionInPhrase?[/code:l8egaw9v]
these are the same as in the last step
if the submenu is open, check each word and see if it comes after the wordnumber of the option that was clicked on, if so, we need to scroll it
[code:l8egaw9v]Sprite.Value('EndHeight') greater than .y?[/code:l8egaw9v]
if so, the sprites haven't scrolled down enough
I made a counter to use with lerp to move the sprites
it's a private variable in FontSprite2 called 'counter'
it starts at 0
[code:l8egaw9v]SpriteFont2('Counter') : Add 0.5 * timedelta[/code:l8egaw9v], this will add a tiny number to 'counter',
that will vary based on framerate, to make sure it moves at the same speed on any computer, regardless of slowdown,
if you don't care about slow down, you could have just put 'Add 0.1'
[code:l8egaw9v]Set Y to lerp(('StartHeight'),('EndHeight'),SpriteFont2('counter'))[/code:l8egaw9v]
quazi explained how lerp works, a number between 0 and 1, takes you from the first number to the second number, we set startheight and endheight variables for each sprite(each letter), to take it from where it was to where it was + the height of the submenu
now we've taken care of scrolling the sprites, and stopping the sprites,
because if they've gotten to the end, then the event:[code:l8egaw9v]Sprite.Value('EndHeight') greater than .y?[/code:l8egaw9v] won't be true anymore, so they will stop scrolling
all that's left now is making the submenu not invisible anymore when we're done scrolling
[code:l8egaw9v]Sprite.Value('EndHeight') less than or equal to .y?[/code:l8egaw9v]
this will be true when the sprites reach their final destination after they are done scrolling where they need to be...
it's opposite of the last event, so you could have also just used "else"
[code:l8egaw9v]SpriteFont2:for each character[/code:l8egaw9v]
remember, spritefont2 is the submenu, so now this will pick each sprite in those words one at a time
[code:l8egaw9v]SpriteFont2:Opacity less than 100[/code:l8egaw9v]
remember we set it to opacity to 0?
[code:l8egaw9v]Sprite: Set opacity to .opacity + (50*timedelta)[/code:l8egaw9v]
again, if you don't care that it goes at the exact same speed during slow down, you could have just put opacity +1
since this will keep being true until it's no longer transparent at all (opacity = 100), it gives you a nice slow fade in for the the sub menu...
as you can see, using this method, you don't have to keep guessing how much distance there is for different menus, or setup many objects for each word, and even though it's alot to take in the first time you use the spritefont object
it has a very simple logic to it, once you get over the initial learning curve
if you use functions with this example, the code could be drastically reduced
you could have also used "else", and a private variable to show whether it was a menu, or a submenu instead of a second spritefont object to reduce it further