All Activity

This stream auto-updates     

  1. Yesterday
  2. Here's what I did: https://github.com/gameofbombs/pixi-super-atlas This is a public version of something that works in commercial production project. Its for v4 and it uses great hacks that emulate v5 TextureResource. I didnt move it to v5 yet. There's not much docs, but you can understand whats in the functions. https://github.com/gameofbombs/pixi-super-atlas/tree/master/src/core Here look in "Add" and "repack" : https://github.com/gameofbombs/pixi-super-atlas/tree/master/src/core Its the known algorithm, its used by all packers (with modifications of course) . Your algo looks like some modification of bucket algo, it is fine for certain cases but it will be better if you also know what other packers do, as a reference.
  3. lol crap... seems like my second implementation was all for naught thanks though going to try this now. edit: yep so sure enough my original function would have worked with just adding the false flag to renderer.render Thanks @ivan.popelyshev It seems to be working awesome now, I can start focusing on optimizing my packing algorithm.
  4. Sounds like something that I did before, I'll look at it later. From what did i see in your code reading bby diagonally, you have to use "renderer.render(container, renderTexture, false);" where container have all new sprites as a children. "false" means "dont clear, leave the background as it was". This implementation is the best, there might be some steps to improvement but it depends on your use-case, I need to know more
  5. <deleted because it was so wrong>
  6. Hi all, I am a french full-stack developper and I am looking for a Graphic designer to make the game-ui design & pixel art for a project of mobile and desktop game on Kitesurf. Here is what I would like to propose in the game: -Challenges -Race -Classements -FreeStyle -Shop -Multi-player ... The base of the game is already in place but here I will need help on the graphics and character animation. I would like to do a little old-school project in pixel art in top view. Voila, if the project interests you, mp me here is some game ui that I find nice -> - https://www.pinterest.fr/pin/569423946634125639/ - https://free-game-assets.itch.io/free-game-user-interface - https://itch.io/queue/c/485871/gui?game_id=280236 - https://www.pinterest.fr/pin/460493130623071038/ - https://www.pinterest.fr/pin/353884483218659421/ - https://www.pinterest.fr/pin/460493130623071038/ - https://www.pinterest.fr/pin/519180663292757475/
  7. Hello all today my son show me krunkerio , and first time i really got hooked ! you can play one against each other mod's and many other great things its 3d . Can someone please tell me how did they build it ? is it node js on the server or custom tech ? what does it using for client ?
  8. @ivan.popelyshev thanks, I will look the example. @jonforum but, I know how it works. What I don't understand is, why when set scale.x to -1 the boundary of the image of the sprite goes to left of the top left corner position. I came from frameworks where that (the scale) doesn't affect the boundary of the texture draw on the screen. For example, with SDL2 you can flip horizontally the drawing but the boundary doesn't change to left (outside of the top left corner). I know that I'm need to know something, but I don't know what is haha. maybe realtive to the transform matrix, or something made inside the pixijs that I can see directly. Others engines made the scale like pixijs, for that, I'm certain that I'm forgetting to learn something.
  9. Here's a visual of what I'm trying to accomplish- as I add rects it gets added to the texture without changing the positions of anything else. This is meant to be ran during the game loop so the algorithm for finding an open spot is super fast but super shitty, I plan on making it better but I just wanted to create a proof of concept first. As you can see rects get added without changing the rest of the "texture" but I'm trying to figure out how to do this as a pixi texture without having to re render the whole "texture" each time I add a rect/sprite I think I'm making the wrong assumption on how a RenderTexture works.. Would it only work if I kept a PIXI.Container with all the elements and then I would have to re-render that PIXI.Container to a RenderTexture each time I add a new image? This would probably be too slow to dynamically add new images when it starts reaching the max texture size and then my shitty packing algorithm becomes even shittier since I have to redraw the texture each time anyway.. and then I'd have to recreate all the textures that use the RenderTexture as the base texture everytime it updates? Yea I feel like I'm going down a rabbit hole of bad design decisions. Is there any efficient way to just add another image to a texture when the majority of the texture is exactly the same besides one small rect area so I can keep all the past textures I've created as well as not re render a whole new RenderTexture I have a feeling I'm just fundamentally wrong with my assumptions on how my library could have worked.
  10. I'm trying to have a RenderTexture grow as I dynamically load images What I do is load the image as a texture, create a sprite, then I want to render that sprite to the render texture. But every time I render a new sprite to the render texture it seems to delete everything else on the render texture. public addSprite (id, sprite: PIXI.Sprite, deleteSprite=false) : PIXI.Texture { if(this.mappedTextures.has(id)) { if(deleteSprite) { sprite.destroy({children: true, texture: true, baseTexture: true}); } return this.mappedTextures.get(id); } const { atlasIndex, rect } = this.addRect(id, sprite.width, sprite.height); if(!(atlasIndex in this.atlasRenderTextures)) { this.atlasRenderTextures[atlasIndex] = PIXI.RenderTexture.create(this.maxAtlasWidth, this.maxAtlasHeight); } const renderTexture = this.atlasRenderTextures[atlasIndex]; // assign sprite position to the open rect sprite.position.x = rect.x; sprite.position.y = rect.y; // render sprite to render texture this.renderer.render(sprite, renderTexture); // make a reference to the new texture using render texture as base. const texture = new PIXI.Texture( renderTexture.baseTexture, new PIXI.Rectangle(rect.x, rect.y, rect.width, rect.height), ); this.mappedTextures.set(id, texture); if(deleteSprite) { sprite.destroy({children: true, texture: true, baseTexture: true}); } return texture; } I'm trying to write a lib https://github.com/visgotti/DynamicTextureAtlas that allows a growing packed texture atlas and right now I'm implementing a class that uses the algorithm to map the atlas to a RenderTexture with sprites, the packing algorithm isn't good but i plan on optimizing it. But the big thing I wanted to make sure is that everytime a new image is packed the items in the atlas don't get repositioned so it would be quick to update a RenderTexture since all we need to draw is the new image added instead of the whole packed sheet. Is there something fundamentally wrong with my approach?
  11. Thanks. I think I'll try to incorporate the flag idea, since I'm probably doing too much per frame anyway.
  12. @photonstormRich, could you maybe help us out here? I use to have a profile picture on here, and I don't anymore, but I can't upload either.
  13. Yeah, I also used double-canvas and triple-canvas on slow devices, browser compositeLayers works better than webgl or 2d in that case. Thought i recommend to have only one of them as webgl..
  14. I have a method where I have two different changes that can happen in the scene. Tweens and handlers that get run every frame. For tweens I check if amount of active tweens creater than 0, then it means that something is changing. For onrender-handlers I have a custom component that allows for components to register themselves to get onrender -events and their return value will tell if something has updated. If either tween has updated or any of the components requires rendertime, then that frame is rendered. Otherwise no render will occur. In some cases this can be improved by splitting the scene into multiple canvases. One that gets updates rarely and one that holds the actual gameplay and is updated frequently. Though using that method is something that should be clearly thought out beforehand or you'll end up with multiple canvases to render each frame. Having render loop stop completely is something that you shouldn't do. As calling requestanimationframe is really cheap and not worth the trouble to build a mechanic with renderloop cancellation. Easier to just skip rendering on frames that dont need it.
  15. Update: Upgrade to Phaser 3.17.0 Implemented pools for player and enemy fireballs Added scaling to game config Updated to babel and webpack 4 to be in line with Phaser 3 Webpack Project Template
  16. https://github.com/pixijs/pixi.js/wiki/v5-Custom-Application-GameLoop As for how to detect if something was changed - we can't implement that because we value readability of PixiJS code more than that feature. Its possible to track changes in transforms, but everything else is difficult. Usually people just set special flag if they app changes something and add "if (flag) { renderer.render(stage); } " in gameloop
  17. Hi. Is this still relevant? I'm interested in collaborating with your team.
  18. How I usually use Pixi is that the render loop will just keep going. Which is fine for things that are undergoing constant change and interaction, but I'm considering using Pixi for something more static... something that'll display a certain thing.... be interactive and respond when needed, but really be doing nothing most of the time. What I'm concerned about is the idle CPU usage... it uses a relatively small amount of CPU to leave the whole thing running at 60fps doing nothing, but it feels inefficient and wasteful. (As a user of an older mobile device, it really drives me nuts when I encounter a site that's inexplicably a performance pig.) I'm just curious what other people are doing in these situations, and how you approach this. Does it make sense to exit the render loop when everything is finished updating, then have an event put us back in? Can you stop/pause Pixi itself? Or is this just more trouble than it's worth?
  19. I use webpack differently, I pack all dependencies (including pixi) separately from the main app, my page is then loading dependencies first then the app. This works very nicely. I did run into all kind of problem trying to pack everything into one file.
  20. I've been struggling to find a bit of paid work lately, so I have been working on a set of assets that I intend on packing up into an asset pack, the character is in the style of a project that I am currently working on in Phaser 3 titled: "Karzak The Slayer" where you play as a barbarian that has had his victory feast stolen by some mischievous goblins. The tile are nothing alike that project's tiles but any way, I was hoping to supplement the income I have from the days or work I find labouring here and there or odd contracts and this was the best way I could come up with. I started thee project when I was homeless which wasn't too long ago, and a friendly donation from a member of a game development community helped me out of that situation, where I am now under a roof and attempting to get things back up and running, struggling to find work is quite stressful and having my laptop stolen recently, I lost much of the work I would have used for my portfolio, so I decided to start this as a new portfolio piece and as a potential trickle of funds that I would divert to things like my Karzak project IF it gets anywhere. I started this post because I don't quite know of anywhere to post about it, collect feedback or opinions and the like, being an artist I struggle to think of what a programmer or non-creative would consider when looking for a pack of assets for use in any kind of development. I have tried many places like the itch.io devlogs, facebook and other sources to attempt to get some feedback, but people just like or share and rarely read the posts on facebook, which doesn't help when you're seeking information! So if any of you have some time (I apologize in advance if this isn't a good place for this kind of post) I do have some questions not only regarding where would be best for this kind of discussion but about the pack itself (I will share links below) To consider purchasing an asset pack, what do you consider essential? When looking at a character's animation set for a project's prototype asset or final asset, what animations are rarely there when you're developing your prototypes and have bought an asset to use? Do you prefer to get a whole set of assets intended to be used together or do you mix and match? ... I do have more questions but I have a doctors appointment that I cannot miss and time is getting on, I will add more later. Asset Pack Previews: Album link - https://imgur.com/a/r4qs6Dy The above link contains animation previews of both the character and a handful of the enemies, UI previews and some basic tiles I've made. All of the tiles are at 16x16. Monkey Boy Character Asset: I genuinely struggled when it came to the character, I had no idea of what to create, my mind was completely blank, but I didn't want to sit around doing nothing and I hit a creative block in the level design for my project Karzak, so I felt that I needed a little break... Anyway, a random thought came to me about Monkeys and so I decided to make a Monkey-like-Man or as it turned out, boy, and that's how the character was spawned into existence. The style of Karzak was well received and that was just with the prototype art so I decided to use a similar style with these assets and I hope that is instilled in the character, these previews above are not finished though and will get a lot of polish before they are released, but that style will remain the same throughout. Hopefully you can tell that the run style is intended to be a man/boy mimicking a monkey's run. The animations that caused most issue where the jump which there isn't a preview for yet, and the death, I couldn't figure out how I wanted it to look, there will likely be multiple death animations eventually though as I intend on updating the pack a little even once the baseline set is polished and released. At first I wasn't quite sure about the character, I was really unsure in fact about how it looked but it grew on me and now I quite like it! The Snail Enemies: The idea is that these enemies would be able to transition to a vertical climb obstructing the player at times or causing the player to have to get hurt to avoid a greater or stronger enemy, but these blue ones can only move in one direction, whereas another coloured variant would be able to turn around and move the other way, following the direction of the player but sticking to whichever surface they are still on. There is intent on adding an enemy that does this but can hop to local tiles in pursuit of the player. There is a slime enemy that is not yet finished, A giant fish that leaps out of water to get to the player across certain deep water gaps, plant based enemies that are ranged and melee that can leap out of the background to strike the player based on many variations in mechanics or triggers. Conclusion: There is still a great deal of work left to finish on these assets, and it is at this point, taking some time away from my project Karzak, but I am having fun and hopefully it helps a little in the long run with supplementing a little trickle of funds towards it. In any event, it will help me update a new and fresh portfolio with some content that is consistent. I hope to get some feedback from potential users or people that have used assets in the past. -------------------------------------------------- Karzak The Slayer: Title Screen Logo - https://imgur.com/8jLPwa0 Character & Enemies - https://imgur.com/l8yYjHY Old Phaser 3 Demo Screenshot - https://imgur.com/S0fseQt Karzak Animations - https://imgur.com/wIcLPmz Updated Tiles (Style) - https://imgur.com/g4jROEN - https://imgur.com/ruoXbVn -------------------------------------------------- Random animation samples: Goblins - https://imgur.com/a/BwZS3 -------------------------------------------------- I hope you're all having a good day and developing some awesome projects! Kind Regards, Patrick.
  21. I suggest to add a temp method to debug and understand. function debug() { const d = new PIXI.Sprite(PIXI.Texture.WHITE); d.anchor.set(0.5); return d; }; than you can create your sprite and understand how pivot anchor rotation will work. const sprite = new PIXI.Sprite(texture); // setup anchor, pivot rotation .... sprite.addChild(debug());
  22. You can flip the texture region. "new PIXI.Texture(texture.baseTexture, texture.frame, texture.orig, texture.trim, 12)" , 12 is one of flip rotations. That way you can change texture instead of setting scale to -1. I implemented that stuff to help that kind of cases, and so far I didnt see other renderers that allow that. Big demo: https://pixijs.io/examples/#/textures/texture-rotate.js
  23. @iamsam We discussed it here: https://github.com/pixijs/pixi.js/issues/5694 . PixiJS team is not sure whether to add extra package to support stuff webgl without stencil, because there can be something else wrong on that kind of drivers. Graphics masks wont work without stencil, we have to add code that swaps them to alpha sprite masks. I think we can actually do that , but only after we solve some of other issues, I'm getting dogpiled by them.
  24. That's one of big problems with text. WebGL and animated vector text aren't made for each other. Text texture never mipmapped because we cant be certain if texture are pow2, and pixi-v4 cant just change the filtering on fly. Did you read "Text" code? you can actually hack it that way the canvas size is pow2, and PIXI.Texture takes only part of its area. If you go further in Text code you'll see how it works - it actually renders canvas2d css text and uploads stuff to videomemory only if it was changed (changes texture updateID). If you store some FIXED pow2 size, and set the mipmap, pixi-v5 can also generate new mipmaps every time this things is updated, but I'm not sure about v4. That way there'll be no allocations. There are many ways to solve those issues, like sdf, msdf, I have experimented with them a lot, but I cant teach you all that in 5 minutes. You have to spend time to get good result for your case, because its not the easy task.
  25. Getting Error While Importing BabylonJs Editor to Unity(2019.1.3f1) 1.No BabylonJs Tools found in Unity (After Importing 2.C# Compiler Error(Microsoft (R) Visual C# Compiler version 2.9.1.65535 (9d34608e) )
  26. Thank you for your response. SDF Text doesn't seem to fit my goals, unfortunately. I made a quick video where I animate the text using this package and, as you see, on smaller font sizes it has some extra-sharpness artifacts. Same as if I go with big fontSize and just scale it down via `scale.x / scale.y`. Tried with antialias on and off, no real difference That's what I did for now – I took the middle between the largest and the smallest sizes, so if text animates from 80 to 160, I use fontSize of 120. This ensures that the text doesn't look too bad when it's big and when it's small... However, I really want to try to make it look better than that. I tried with no effect – AFAIK Pixi always forces mipmaps whenever possible. I'm starting to think of reinventing the wheel and switch textFont size only on certain values and use scale.x/scale.y in between...
  1. Load more activity