Skip to content

Conversation

@tristanbob
Copy link
Contributor

Description

Change the way a button looks based on the state of the button

This is a simple yet powerful method for changing the appearance of objects using the "Button effects" behavior.
The states of a button include: idle, hover, pressed, held outside, and focused.

Multiple behaviors are provided and they can be combined to make a juicy button with animated responses to user input.

  • Button effect
  • Button animation (number)
  • Button animation (name)
  • Button size (scale) tween
  • Button color (tint) tween
  • Button opacity tween
  • Button angle tween

Playable game

https://gd.games/victrisgames/button-effects

Example game project

GDevelopApp/GDevelop-examples#571

Video

GDevelop_APP5T9SYG9.mp4

@tristanbob tristanbob requested a review from a team as a code owner September 9, 2023 04:48
@tristanbob tristanbob self-assigned this Sep 9, 2023
@tristanbob tristanbob marked this pull request as draft September 9, 2023 04:58
@tristanbob
Copy link
Contributor Author

I just realized I forgot to add all the getter/setters for behavior properties. I will use the fancy way to do this the easy way, but there are ~7 behaviors with ~7 properties, so it will take a bit of time. It will have to wait for tomorrow.

@D8H
Copy link
Contributor

D8H commented Sep 9, 2023

I wonder if a different couple of duration and easing for fade-in and fade-out could be useful.
I guess I would like my buttons to have a quick fade-in but a gentle fade-out.

- Added get/set functions to all properties
@tristanbob tristanbob marked this pull request as ready for review September 10, 2023 04:27
D8H added 2 commits September 27, 2023 01:02
- Remove opacity, animation number and angle behaviors.
- Remove Hovered and HeldOutside states handling as they are part of the
Focused state.
- Duplicate easing and duration properties to allow different speed for
fade-in and fade-out.
@tristanbob tristanbob changed the title [Button effects] Change the way a button looks based on the state of the button [Reviewed] [Button effects] Change the way a button looks based on the state of the button Sep 27, 2023
@tristanbob tristanbob changed the title [Reviewed] [Button effects] Change the way a button looks based on the state of the button [Reviewed] [Button states and effects] New behaviors change the way a button looks based on the state of the button Sep 28, 2023
@tristanbob tristanbob merged commit cc35ca1 into main Sep 28, 2023
@tristanbob tristanbob deleted the button-effects branch September 28, 2023 04:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants