Popular Content

Showing content with the highest reputation since 03/14/19 in all areas

  1. 3 points
    No bans are happening here (yet). @5neia_opo2@google-mail.ooo, try to understand the frustration people are experiencing. A new user came to the forum and in nearly every post they made trashed the project they were asking about. A lot of people here put in a lot of time and effort to not only to develop the project, but answer questions here as well. I was definitely frustrated reading your responses as someone who has put 6+ years of their life into this project. @botmaster did a poor job of handling that situation, but has apologized and I'm sure will do better in the future, as will you as well. Let's all be adults about this, acknowledge we did something wrong, and move on. @5neia_opo2@google-mail.ooo you are free to ask any question you need help with, but I definitely recommend reading through some tutorials, the examples, and checking the API docs before asking questions. It will often lead to you finding the answer yourself, and there will be less fatigue for the people answering here on the forum. I'd also recommend you approach things you don't understand, or decisions you disagree with, with a more open mind. Try to learn and grow the new library, not all libraries are alike and different problem spaces call for different solutions. Having a bad attitude is a good way to earn ill-will in the community and you may no longer get the help you expect if you are ungracious about it. When you find inconsistencies, or things you think should work differently, then change it! Pixi.js is an open source library built by the community. Everyone gets a chance to make the library better by contributing to it. The best way to get problems you have fixed, are to fix them yourself.
  2. 3 points
    I had some similar problems with this yesterday so I wrote up the workflow I found to work step by step. Hope this helps anyone else who finds this thread in the future. https://www.adammarcwilliams.co.uk/creating-bitmap-text-pixi/
  3. 2 points

    The future of web games

    Oh yeah, I remember reading that discussion. Well, to give my two cents. I think that discussion was pointless to begin with. I understand the question since there are not many popular hmtl5 games, but I would not call it dead, far from it. Web is a platform like PC, console and mobile. Most game devs use an engine like Unity3D or Unreal and export their game to platforms they can support. But games get exported more often to platforms where their game can run native because most games are too big to run smoothly in the browser. I mean, just look around and see how many devs actually created a 3D game in html5. Barely. And if someone did, is it probably low-poly. But that being said, that would be the only con I can think of. The biggest pro, and the reason I decided to go for HTML5 game dev, and not Unity or Unreal or any other engine, is because it is soooo damn easy compared to writing your game in C# or C++. I mean, all you need is a good IDE for web dev and your browser. And players don't even have to download your game. Heck, if you want to, you can put your game in a cordova container and export it to Android or iOS as if it is nothing. And just look at all the available resources. There are engines like Game Maker or Construct that allow you to export your game easily, as well as lots and lots of frameworks like Phaser, Pixi, MelonJS and so on. And also, since your game is actually a webpage, it can be integrated easily in many front-end technologies like Angular, ASP.Net, PHP and even NodeJS with Electron. That is also a very powerful benefit. Not to mention webhosting. I mean, a basic webhosting service is enough to host your game on since html5 games do not tend to be gigabytes big. Give it time. I admit I cannot think of a popular html5 game, but I am sure other forum members can fill me in on that one. I do see some gems once in a while. But those are often not only for web, but native too. They just have a web variant. You wont find yourself a whole RPG, but smaller games. But I like those, I am often very tired after work and to be able to play some small games while being half braindead is awesome, and very relaxing.
  4. 2 points
    I am making UI Components Framework for Phaser 3, that is driven by JSFL-generated jsons and atlases. It means that you can build your UI in Abode Animate, export it with given script, and forget about manual code positioning and building stuff! Please, try it out. https://xense.github.io/phaser-ui-comps-docs/tutorial-showcase.html Docs, examples, tutorials: https://xense.github.io/phaser-ui-comps-docs There are two basic things in this framework. First is ComponentClip, which is a view instance, it is recursively self-build by provided json and atlases. Second is UIComponentPrototype, which is clip controller. It can be easily extended to create any components, windows or whatever you need. Essential meaninig of it is that it doesn't need a clip to exist always. For example, you can change states of a root clip, and child clip can get new clip instances, ore lose them, and nothing bad happen. Some base components are already included UIButton has 4 states, "up", "over", "down", "disable" UIButtonSelect same as button, but behaves like checkbox, has 8 states, by adding "_select" suffix to UIButton's states when selected. UIButtonRadio Selectable buttons, that can be grouped to select only one of them. UIButtonDraggable same as UIButton, but also emits drag event, drag bounds can be self externally. UIScrollBar vertical or horisontal bar with draggable thumb and prev/next buttons. UIProgressBar Setup only start and end elements positions, scale, rotation or alpha, and this component will interpolate them according to provided progress value. UIScrollPanel Helper for scrolling any element with UIScrollBar. UIContainer Base container component to add other dynamically created components inside. Can be easily extended to create any types of lists, for example. I'm still working on new components and extending existing functionality. Tell me, would you use it, what else components you may need, and whatever you think about it. Any feedback is appreciated! Also I'll be thankful to any collaboration. Available at GitHub and npm
  5. 2 points

    ctx.clearRect() not working with Image.

    @James432213 hi, many issues here, all solvable. 1) The function named "canvas" rename this and avoid some confusion, call it "init" or similar 2) doKeyDown function has parameter "e" but references "event" in the switch - be consistent. 3) the functions doKeyDown, updateCanvas, drawPlayer are scoped "above" the "init" function, so they can have no easy reference to the "canvas" variable defined within "init". Notice also the name collision of "canvas" if we ignore step 1. Easy fix is to move these function declarations inside the "init" function. 4) There's nothing wrong with ctx.clearRect Some basics in how to debug your code will be beneficial, in particular the developer console (F12) is great, and using "console.log" can send helpful messages there from your code. Use that as a start towards watching the flow of your code when it runs, and where things are not actually working as might be expected on a first draft of code. This will lead to more advanced debugging techniques and more elaborate (and working) code.
  6. 2 points
    Do you draw something else than the video to canvas? If something taints a canvas then it stays tainted no matter what is rendered in the future. Or it might be due to stream becoming unavailable at some point for short duration and that could cause tainting (though the bug report I found on this should be already resolved, it was 5 years ago). Pretty sure it's some kind of edge case in security constraints which causes canvas to become tainted (by something), which causes security error when pixels are read from it.
  7. 2 points

    I hate designing levels!

    There! I said it! 😡
  8. 2 points

    I hate designing levels!

    Procedural generation can be a load of fun, but its a butt-ton of work to get working well. You could even use a genetic algorithm (GA) to create levels, have an automated actor play them, test the 'success' of the actor using fitness functions and then loop that process until you get levels (again, based on a heuristic function) that are fun to play. The up-shoot is that you can, potentially, create a near infinite number of levels like this. Or at least generate a manageable amount (say, 30) and manually curate them. Depending on how good your heuristics are you can create levels that are harder or easier for humans to play. It's a ton of work though. So depends on your mindset. Some crazy people find that a wonderful coding challenge.
  9. 2 points
    there is no public property available but you could use the following private property timer._pause working example: var timer = game.Timer.add(1000, function() { sprite.remove(); }); if(timer._pause){ console.log("paused") } else{ console.log("Not paused") }
  10. 2 points
    @dataj, I am pretty sure you can find all the information in the documentation. Maybe you forgot to associate your game to your business? https://www.facebook.com/help/publisher/709041312624617/
  11. 2 points

    Fading trail

    Here's the second one, super-v5 stuff: https://pixijs.io/examples/?v=v5.0.0-rc.2#/textures/gradient-resource.js Yes, you can use it as an alphamask. Why do you need though? Your trail is simple rectangle, right? In fact, that's one of common mask use-cases in Flash: alpha gradients. Its shame we cant replicate all that Flash stuff even after several years of coding.
  12. 2 points

    Fading trail

    First demo will be here in 5 minutes or so : https://pixijs.io/examples/#/textures/gradient-basic.js It took me only one cup of soothing tea.
  13. 2 points

    Fading trail

    What about create you gradient in other canvas. https://www.w3schools.com/graphics/canvas_gradients.asp var c = document.getElementById("myCanvas"); var ctx = c.getContext("2d"); // Create gradient var grd = ctx.createLinearGradient(0, 0, 200, 0); grd.addColorStop(0, "red"); grd.addColorStop(1, "white"); // Fill with gradient ctx.fillStyle = grd; ctx.fillRect(10, 10, 150, 80); and than, create `generate` a texture from this canvas context ? Am sure it can work ... but at the expense of performance. I do not remember which one, but there is a rpgmaker plugin that used this process with pixijs.
  14. 2 points
    I've got a situation my physics simulation is running at high framerate (60fps), but some devices my app runs on cannot run the graphics (PIXI) at 60fps without causing the physics simulation to stutter and jump, causing undesired artifacts. So, in pursuit of performance, I shoved the physics simulator (in my case, matter.js) into a web worker, but then still found that some devices couldn't handle updates at 60fps in the main thread. So I started setting an interval to apply updates from the simulation to PIXI at a fixed rate - 30 fps to start. However, sometimes even on some devices that was unsustainable. So, the question came down to - what FPS *should* my app run at? And when I say "run", I'm talking about changing the position of PIXI objects base on updates from the physics simulation, not about changing the speed of the PIXI's ticker. Since the speed at which I could apply updates from the physics simulation and still achieve sustainable render speeds without lagging varied from device to device, I decided the best way to decide on the FPS to run at would be ... let the app itself decide at run time. So instead of coding a fixed FPS, or giving the user a slider to adjust, I let my app measure and adjust it's FPS based on what it measures as sustainable while it's running. Enter my solution for my app, FpsAutoTuner: https://gist.github.com/josiahbryan/c4716f7c9f051d7c084b1536bc8240a0 - contributed here to the community in case it may help someone else solve a similar problem. It's framework-agnostic, no external dependencies, written as an ES6 class, but could easily be rewritten as a ES5 if you wanted. FpsAutoTuner works by measuring the FPS (which you tell it by calling `countFrame()`) and then every so often (at `tuningInteval`ms), it compares that measured FPS to the `fpsTarget`. When the measured FPS goes below `fpsTarget` less `tuningMargin`, the `fpsTarget` will be decreased by `tuningRate` and the `callback` will be execute with the new `fpsTarget`. Likewise, when the measured FPS exceeds `fpsTarget` less `tuningMargin`, then `fpsTarget` will be increased by `tuningRate` and `callback` will be called with the new target. Example usage: // Somewhere at the top of your file import { FpsAutoTuner } from './FpsAutoTuner'; // Then later in your code, probably in your constructor of your game object this.fpsAutoTuner = new FpsAutoTuner({ fsTarget: 30 callback: fps => this.setFpsTarget(fps) }); This assumes that you have a function called `setFpsTarget()` on your class, probably that does something like this: // This is just an example method, on your own class... setFpsTarget(fps) { clearInterval(this._fpsTid); this._fpsTid = setInterval(this._render, 1000 / fps); } Then later in the rendering portion of your code: // inside the render loop of your code, call: this.fpsAutoTuner.countFrame(); That's it! Your app will now automatically adjust it's FPS as needed when it detects lower/higher frame rates available. (FpsAutoTuner automatically starts it's auto-tuning timer in it's constructor.) There are plenty of options you can pass to FpsAutoTuner to tweak it - they are all documented at the top of the gist. Specifically of interest, you can set `tuningInterval` (default 5000ms) to change how often it measures/changes the FPS. This all has just been a humble attempt to give back to the community. Use and enjoy. Contributions/changes/suggestions to the gist are welcome! Download FpsAutoTuner from GitHub here.
  15. 1 point
    Jeremy G

    Pixel shift on iOS only

    I am having a strange issue that only occurs on iOS devices. I am working on a slot machine, and when the reels stop I need to animate the symbols that have landed. The reel symbols are standard images, and to animate them I overlay an animated sprite on top of them (at the same position) and play their animation. This works perfectly fine on desktop and android browsers, but for some reason on iOS the animated sprite seems to be slightly shifted to the left (like 1 pixel or seemingly less...). This also occurs when I use pixi-spine animations, but only on iOS. So far I have tried setting the roundPixels propriety of the renderer to true, but it did not do anything. I have also tried setting the precision of the fragment shader to "highp" but it did not resolve the issue. The game I am working on has not yet be released so unfortunately I cannot include screenshots/code from the project to illustrate my problem. I know this leaves you guys with not much information about the problem, sorry about that. I can provide more details and clarifications if needed. But I am not doing anything out of the ordinary, I am just creating an animation, adding it as a child of my slot machine's reels and then playing it. Since this is iOS specific I was wondering if there was a setting or something that I could try to eliminate the problem. I have even remote debugged my iOs device and when I do a console log of the animated sprite position and of the image position, I get the exact same values as I do on desktop and other devices. Previously I had an issue with "animation wobble" on ios (https://github.com/pixijs/pixi.js/issues/3742) which was solved by setting the fragment shader precision to high, but this is a different issue, it's really a position shift/offset. Also I am using the latest version of pixi. Does anyone have a suggestion I could try? Thanks!
  16. 1 point
    You could create a simple test case where you have a canvas, you draw the video there and then read a single pixel from it. If it gives the same error, then the video causes tainting. If not, then it's something else.
  17. 1 point
    Hello everyone I have a school project, which is called "corewar" to do. This is about coding a virtual machine in C, and running basic programs into its memory. I want to go further and create a "visualizator", which allow anyone to see what's inside the memory during each cpu cyle. Well, might sound very abstract, so here are som few pic to illustrate how it looks: A gif A video And my first implementation (see attached video) I have tried to use p5js but it's too slow. So I'm trying pixi, but I don't know how to get started, good practices, etc... I read the code reference (the doc), which is pretty handy, but it didn't give me any advises of how to structure my code, the right way to use classes (as PIXI.Graphics for example), etc... Right now, my code looks like this: function setup() { const app = new PIXI.Application({ width: CANVAS_WIDTH, height: CANVAS_HEIGHT }); console.log("Setting PIXI dimension to ", CANVAS_WIDTH, "x", CANVAS_HEIGHT); const bytes = initializeBytes(app); // An array containing all our bytes const processes = []; // An array containing all our processes document.getElementById('ram-app').appendChild(app.view); bytes.forEach(b => b.draw()); } class Byte { /** * rect: PIXI.Rectangle instance * renderer: PIXI.Graphics instance */ constructor(rect, renderer) { this.rect = rect; this.renderer = renderer; this.color = 0xFFFFFF; } draw() { const { x, y, width, height } = this.rect; this.renderer .clear() .lineStyle(1, 0x000000, 1, 0) .beginFill(this.color) .drawRoundedRect(x, y, width, height, 3) .endFill(); } } I have 4096 bytes (so 4096 instances of PIXI.Rectangle and PIXI.Graphics), and it's already really slow. I mean, I only have 20 FPS like this. I'm pretty sure I'm missing some obvious points, so any help to improve this code, and make it run @60FPS will be really apprecated Thanks a lot! Mar-25-2019 10-35-15.mp4
  18. 1 point
    HTML5 has become a trending technology in the current scenario of game development. Its dynamic update features and cross platform & cross browser compatibility gives lightyears of advantage as compared to its counterpart. This blog mainly talk about the benefits of HTML5 game development and why you need to hire HTML5 game developer. Read more: https://www.redappletech.com/how-to-improve-the-gaming-world-using-html5/
  19. 1 point

    Issue with FB Ads?

    @BerMon Why don't you request those features to the game engine creators then? They are the ones who know and control their engine the best. The only alternative is to make the changes by yourself. For most engines you will find tutorials made by developers who managed to do it.
  20. 1 point

    Fading trail

    Hi, I'm trying to create a fading trail using minimal graphic/sprite objects. Right now I have an object that is always moving at the same speed and direction, and I would like it to have a trail behind it. I've looked at the mouse trail demo, however, I feel it is unnecessary to use have to use so many objects just to make a linear trail (the trail I need will always be in the same direction), as I'm going to need 10+ trails at once. Here are 2 of the options I've thought of so far: Draw a rectangle graphics object, then use an alpha mask to create a fading an effect: Have a really long sprite as a trail, then use set its frame to the length I need. Which one would be more practical to use, and are there any better methods? Thanks!
  21. 1 point

    Fading trail

    @ivan.popelyshev Instead of Could you edit the sprites textures frame directly, like: var sprite = new PIXI.Sprite(<gradient texture>); sprite.texture.frame = new PIXI.Rectangle(<...>); // Edit it directly Or is this bad practice?
  22. 1 point

    Project MWX - multiplayer RPG

    Hey Semir, I am focusing a lot on my game editor at the moment, I've hit a point in development where I need a lot more attribute data for sprites and objects, and therefore need a easy way to edit this. I will always write here for you whenever I make any progress and be sure to keep checking my youtube channel for more videos in the future! I appreciate your interest in this, and in the future when I need help testing it, you will be one of the first I will ask! Thanks, Tao
  23. 1 point
  24. 1 point

    I hate designing levels!

    Had to look up the word heuristic so this can't be something I can do 😀. But I can see how this could be a lot of fun to someone who actually knows what they are doing. I guess that is how those guys that make the Flow games have so many levels plus daily challenges. I do appreciate all the feedback. Thanks!
  25. 1 point
  26. 1 point

    Extract with smooth edges

    Thanks. Next solution works fine: downloadBtn.addEventListener("click", e => { app.render(); const imageUrl = app.renderer.plugins.extract.base64(); let link = document.createElement("a"); link.href = imageUrl; link.download = "picture.png"; link.style.display = "none"; document.body.appendChild(link); link.click(); link.parentNode.removeChild(link); });
  27. 1 point

    right click event

    note that the console debug will indicate some missing information in the console. To debug with more precision it necessary to use breakPoint. The information in the console will be obsolete because they are compute only when you open the debug objet and can mislead you.
  28. 1 point
    I am trying to create a click through image gallery for a project in pixi. You can see in my fiddle when you click on the right side of the screen it adds the next image. The problem is when you click on the left to delete the image it will only delete one and not the rest. Can someone please help me with this issue. If you have any more questions, please feel free to ask. If there is a better solution please let me know. https://jsfiddle.net/jacob_truax/5p4n9a8m/2/ const createSprite = function() { imageCreated = true image = new Sprite(resources[images[step]].texture) image.width = 400; image.height = 300; image.x = left app.stage.addChild(image) step += 1 left += 40 } const removeSprite = function() { app.stage.removeChild(image) step -= 1 } loader.load((loader, resources) => { createSprite() }) nextTag.addEventListener("click", function() { console.log("next") createSprite() }) backTag.addEventListener("click", function() { console.log("back") removeSprite() })
  29. 1 point

    [Phaser 3] Maggot Diorama 2

    Hello everyone, Finally I finished glorified version of Maggot Diorama. It's still a tiny game now with bonus level which is more likely experimental thing. I also changed way to gather money "spend on defense stuff" and now I'm not sure if it's easy to understand how it works tho. https://www.kongregate.com/games/kiklop133/maggot-diorama-2
  30. 1 point
    @dataj I already shared the documentation with you: https://developers.facebook.com/docs/games/instant-games/guides/ads-monetization See the "Preload the ad" section to preload the ad when the game starts. See the "Show the as" section to show the ad when the player loses. I am not sure you need to know more than that.
  31. 1 point

    Fading trail

    I will interest by this later, because I remember that I will need to look this at it in depth. In fact I wanted to be able to generate texture guardian to apply this on a text box to generate a fadding mask text when scrolling the box. And the box are dynamic size, so i can not use photoshop in this context!, scaling the image will also scale the linear mask picture and give weird result. it's an old test with a filter for fake linear, but the subject is interesting. But am not energized to test it now . 😴
  32. 1 point
    its rotating relatively to container position. Set container position to (x,y) and remove those variables from positions of all children. Welcome to Flash world.
  33. 1 point

    how to Monetization facebook instant games ?

    @sisko Don't write in bold, it is not nice to the eyes, Have you read our documentation? https://developers.facebook.com/docs/games/instant-games/guides/ads-monetization You cannot use Admob within Instant Games.
  34. 1 point
    good work
  35. 1 point
    Here's a playground that reproduces the problem (some of it at least, the missing triangles aren't in the exact same place for me) https://www.pixiplayground.com/#/edit/wyw3c0oMPBlkeO5he3Wto I can confirm that this bug is not present in pixi.js@4.8.6 so I'll use this version for a while 😉 Thank Ivan, you're incredibly helpful 😄👍
  36. 1 point

    Gradient alpha on a shape

    pixi v4 or v5? Current way is to generate texture in photoshop or paintDOTnet . I can provive new way for v5 today or in weekend
  37. 1 point
    Based on ideas in this topic I've been working on my project and created two demos for PIXI v5.0.0-rc2: (will not be much different in v4) 1. framing texture + downsample, not easy to work with coordinates, no actual tiling: https://jsfiddle.net/scythian/sta0e87u/ 2. extending mesh class + downsample, won't work without power of two texture: https://jsfiddle.net/scythian/rkx0vzuf/ The question is, could the second demo be made a part of the SimpleRope as it adds about ten lines to it? If not, where should I publish a custom mesh for v5? There are no extras anymore.
  38. 1 point
    Haha I am the other way around, I have very little creative skills in terms of drawing/art and UI, but I love to code! The slot feels fantastic and very tempting to play for them sticky wild free spins! Interesting layout for a lobby, you don't see that normally but gives it a much better user experience in my opinion.
  39. 1 point
    most of devices will give you max 4096x4096 texture. Also, texture compression (DXT), pixi-compressed-textures. That's not GZIP , that's actually compression on pixel-level, it works on videocard. Split it or renderer will die.
  40. 1 point
    Jonny Shaw

    Freelancer | Digilocker Design

    Hi all! I've been floating around the forums for a few years now and didn't realise I hadn't posted a plug in here! 🤣 I'm Jonny Shaw, 35, & a freelance artist & designer, based in West Yorks, England. I have a background starting in UI design, but more recently have worked in 2D, 3D, animation, sculpting, & development too. Lately I've mainly been working on a lot of casino games, which also led into development with PixiJS, Spine & GSAP. The last of which ended up being a full game prototype (just minus the comms). Always on the lookout for interesting projects, so if you feel like my work may fit the bill, don't hesitate to give me a holla! Cheers 🍻 Jonny Shaw Website | Facebook | Behance | Artstation
  41. 1 point

    Physics: Arcade vs Impact vs Matter

    Arcade is a custom physics engine used in Phaser. The only body types it supports are axis-aligned rectangles (i.e. rectangles with no rotation) and circles. This makes its collision quite rudimentary, but quite fast - check out the Mass Collision Test example to see just how many bodies it can handle before it starts to struggle. Other than that, it gives you most things you'd expect from a physics engine - angular velocity, drag, acceleration, etc. It's also quite flexible; if you want to, it allows you to manually handle most aspects of collision, which can make it almost as powerful as other engines when combined with libraries such as SAT.js. Personally, I prefer Arcade in most cases because of its efficiency. Impact, as far as I'm aware, is the physics engine used by the Impact game engine. Out of the three physics engines in Phaser, I've got the least experience with Impact, but the examples for it should show you what it can do. One of its advantages over Arcade is the ability to have slopes in tilemaps, but it looks like it only supports Weltmeister maps (that's Impact's map editor), not Tiled or any other standard format. Matter.js is a third-party physics library. Unlike the other two, it's not intended for games, but for general-purpose use, which is why it's very powerful but not suitable for some types of games. More features and more flexibility necessitate more complicated logic, which obviously makes the engine slower. I'd only recommend Matter.js for cases in which you absolutely need realistic collision (Matter.js can simulate things like Newton's cradles) or complex body shapes.
  42. 1 point

    inheritance in phaser 3

    Here is how to do it using ES5: http://labs.phaser.io/view.html?src=src\game objects\images\custom image class.js and here is how to do it using ES6: http://labs.phaser.io/view.html?src=src\game objects\images\custom image class ES6.js
  43. 1 point
    RAF will fire as fast as it can, synced to display refresh rate. So on 60 Hz display, you get 60 Hz or less. On 144 Hz display it will run 144 Hz or less. On g-sync/freesync/hdmi 2.1 vrr, it can be anything. What needs to be understood here is that phaser doesn't provide you with proper game update loop. It gives you RAF loop (or fallbacks). It's on your to handle whatever you need, e.g. fixed timestep physics with interpolation. V3 had recently added automatic fixed timestep and manual update options to matter.js physics. I'm not sure if the automatic fixed timestep is still running off RAF (which makes the option kinda pointless), but you can use the manual option in any case. In my case, if the game is mostly async tween actions (think match 3 sliding stuff), I just use tweens and don't care about deltatime. As soon as I have any kind of physics or time based logic (even simple speed += acceleration), I switch to fixed timestep with interpolation. I did describe my approach in at least one topic here
  44. 1 point
    OIMO does it like this: https://github.com/lo-th/Oimo.js/blob/gh-pages/examples/test_collision.html#L209 You can edit shape.collidesWith and shape.belongsTo in an oimo rigidbody: https://github.com/lo-th/Oimo.js/blob/gh-pages/src/shape/Shape.js#L68
  45. 1 point
  46. 1 point

    Text Underline [SOLVED]

    I just finished extending the Phaser.Text object to add underline functionality. You can find the code here: https://github.com/brentstrandy/phaser-underline-text/blob/master/underlineText.js Any feedback would be appreciated!
  47. 1 point

    Text Underline [SOLVED]

    I found a workable solution by manually drawing lines under my text. It's quite straightforward too. // Text Object containing the string to be displayed let textObject = this.game.add.text(0, 0, 'My Text', { font: '18px Verdana', fill: '#000000' }, this); // Graphics Object used to draw a line let underline = this.game.add.graphics(textObject.left, textObject.bottom - 7); // Specify the line (size, color) underline.lineStyle(2, 0xE21838); // Location to start drawing the line (x, y) underline.moveTo(0, 0); // Draw a line the width of objectText's string underline.lineTo(textObject.width, 0); TIP: If you need multi-line support you can use precalculateWordWrap to break apart your string into an array and write some fancy code to put underlines below each row of text.
  48. 1 point

    stop the mesh animation (autoAnimate)

    you should just use scene.stopAnimation(newMeshes[0])
  49. 1 point

    Is there a double-click feature?

    From what I've seen of the code, there is no double click event. However, there is an extra parameter passed into "onTap" that denotes double click: // Was it a double-tap?if (this.timeUp - this.previousTapTime < this.game.input.doubleTapRate){ // Yes, let's dispatch the signal then with the 2nd parameter set to true this.game.input.onTap.dispatch(this, true);That means you can have a double click handler by doing something like: game.input.onTap.add(function(pointer, isDoubleClick) { if(!isDoubleClick) { return; } // Handle double click.});Then again, you could also use the native dblclick event.
  50. 1 point

    Dealing with mouse wheel

    game.input.mouse.mouseWheelCallback = mouseWheel;function mouseWheel(event) { console.log(game.input.mouse.wheelDelta);}And there are 2 constants as well: Phaser.Mouse.WHEEL_UP and Phaser.Mouse.WHEEL_DOWN. The wheelDelta will contain either of those values depending on the direction of the wheelscroll.