Author Topic: FlxSlider.as  (Read 4972 times)

Gama11

  • Contributor
  • ****
  • Posts: 390
  • Karma: +0/-0
    • View Profile
FlxSlider.as
« on: Sun, Oct 21, 2012 »
GitHub repo of the demo-swf

So, when creating the demo swf for my FlxTrail class, I wanted to use sliders to be able change the variables conveniently. As it turned out, though, it's not possible to use the flash default ones within FlashDevelop. (plus, that would be an ugly solution as you'd have to use FlxG.stage etc)

I went ahead and created such a GUI element for flixel (extending FlxGroup). It's quite simple, but should work fine - which is also why the demo suite for my FlxTrail class is essentially also a demo swf for my FlxSlider class. There are two ways of using it, either you let the slider change the variable directly, or you assign a callback function which is called whenever the slider has been dragged for more complex stuff.

<a href="https://dl.dropbox.com/u/18627942/Demo.swf" target="_blank" class="new_win">https://dl.dropbox.com/u/18627942/Demo.swf</a>

Also, feel free to leave feedback and suggestions, use the class yourself and / or customize it according to your needs. :D I commented most of the stuff, so you should be able to understand what's going on, plus, it's not all that complicated. IMPORTANT NOTE: This requires Photonstorm's FlixelPowerTools to work! I'm using the latest version (1.9), not sure if earlier version would work as well. I'm using the FlxMouseControl and FlxExtendedSprite classes.

FlxSlider.as

Click here for the source code

Edit Updated FlxSlider.as to v 0.2 - now also has the ability to play a sound when clicked and / or hovered over
« Last Edit: Sat, Dec 22, 2012 by Gama11 »

Esti

  • Active Member
  • ***
  • Posts: 104
  • Karma: +0/-0
    • View Profile
Re: FlxSlider.as
« Reply #1 on: Sun, Oct 21, 2012 »
Excellent work. Really helpful.

Check it out on Mochi!

Jeff

  • Active Member
  • ***
  • Posts: 127
  • Karma: +0/-0
    • View Profile
    • Entertainment Evolution
Re: FlxSlider.as
« Reply #2 on: Wed, Oct 24, 2012 »
Neat! That should come in handy!
Please give me feedback for my latest game in progress:
Blog: Entertainment Evolution

paala

  • Contributor
  • ****
  • Posts: 250
  • Karma: +0/-1
    • View Profile
Re: FlxSlider.as
« Reply #3 on: Wed, Oct 24, 2012 »
I wonder how hard is to make a sprite to be displayed from the beginning of the slide to the current position and update as the cursor moves. Great resource though. Thanks for releasing it.

Gama11

  • Contributor
  • ****
  • Posts: 390
  • Karma: +0/-0
    • View Profile
Re: FlxSlider.as
« Reply #4 on: Wed, Oct 24, 2012 »
Glad you guys appreciate it. :D

@paala: Sorry, but I'm having a hard time trying to understand what you actually mean by that. :/

paala

  • Contributor
  • ****
  • Posts: 250
  • Karma: +0/-1
    • View Profile
Re: FlxSlider.as
« Reply #5 on: Tue, Jul 30, 2013 »
Hi Gama,
I noticed a little problem with FlxSlider.
As you can see in your example is very hard to select "Triangle" , because somehow to area of slider for the last options is getting smaller and smaller.
Can you fix it so that if you have a slider with 3 options , the first 33% of slider to be choise 1 next 33% choise 2 , last 33% choise 3.
Now the first 49% is choise 1, next 49% is choise 2, and last 2% is choise 3
Thanks.

Gama11

  • Contributor
  • ****
  • Posts: 390
  • Karma: +0/-0
    • View Profile
Re: FlxSlider.as
« Reply #6 on: Tue, Jul 30, 2013 »
Yeah, I see what you mean. It's a bit ugly, but I don't think it's really a big deal for the purposes of this demo.

I haven't been updating FlxTrail and FlxSlider for AS3 in quite a while. Updated versions of both classes are part of the HaxeFlixel engine.

paala

  • Contributor
  • ****
  • Posts: 250
  • Karma: +0/-1
    • View Profile
Re: FlxSlider.as
« Reply #7 on: Tue, Jul 30, 2013 »
Well, I intend to use the sliders in my future game but is ugly the way they are. I will try to have a look at the haxe version to see if I can do something. I can;t swicth to have since the game is a multiplayer and needs as3 to work.
EDIT: I can't find the haxe flixel repositoryon gitbub. ALso the github for project jumper haxe flixel version doesn;t work either.
Thanks.
« Last Edit: Tue, Jul 30, 2013 by paala »

Gama11

  • Contributor
  • ****
  • Posts: 390
  • Karma: +0/-0
    • View Profile
Re: FlxSlider.as
« Reply #8 on: Tue, Jul 30, 2013 »
It's not really an issue with FlxSlider itself, but the callback function / how the shape changing is handled (although it certainly also has some issues). I kinda fixed it.

What do you mean, you can't find the HaxeFlixel repository? Just enter "HaxeFlixel" into the search bar and this is the first thing you'll find.

paala

  • Contributor
  • ****
  • Posts: 250
  • Karma: +0/-1
    • View Profile
Re: FlxSlider.as
« Reply #9 on: Tue, Jul 30, 2013 »
I found the haxe version of project jumper...
Now regarding this, I think you misunderstood me.
I wasn't referring to the actual shape but to the slider in general.
If you want to select  option "triangle" you need to move the slider in the most right part of it. if you move 1 pixel to the left  the option "circle " is selected.
This doesn't occur on left side. You can move the slider from the most left side like 1 cm before other option is selected.
I hope is clear what I mean

Gama11

  • Contributor
  • ****
  • Posts: 390
  • Karma: +0/-0
    • View Profile
Re: FlxSlider.as
« Reply #10 on: Tue, Jul 30, 2013 »
What's wrong with Project Jumper? You're talking about the flixel-demos repo, right? Should be working just fine (assuming you're using the dev branch of HaxeFlixel).

Also, I did understand what you problem with the shape slider is. Have you tried the updated demo I linked? I have not changed the swf in this thread yet, though.

paala

  • Contributor
  • ****
  • Posts: 250
  • Karma: +0/-1
    • View Profile
Re: FlxSlider.as
« Reply #11 on: Tue, Jul 30, 2013 »
I found project jumper. The link from here: http://www.haxeflixel.com/demos/project-jumper
doesn't work.
I will try tomorrow to see if your fix worked. Thanks.
EDIT: I studied the modification you did and the trick to put 3.3 instead of 3 if max value is 3 works. Is kind of weird but works.
« Last Edit: Wed, Jul 31, 2013 by paala »