Using Visual Effects
Another way to improve your UI and make using your application a more pleasant experience for the user is to use visual effects. A visual effect is a special effect that is used when changes are made to the display.
LiveCode supports visual transition effects when changing card, updating the screen or hiding and showing objects.
Updating Multiple Objects on Screen
If you want to update multiple objects on screen without the user seeing all the changes you can use the lock screen command. Locking the screen temporarily prevents screen updates, when you unlock the screen all the changes are shown.
on mouseUp
lock screen
hide field 1
hide button "one"
hide button "two"
hide button "three"
show image "LiveCode"
unlock screen
end mouseUpIf you want to use a visual effect to show the screen updates after a lock screen use the form:
on mouseUp
lock screen for visual effect
hide field 1
hide button "one"
hide button "two"
hide button "three"
show image "LiveCode"
unlock screen with visual effect "dissolve"
end mouseUpShowing and Hiding Objects
You can use a visual effect when updating the screen by showing and hiding objects.
Create a stack and add a field. In the message box execute the command:
hide field 1 with visual effect dissolveChanging Cards
You can also use a visual effect when moving between cards.
You specify the visual effect you want to use and then use the go command to change cards.
on mouseUp
visual effect "push left"
go next card
end mouseUp
The Visual Effect Command
The visual effect command allows you to specify an effect to be used the next time there is a move to another card. You specify the effect name and can optionally specify a speed, final image, audio clip and style (iOS only).
When you issue a visual effect command, it is stored to be used the next time you navigate to another card. Usually, you place the visual effect command immediately before these commands. However, it is not necessary to execute the navigation command immediately; the visual effect is stored and used the next time you navigate. You can even issue a visual effect command in one handler and the navigation command in another handler. All visual effects are cleared when all pending handlers exit.
David
When trying to use the line "Visual effect push left" I get an error of "Unquoted Literal char 18" which corresponds to the end of the word push, I take that word out and it'll transition to the next card, but no fancy effect, what am I doing wrong?
Hanson Schmidt-Cornelius
Hi David,
you can address the problem by turning "Variable Checking" off. Open your stack and the LiveCode editor. Then ensure that there is no tick next to the: Edit -> Variable Checking. Once your code has been applied, you can turn Variable Checking back on.
Kind Regards,
Hanson
Paul McClernan
Also, in the LiveCode Preferences -> Script Editor pane you might have that "Strict Compilation" box checked. I'm Coming from the HyperCard/SuperCard/MetaCard era into the LiveCode 6 Community edition age and I did/do a lot of not quoting literals and this caused my visual effects (among other things) to stop working while this feature was turned on. NOTE: that not forcing yourself to quote your literals may actually slow down your scripts execution (perhaps unnoticeably but still). It's a bad habit but I'm old and I've done it for years.
Peter Mayer
Is it possible to disable the visual effect with a command, so that the effect isn't activated for the next navigation? I have a cancel answer, but if the user changes his mind and don't want to cancel, the effect is happening at the next card switch. And I don't want several effects at once.
Sorry for my bad english, I hope you can understand me either :D
Elanor Buchanan
Hi Peter
You can't cancel a visual effect, once it is set it will be used for the next card transition. The best thing to do is to set the visual effect where you check the result of the answer dialog and only set it if the user chooses to change cards.
I hope that helps.
Kind regards
Elanor
Fred
What version of livecode do you use? i use 6.6.2 and nothing you describe in this tutorial works as well as lots of other tutorials.
Elanor Buchanan
Hi Fred, I tested in 6.6.2 and these examples seem to work, which particular example doesn't work for you?
I do suggest updating to a more recent version, there have been a lot of improvements, bug fixes and new features since 6.6.2. You can download a more up to date version from your account.
Kind regards
Elanor