R0J0hound's Forum Posts

  • Nevermind about using font-smooth css. Mac and iOS stuff only seem to support it. I tested on Chrome for windows and it does nothing. Oh well, so close.

    iOS uses the freetype library to rasterize it's fonts to an atlas, and while there is a js port it seems to be a very low level beast.

    Still looking though. Turning off text aliasing doesn't seem to be something you can reliably do without rasterizing the font directly which is pretty low level.

  • Looks like it works on iOS. Basic test. There’s some other css variations of font-smooth needed to support most browsers.

    Probably nothing we can do as users to get the text object to do this. CSS can only be added to elements added to the webpage or elements we can access. So best as a feature request or get a dev to make a custom text object plugin or something. Probably could get by using some js to draw to an html canvas, then get the dataurl from that and load it into a tiledbg object whenever you want to change text.

    <!DOCTYPE html>
    <html>
    <head>
    </head>
    <body>
    <style>
    #canvas{
    font-smooth: never;
    -webkit-font-smoothing: none;
    image-rendering: crisp-edges;
    }
    </style>
    <canvas id="canvas" width=100 height=100></canvas>
    </body>
    <script>
    const canvas = document.getElementById("canvas");
    const ctx = canvas.getContext("2d");
    ctx.font="10px arial";
    ctx.fillText("testing", 0,50);
    </script>
    </html>
  • Unsure. I’d have to fiddle with it. CSS lets you apply rules such as for all canvas elements on the page.

    The text object uses a canvas element that isn’t added to the page to render the text. That canvas is then copied to a texture which is then drawn. I think that canvas is hard to access directly, and will be harder once they obfuscate everything.

    Actually I’d want to take a step back and just try that on a canvas element directly outside of construct to see if it even works.

    If it ends up not working for text on canvas you could try it on the htmlelement plugin, or whatever it’s called.

    Beyond that maybe we’d need to bypass the browsers text rendering entirely and render text directly using a library like free type or something where we have full control. But realistically that would be to make a texture atlas that construct then uses to render text, probably via a custom plugin since existing solutions by using distort meshes or tiledbg to do it is too slow or may end up being too tedious.

  • You could try this css.

    developer.mozilla.org/en-US/docs/Web/CSS/font-smooth

    Says it’s supported by most browsers currently?

  • You can make the walls thicker and/or reduce the speed of the ball.

    Motion is an illusion, objects move by teleporting a bit each frame which can cause collisions to be missed. What’s probably happening in your case is the collision response is struggling with that particular collision polygon so it’s perhaps pushing out in the wrong way.

    Anyways another idea could be to clamp the balls position inside the box. Something like

    Set x to clamp(self.x, box.bboxLeft+radius, box.bboxRight-radius)

    And do the same with y with top and bottom.

  • You can apply a constant force downward. Technically force=mass*acceleration so the gravity force for a specific object would be that. But the physics units are flawed in the behavior so a constant like 50 would work.

    Alternatively you could set the y velocity to self.physics.velocityY+500*dt which would just apply an acceleration directly

  • You mean ranking who finished first? Just who collides with the finish line first. Typically you’d have a bunch of lines along the track that the players need to collide with in order to make sure the car is going the right way around the track.

    I made one such example a while back but you’d have to search the forum for it.

  • You probably need to use a for each in there with custom action

  • Can’t help since I don’t use export. That is annoying if remote preview is smooth but the export is not though.

    Is there a difference between exporting a debug apk and a normal release one? No idea of it relates to construct but in many other languages a debug build will perform worse than a normal release since it’s doing more debug stuff.

  • %or mod has no standard behavior across programming languages. Some, like js, will will keep the sign of the original number, and some will wrap around 0 to the positive number. Which I think would be more useful.

    Anyways since angle() gives an angle -180 to 180 you can convert it to the 0-360 range with

    (a%360+360)%360

    /// the second % is to get it back into the 0-360 range.

    Or

    A<0?360+A:A

    Alternately you could use the angle conditions or the angleDiff expression to check your angles. They can be helpful especially when you have to deal with the 0-360 seam

  • I'd imagine you could do it by setting the position and angles to each other and just using the move at angle action?

    I think you meant to use multiply instead of divide in that formula to find a point from another one.

    I only use the free version so I can't use too many layers, but here's another idea to do the masking with distort meshes and it just works with any angle.

    dropbox.com/scl/fi/big4tehj919tkonckmj3l/whackamole.c3p

    For the motion I'm using a spring which can be done with three variables and two actions:

    add 0.05*(self.goal-self.t)/dt-0.16*Self.vt to vt
    add vt*dt to t

    The first number is the spring stiffness from 0 to 1.

    and the second is the damping from 0 to 1.

    I tuned it so it overshoots the goal a few times, but if the damping is increased it won't do that.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • I'm bad at fixing other people's projects.

    Here's the idea using that math to rotate a sprite around any point. Here I used ox,oy instead of dx,dy, but it doesn't matter. One stands for origin the other delta. Anyways think of it as just an image point you can change and rotate around. It's in the range of 0 to 1 but you can use a value like x/width to specify position just like in the image editor.

    dropbox.com/scl/fi/toop24j18hlfyc46isfyq/rotate_custom_center.capx

    Honestly you can avoid much of the math if you set the drawingCanvas's origin to be centered and center it over the piece you are creating.

    Wackytoaster's way is probably the easiest way to make an object that breaks apart. Take the image, make the pieces, assemble them to calculate the offsets, and when you create the pieces you use those offsets. You can shape the pieces any way you want. I guess using distort meshes or drawingCanvas to mask out the pieces would make it easier to work with multiple images. Also dynamic piece shape and size could be possible with some work.

    dropbox.com/scl/fi/e5ozclhdtvjm1at8mwxcx/explosion.capx

    Anyways just some ideas and experiments.

  • You can rotate an object around any point with

    Rotate a degrees clockwise

    Set position to (x-cx)*cos(a)-(y-cy)*sin(a)+cx, (x-cx)*sin(a)+(y-cy)*cos(a)+cy

    Where x,y is the point, cx,cy is the center, and a is the degrees to rotate by.

    So one possible solution could be to keep track of an offset dx,dy from the object’s xy to rotate around. Initially you’d set that to wherever on the layout minus the sprites position. Then after that you’d update it with a helper function.

    Number rx=0
    Number ry=0
    
    Function vrotate(x,y,a)
    — set rx to x*cos(a)-y*sin(a)
    — set ry to x*sin(a)+y*cos(a)
    
    Function rotateSprite(u, a)
    Pick sprite by uid u
    — sprite: set position to self.x+self.dx, self.y+self.dy
    — sprite: rotate a degrees clockwise
    — call vrotate(sprite.dx, sprite.dy, a)
    — sprite: set dx to rx
    — sprite: set dy to ry
    — sprite: set position to self.x-self.dx, self.y-self.dy

    Alternatively a different approach could be to have dx,dy be values from 0-1 to specify a point within the objects quad. Then to use that as a center you’d set the angle between two set position actions. It basically undoes the offset, rotates, then moves by updated offset.

    Set position to Self.x-(Self.dx*self.width*cos(self.angle)-self.dy*self.height*sin(self.angle)), Self.y-(Self.dx*self.width*sin(self.angle)+self.dy*self.height*cos(self.angle))
    Set angle to anything
    Set position to Self.x+(Self.dx*self.width*cos(self.angle)-self.dy*self.height*sin(self.angle)), Self.y+(Self.dx*self.width*sin(self.angle)+self.dy*self.height*cos(self.angle))

    Either way you need to change angle via events. Can’t use with a behavior that changes the angle.

  • Here's one solution just that creates sprites covering horizontal and vertical runs of the same tile. Used an array to mark tiles that were already used.

    dropbox.com/scl/fi/l78tvqp8lz6oyo7fojcck/runs_of_tilemap_tiles.capx

  • The canvas is rotating around the top left corner. You can change that in the properties to be centered, but you’d also need to move it by half the width and height when positioning it.