Easy Hover Button Example

Welcome to our brand new Clickteam Community Hub! We hope you will enjoy using the new features, which we will be further expanding in the coming months.

A few features including Passport are unavailable initially whilst we monitor stability of the new platform, we hope to bring these online very soon. Small issues will crop up following the import from our old system, including some message formatting, translation accuracy and other things.

Thank you for your patience whilst we've worked on this and we look forward to more exciting community developments soon!

Clickteam.
  • If your style is to use hover buttons in your games / applications, this may simplify the process for you.

    First, when creating your sprites (for buttons), create a dimly lit version which will be displayed when the mouse is not over the sprite. Save this as button0.png (or whatever format you use).

    Create a brightly lit version of the same sprite which will be displayed only when you hover over the sprite. Save this as button1.png (again, use whatever file type you prefer).

    Add a new active object to your project. Double click the active to bring up the image editor in MMF2.

    Use the load function and select button0.png, and check import as animation checkbox. This way, MMF2 will load both button0.png and button1.png into frame 0 and frame 1 of your active object (the sprite).

    Assign a QUALIFIER to this object. You want to use a qualifier so you can code this only once, and it will work for ALL of your hover buttons.

    The attached file will show you the simple code required to make any and all of your "QUALIFIED" sprites respond to a mouse over by "lighting up".

    In a nutshell, you code to test for the mouse being over the QUALIFIER, not the active object. If its over the QUALIFIER, you change the animation frame to FRAME 1 (remember, this is the second frame, since frames are counted from ZERO). You NEGATE this step to test when the cursor is NOT hovering over the button, and set frame 0 to be displayed in that case.

    to prevent the continuous firing of either event, you can also test which frame is currently displayed, and only take action if needed.

    Enjoy!

    [color:#FF6666]EDIT: I placed the "Force Animation Frame to 0" and "Fore Animation Frame to 1" on the Qualifier, rather than the button... this way you can re-use the same qualifier for multiple objects.[/color]

  • One problem with these button widgets (and it's a big bug when using qualifier) is if the buttons are near from each other and the mouse hover one button and then hover another: all highlighted buttons will stay highlighted until the mouse cursor is not hover any button.

    Please login to see this link.

  • Yeah I've been trying to figure out how to fix that. I guess it can probably be fixed if all of the buttons were on one qualifier, and you set all of the buttons to the up state when a button is hovered over.

    When you do things right, people won't be sure you've done anything at all.
    - God (Futurama)

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!