Basic button setup

Yep, it’s another oldie. Basic button setup for all the newcomers out there.

FrozenHaddock Tutorials: Buttons

In this tutorial I’m going to cover how to set up a basic button. If you’re looking
for codes for buttons or advanced buttons techniques, please check our other tutorials. I’ll explain the 4 button states, and which one your button will display
and when.

Rectangle Settings
First of all, you’ll need to draw a shape to use for your button.
For the sake of the tutorial I have used a rounded rectangle set to 15pts.

Shape
Here’s what I have now, I have deleted the stroke, but thats a matter of preference.

shapesettings
Now, select it and change the width and height to 95 and 30 respectively.

convert
Now select the shape, and hit F8. Change the type to button, and name your button accordingly.

doubleclickresult
Double click the button, Your timeline should have this at the top now.

buttontimeline
And your actual timeline will look like this.

keyframesplz
Insert a keyframe in each frame.

Upstateoverstate
Downstatehitstate
Now, edit your button according to what frame it is on

State Effect
Up Default showing.
Over Shows when you rollover the button with the mouse.
Down Shows when you are over the button and the mouse is clicked.
Hit This is the area your button is clickable. This state doesnt show.

layersinbuttons
You can insert layers, just like a normal timeline.

textlayers
These are usefull for seperating text, etc.

buttonupbuttonoverbuttondown

-->

4 Responses to “Basic button setup”

  1. Building on the avoiding game (Avoiding game Pt.2) | FrozenHaddock Says:

    [...] you can design your menu, it should have a play button of course, and our tutorials on buttons are here, and here. Make sure that you have a stop(); action on this frame, and that you change the buttons [...]

  2. Jmax Says:

    Wow. I missed this one. Yet a nice an effective way of making a button Knew it already, but didn’t know about the up, over, down, hit thing. Thanks.

  3. joe Says:

    you really should show us how to make the button usable so it takes you somewhere

  4. Tazzydevil XIII Says:

    Right here:

    http://frozenhaddock.co.uk/2008/06/basic-buttons-2-simple-actions/

Leave a Reply