How do I Gradually Lower Opacity

0 favourites
  • 12 posts
From the Asset Store
Animated Counter
$3.60 USD
10% off
Make a displayed number gradually increase or decrease, making an impression of a real-time counting.
  • I'm trying to make a black square go from 100 % opacity to 0% opacity, but I want it to do so gradually. I place a lever above each square that should control the opacity of it's corresponding square. Right now when the switch is at the top it is at 100% opacity and when the switch gets to the bottom it it goes to 0% opacity. I would like it to show the transition from 100% to 0% while moving the switch. So if you pulled the switch half-way down the square would show around 50% opacity. Capx of what I have done so far is attached, thanks in advance for any help.

  • I've edited the capx so that now it will fade visible and invisible using opacity each time you flip the switch. I didn't do the 50% opacity if the switch is halfway, but if you study the capx, you should be able to easily do it as well.

    https://www.dropbox.com/s/xp2l3oggmgk1y2s/Lighting%20TestModified.capx

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • You should do the distance between the switch and the bottom divided by the distance between the top and the bottom, that should give you a number between 0 and 1 that you can then multiply by 100 to get the final opacity

  • Similar to Whiteclaw's suggestion.

  • I've edited the capx so that now it will fade visible and invisible using opacity each time you flip the switch. I didn't do the 50% opacity if the switch is halfway, but if you study the capx, you should be able to easily do it as well.

    https://www.dropbox.com/s/xp2l3oggmgk1y2s/Lighting%20TestModified.capx

    Thanks for your help, but this is not exactly what I'm looking for. I may not have described what I'm looking for good enough so I will try again. The switch works as a light dimmer. At the max position of the switch (the highest position) the square will be at 100 %. At the minimum position of the switch (the lowest position) the square will not show at all. So for every position between the max and the minimum, the square's opacity should be relevant to the position of the switch.

    Example: If you pull the switch 50% of the way down and stop it there, the square should show 50% percent opacity. If you then push the switch 83% of the way up, the square should 81% opacity.

    The switch acts as a gauge for the opacity of the square. Thanks again for the quick response maybe I can tweak your file to get the results im looking for.

  • Similar to Whiteclaw's suggestion.

    Ba Da Bing Ba Da Boom, that's it!!!! Thank you so much. Question...So if I wanted the max opacity to be 90 in stead of would I just say..... on start set square to 90% opacity, then instead of dividing 100 I should divide 90?

  • Well, I don't how how hornet did it, but try it, I guess...

  • Well, I don't how how hornet did it, but try it, I guess...

    OK I will, thanks for your suggestion earlier, not too familiar with Construct yet so I honestly didn't understand too much but I understand a bit more seeing the example.

  • It's not Construct 2, it's just simple math, I'll explain

    Let's say I have this diagram

    |--+--|

    In it, we can see that the + is in the middle, thus yielding to 50% opacity or 0.5 * MaxOpacity (100 in our case)

    But how do we get that 0.5, what I did is

    (Distance from start to +) / (Distance from start to end)

    Now let's see out diagram:

    |--+

    ~~^ (Distance from start to +) - 3 characters

    |--+--|

    -~~~~^ (Distance from start to end) - 6 characters

    Now: 3 / 6 = > 0.5 <

    Here ya go ... That's how programmers think

  • So if I wanted the max opacity to be 90 in stead of would I just say..... on start set square to 90% opacity, then instead of dividing 100 I should divide 90?

    Simple answer, yes. I've added a clamp to ensure it won't go over the maximum.

  • >

    > So if I wanted the max opacity to be 90 in stead of would I just say..... on start set square to 90% opacity, then instead of dividing 100 I should divide 90?

    >

    Simple answer, yes. I've added a clamp to ensure it won't go over the maximum.

    You went beast mode today dude....thanks

  • Glad to see you have your solution Scottydoes3d.

    Whiteclaws and blackhornet, thanks for that as well. I learnt something new

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)