[SOLVED] Resize sprite with coding



  • Is there a way to resize the sprite with coding? i read in haxeflixel documentation it says in FlxSprite like this:

    ####Scale (FlxPoint) Change the size of your sprite's graphic. NOTE: The hitbox is not automatically adjusted, use updateHitbox() for that (or setGraphicSize()).

    // twice as big
    whiteSquare.scale.set(2, 2);

    // 50%
    whiteSquare.scale.set(0.5, 0.5);

    i change the name of the whiteSquare into my own PNG file but it keep error. is there a better example than this or it is not possible? or better use manual resize outside coding?



  • in your class, you do scale.set(0.5, 0.5);, or you can call this in a function loadGraphic("example" + _newScale + ".png", false, _scaleNewWidth, _scaleNewHeight); or maybe a tween FlxTween.tween(scale, { x:0.5, y:0.5 }, 0.4, { ease:FlxEase.elasticOut } );



  • What's your error/problem?
    Changing scale only changes the sprite's graphic
    You need to updateHitbox() to change the hitbox size as well
    As stated in the comment



  • i dont know how to explain in english but i will try. my problem is i want resize a sprite for forever in the game. from start to finish. for example i have a sprite with 1000px x 1000 px with the format of .PNG but i want to resize it into 50px x 50px. is that possible? or i need to do it outside coding like using photoshop? is there a way to do it with coding?



  • You can use setGraphicSize():

    sprite.setGraphicSize(50, 50);
    sprite.updateHitbox();
    

    OR you can use scale with some simple math:

    var newScale = 50 / 1000;
    sprite.scale.set(newScale, newScale);
    sprite.updateHitbox();
    


  • @galoyo oh i tried that sry for late reply. its working but if i use another than (0.5, 0.5) the picture is invisible. :(



  • @DleanJeans

    package;
    
    import flixel.FlxG;
    import flixel.FlxSprite;
    import flixel.math.FlxPoint;
    import flixel.util.FlxSpriteUtil;
    
    
    class PlayerShip extends FlxSprite
    {
    	private var _thrust:Float = 0;
    	
    	public function new()
    	{
    		super(Math.floor(FlxG.width / 2 - 8), Math.floor(FlxG.height / 2 - 8));
    		
    		#if flash
    		loadRotatedGraphic("assets/ship.png", 32, -1, false, true);
    		#else
    		loadGraphic("assets/ship.png");
    		#end
    		
    		width *= 0.75;
    		height *= 0.75;
    		centerOffsets();
    	}
    

    i tried to use it here but i dont know hot ot use it using FlxTeroid project samples. it keep error :(



  • What's your error message?

    I don't understand. What have you tried adding to it? That piece of code you posted was exactly what's in the demo.

    I didn't warn you about this: Resizing such big images may cause some graphic problems. You will need smaller image. Around 200x200 to 500x500 is small enough, I guess.



  • Nvm I try again and remove the "sprite" from

    sprite.setGraphicSize(50, 50);
    sprite.updateHitbox();

    like this:

    public function new()
    {
    	super(Math.floor(FlxG.width / 2 - 8), Math.floor(FlxG.height / 2 - 8));
    	
    	#if flash
    	loadRotatedGraphic("assets/ship.png", 32, -1, false, true);
    	#else
    	loadGraphic("assets/ship.png");
    	#end
    
    	setGraphicSize(50, 50);
    	updateHitbox();
    	
    	width *= 0.75;
    	height *= 0.75;
    	centerOffsets();
    }
    

    it work. but its bugging now. every i press move it is blinking.. like blip blip sometimes invisible cant see the player. haha... btw my image is 1000px x 1000px. anyone know how to solve? xD



  • hi. the haxeflixel logo image will be seen if the optional parameter of width or height is greater than the width or height of the image loaded with loadGraphic. when the width or height var is too small in size than the real width or height of that image, the image will be part or all invisible.

    decreasing the image size too much will give problems as DleanJeans was saying.

    if you are not rotating the ship image, you might try something like this. loadGraphic("ship" + id + ".png", false, _newWidth, _newHeight);

    the setGraphicSize values that you have might be too small for the image. increase the width and height values. also, try changing the code to this...

    	#if flash
    	loadRotatedGraphic("assets/ship.png", 32, -1, false, true);
    	animation.add("rotate", [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32], 30, true);
    	animation.play("rotate");
    	#else
    	loadGraphic("assets/ship.png", true, _width, _height);
    	#end
    
    	setGraphicSize(500, 500);
    	updateHitbox();
    	
    	width *= 0.75;
    	height *= 0.75;
    	centerOffsets();


  • i see.. but i need to rotate the image. so is it better if i recreate the image to 50px x 50 px? i am afraid if the image got bad quality when play in different screen size :(



  • It doesn't need to be exactly 50x50, 200x200 is ok.



  • oh.. ok thanks i guess i need to adding "Solve" to the title :) thanks everyone!


Log in to reply
 

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