ThinQbator - problem solving / invention platform social media

  • Hello haxeflixel Community, I've been wanting to make a dev log for a while now especially with all of the cool little tricks I've learned throughout my project as well as @Claudio-Ficara Dev log which was very helpful and felt like if I could do somthing similar That'd be fantastic!
    alt text
    So currently the project is focused only on mobile (IOS and android) but will eventually get support for desktop and then web with the power of haxe.

    It uses Libraries such as

    • Extension web View
    • Native Text
    • Date Time
    • Extension networking
    • flixel - ui and addons

    So in the future I'd love to dev log about my use with some of these libraries in terms of this project.

    thank you for reading my short little post here is the code for scrolling in the menu state for ThinQbator. With the static function and variables you should be able to use it for any project you may need scrolling for both Mouse and Keyboard!

    import flixel.FlxState;
    import flixel.FlxG;
    import flixel.FlxSprite;
    class PlayState extends FlxState
    	public static var scrollSpeed:Float = 0;
    	public static var scrollStartY:Float = 0;
    	public static var scrollOldY:Int = 0;
    	//if camera is scrolling used to have buttons not go off during
    	public static var scrollPress:Bool = false;
    	override public function create():Void
    		//scroller object
    	add(new FlxSprite(0,FlxG.height - 50).makeGraphic(50, 50));
    	override public function update(elapsed:Float):Void
    		//min screen scroll and max screen scroll set for each update
    		scrollCamera(0, FlxG.height - 50);
    		public static function scrollCamera(min:Int,max:Int):Void
    	var friction:Float = 0.95;
    	var i:Int = 0;
    	var maxSpeed:Int = 300;
    	var snapDis:Int = 5;
    	var swipeDis:Int = 0;
    	scrollPress = false;
    #if mobile
    if (FlxG.touches.getFirst() != null)
    //move to far away init
    if (FlxG.touches.getFirst().justPressed) scrollStartY =;
    if(FlxG.touches.getFirst().pressed == true && FlxG.touches.getFirst().justPressed == false && FlxG.touches.getFirst().justReleased == false) //&&  Math.abs(FlxG.touches.getFirst().screenY - scrollOldY) > 3)
    scrollPress = true;
    if( == scrollStartY && Math.abs(scrollSpeed) < 0.1) scrollPress = false;  += (FlxG.touches.getFirst().screenY - scrollOldY) * -1;
    scrollSpeed = 0;
    scrollOldY = FlxG.touches.getFirst().screenY;
    //move to far away init
    if (FlxG.mouse.justPressed) scrollStartY =;
    if(FlxG.mouse.justPressed == false && FlxG.mouse.pressed && FlxG.mouse.justReleased == false) //&& Math.abs(FlxG.mouse.screenY - scrollOldY) > 3)
    scrollPress = true;
    if( == scrollStartY && Math.abs(scrollSpeed) < 0.1) scrollPress = false;  += (FlxG.mouse.screenY - scrollOldY) * -1;
    scrollSpeed = 0;
    scrollOldY = FlxG.mouse.screenY;
    if (Math.abs(scrollStartY - > 5) scrollPress = true;	
    for (swipe in FlxG.swipes)
     if (swipe.duration > 0.05 && Math.abs(swipe.startPosition.y - swipe.endPosition.y) > 5)
    scrollSpeed = (swipe.startPosition.y - swipe.endPosition.y) * (0.016 / (swipe.duration * 5)) * -8;
     //distance to calculate whether snap is vaild or not
     swipeDis = Math.floor(swipe.startPosition.y - swipe.endPosition.y);
     //trace("scroll Speed " + scrollSpeed);
     //trace("frictionTick" + Std.string(scrollSpeed - scrollSpeed * friction));
     scrollPress = true;
    //max speed
    if(scrollSpeed > maxSpeed) scrollSpeed = maxSpeed;
    if(scrollSpeed < -maxSpeed) scrollSpeed = -maxSpeed;
    scrollSpeed *= friction; += -scrollSpeed;
    	 //scroll camera restraints
     if ( < min)
     { = min;
    	 scrollSpeed = 0;
     if ( > max)
     { = max;
    	 scrollSpeed = 0;

    Happy to answer any questions, and let me know if you would like more haxeflixel example code :)

  • Example code is always great to have. Maybe if we have several tips we can make a ui demo for the web.

    Why did you choose to use a game engine to develop an app ?

  • Hey @Agustín-Pérez-Fernández I'm glad you liked the Example Code! Currently ThinQbator does not have a web version so I don't have any tips for a ui demo for the web but if you have any question about the ui for the app I'd love to answer them. And the reason to use the game engine haxeflixel to create the app is because, It's very stable for each platform, easy to prototype and great performance more then ThinQbator would ever need.

  • Hey mate, thanks for the shoutout!

    I stumbled upon your game on the @haxeflixel twitter and the UI looks great. Actually, got a bit happy to know that haxeflixel could be used for a app, being a game oriented framework. Kudos on you!

    Also, I love the code snippet, hope we can start a trend to have other devs share cool pieces of code that could benefit us all!

    I notice your UI is way too sharp, probably from a downscaling. Not biggie at all, but have you tried antialiasing mate?

  • Hey @Claudio-Ficara You deserve all of the shoutouts possible, Thank you so much on all of the insanely nice feedback! The ui is by no credit of myself I had an amazing team of two Designers work day and night in Sketch to be able to make it look so great, I just was able to implement in haxeflixel which was a challenge in of itself but I see full potential in haxeflixel being used for more than just a game engine and I would love to be the person to prove that :D.

    designer interface for app which is then uploaded to invision and seen by me in which I implement it into the app

    In reply to the Down scaling, Yes almost all of the assets in the app have been brought in at 4x and scaled down automatically with custom functions in order to fit properly in the gui/ui. Though the image I put in the dev log is from neko so it looks way worse than the actual android version ( I have updated the image to an android screenshot of the app login screen now so take a look at the difference) though I am still having problems with ios which is where the real issues come into play I have tried antialiasing with both antialiasing="4" in project xml as well as = true; and FlxG.stage.quality = flash.display.StageQuality.BEST; if that counts. ios is blurry so I've been on a hunt for the past week to find a fix. So if you have any more tips with Antialiasing I'd extremely appreciate any support because I'm stumped haha.

    Also I totally agree with the haxeflixel community extremely benefiting from devs being able to share code and other tricks, you inspired me to do so and I'd love to continue the trend!

    Speaking of code sharing, I played the demo for your game and I absolutely loved it had a great time with me and my brother. But I noticed that everything was so beautiful and looked so great except for the FlxText in the game. You may be transitioning to full bitmap text which would fix the issue but if you would like a solution for crisp FlxText as well as any other devs I wrote a premade function to scale up text and size it down in order for the text to not be pixelated for ThinQbator but it could apply to any other haxeflixel application/game :)

    Normal Text

    Custom ThinQbator FlxText


    here is the code:

    	public static function createText(?textString:String = "", ?x:Int = 0, ?y:Int = 0, ?size:Int = 24, ?color:FlxColor = FlxColor.WHITE,?align:FlxTextAlign=LEFT,FieldWidth:Int=0):FlxText
    		var text = new FlxText(0,0);
    		text.setFormat("assets/data/proximanova-regular-webfont.ttf", size * 2, color, align);
    		//scale down
    		text.scale.set(0.5, 0.5);
    		text.antialiasing = true;
    		text.fieldWidth = FieldWidth * 2;
    		text.text = textString;
    		text.setPosition(x - text.width / 4, y - text.textField.textHeight / 4);
    		//add to state
    		return text;

    And if anyone wants to check my demo results for the image here is the create function

    	override public function create():Void
    		var text = createText("Hello HaxeFlixel!");
    		var text2 = new FlxText();
    		text2.text = "Hello HaxeFlixel!";
    text2.setFormat("assets/data/proximanova-regular-webfont.ttf", 24);

  • Hey mate! The updated screenshot looks delicious!

    I was wondering myself ifFlxG.stage.quality = flash.display.StageQuality.BEST and setting in project "antialiasing X" makes a difference. Look like so in some platforms?

    I don't want to hijack your tread much, but thanks for trying it! And yes, the text is a issue. Well, everything that scales up is an issue.

    Not sure if doing it the right way... but check this full hd screenshot. Game resolution is 1024x576, so naturally scales up a bit blurry. Using hi-res versions of images and using scale.set(0.5,0.5) and antialiasing, helps to preserve quality when it scales up.

    This is great, because different resolutions could be used. One for the game, one for the UI.

    The only problem I'm facing with this method is that doing animations, using a FlxTween for example, is that you need to remember the scale, since 1,1 isn't the default anymore. But I think that FlxSprite could be hacked to... add quality ratio or something?


    _internalscale.x = _internalscale.y = scale;

    ... then all FlxSprite calls to image changes, will take into account this factor ( ie spr.scale +=_internalscale)

    I guess I'm gonna try this one out. Keep updating your dev log in the meanwhile!

  • Hey Claudio, I'm thrilled you tried out the scaling trick and Thanks for the support I will of course continue to update the dev log as long as it continues to help devs :D . So to get right down to business in order to have the tween work properly and not be offset right after the scale use updateHitbox(); this should make the FlxSprite be in the correct position and hitbox. Therefore Fix Tweening!


    • ratio
    public static function scaleRat(obj:FlxSprite, scale:Float)
    		obj.scale.set(scale, scale);
    • Dimensions
    	public static function scaleDemXY(obj:FlxSprite, dx:Int, dy:Int):FlxSprite
    	obj.scale.set(1 / obj.width * dx, 1 / obj.height * dy);
    	return obj;

    Try this out and let me know if it works out :) .As always feel free to add on pose any questions.

  • Gonna try ASAP! Thanks for helping out a bro! Keep posting about your project!

  • The Unofficial IOS haxeflixel BUILD Cheat Sheet

    *Note Hello It's been way too Long since I've posted so sorry about that But here is a reference to future Devs Going through similar struggles with IOS, Suggested to do this by the nice people over on the HaxeFlixel Discord.


    • Mac computer (recommended with the most updated OS version)
    • An IOS device (since the simulator is extremely awful and runs at 5fps)
    • Registered personal or licensed ios team if you need help doing this follow this guide
    • Latest version of HaxeFlixel and hxcpp 3.4.64

    Go to project Directory

    Next you want to get to the project directory. You could use cd commands in terminal to do so but what I enabled instead which makes it much faster is go here. mac -> icon -> System Preferences
    alt text
    then go to Keyboard -> Shortcuts -> Services -> scroll down and check True - New Terminal At Folder
    alt text
    Once you have that you should be able to right click or Command-click your project Folder and click new terminal at folder.


    Inside your project directory input this command into terminal.

    lime build ios -Dsource-header=haxe -IPHONE_VER=9.3

    Once that happens you should get an error saying somthing along the lines of needs Code Signing don't panic.
    What you need to do now is go into your project export folder go to ios and open your .xcode project file


    You've successfully made it to Xcode you're through all of the hard parts, Congrats!
    Now What you want to do is find your BuildTime project and double click on it
    alt text
    Now there is a chance that this window may be set to open project not target in this image it does
    alt text
    I can tell because it has the xcode icon rather than the ThinQbator icon so I want to click on it and change it.
    alt text
    then look at signing and change team from none to either your account listed or "Add an Account..." If you don't have an account follow this tutorial
    alt text
    Now once you set it up properly it should say somthing like this.
    alt text


    now for the fun part to see your app Work!
    At the top where you see Generic IOS device click on that, this should come up
    alt text
    Move your mouse up while on the drop down untill you see devices if you have one plugged in it should be there, click it, press the play button to the left and it should start building on your phone! It will give you a progress update in the middle section if you want to see the logs right click you application in build time the one you previously double tapped and go to "Reveal in Log".

    There you have it! I hope the images helped, and this Cheat Sheet helped you :) If you're still stuck or have any questions feel free to reply back on this devlog or DM me on twitter, Cheers.

  • alt text

  • This post is deleted!

  • Hey Guys the Dev Log has hit 1,000 views! that's incredible thank you so much for your continued support on reading.
    alt text

    So Right after publishing my iOS cheat sheet luck came through and we got verfied by apple for TestFlight beta testing so that's great news for us :D
    alt text

    I want to give just a little news feed for this app's timeline integrated with news on openfl and haxeflixel.

    • Currently still waiting to get another status update on the dev version of haxeflixel that will be compatible for openfl 6
    • The app has a very tight nit beta testing group but with a massive list of things to do already we won't be pushing out an open beta until those things are done so expect some more time.
    • For the app being social media focused our team is looking for a good way to implement remote push notifications for mobile( IOS and android) that can integrate with our openfl-networking servers.
    • Our app uses bazzisoft's openfl native text for mobile which currently supports only single line text but I was able to add multiline text support for android but not for iOS which is a bummer so currently looking for a solution.
    • Issues with finding a good way to open up the camera take a picture and grab the bitmap data for both iOS and Android
    • Wanted to try to move to next support but had this issue

    Oh and new work in progress Ui by Scotty, Super Exciting!
    alt text

  • Hello HaxeFlixel Devs,
    It's been quite a while since I've posted here. I've had some of my greatest moments using haxeflixel and talking to the community. People like Omnivore , Claudio, Squidly, CharlieRiot and And0 continue to inspire me by there presence and ability to use HaxeFlixel in insanely awesome ways!

    That said, currently for the past few months I have stopped using haxeflixel in favor of OpenFL mainly for SVG support. Haxeflixel is still my favorite framework to build games but for a non game focused UI App/website I don't gain any benefit using HaxeFlixel over OpenFL.

    If any devs are looking for a more ui focused framework and not game centric be sure to check out my underline OpenFL ui framework I use for ThinQbator called App here

    If you would like to continue to follow ThinQbator's development
    My Twitter DM's are open if you would like to contact me.
    ThinQbator's Twitter

    Good luck HaxeFlixel I can't wait to see what you'll become once you get to the latest openFL version. And when that happens I'll be sure to have my App framework have haxeflixel support for a ui, game mix!

  • Good riddance my friend. You guys managed to come up with one of the most beautiful UI I ever saw on HaxeFlixel. Kudos for you and can't wait to see you working on games!

  • alt text
    Hey There haxeflixel community, I thought I'd update everyone that the project has finally launched! The app is completely free and we are looking to grow the community and we'd love to have you join us!


    • Website
    • IOS
    • Android
      Countries other than the United States may not be supported as our legal team is very small sorry :(

    Full post is on the OpenFL community page: here

Log in to reply

Looks like your connection to HaxeFlixel was lost, please wait while we try to reconnect.