Stage3D iOS Antialiasing on AIR 24 - ios

With AIR 24 release we are able to set anti aliasing on Stage3D now, but there are some issues with it. Can anybody help how to use it in right way without changing entire project code ?
The issue I have is that anti alias works great, and no more jagged edges, but there are rendering issues and I guess some texture normals are being inverted, also when using Occlusion Material there are some jagged material shadows...
Next thing I notice is when drawing Wireframe Globe with Lines Segments - the lines are visible on the globe all the time, no matter if you add some object in front or not.
So, intersecting line segments with other materials don't work at all, and lines are on the screen forever.
Please, help if you find any trick fixing the issues.
Thanks

Just to add some more information: the issue seems to happen when shareContext = true. Without Starling there is antialiasing and the lineSegments are rendered at the current depth. It would be interesting to see if it works with other sharedContext besides Starling to isolate the issue. If I find an answer I will come back and post it. It would be nice to get this working. Any idea the performance hit on mobile of having a second instance of away3d? Layering that way might be a dirty work around.
*****EDIT****
AntiAliasing on the line Segments only occurs with sharedContext. View3D class does not seem to have it's antiAlias value set anywhere and when I forced it to a value of 2, all hell broke loose.
Edit#2
Mesh appears above line segments, Sprite3D do not.

Related

Strange rendering behavior with transparent texture in WebGL

I've been writing a little planet generator using Haxe + Away3D, and deploying to HTML5/WebGL. But I'm having a strange issue when rendering my clouds. I have the planet mesh, and then the clouds mesh slightly bigger in the same position.
I'm using a perlin noise function to generate the planetary features and the cloud formations, writing them to a bitmap and applying the bitmap as the texture. Now, strangely, when I deploy this to iOS or C++/OSX, it renders exactly how I wanted it to:
Now, when I deploy to WebGL, it generates an identical diffuse map, but renders as:
(The above was at a much lower resolution, due to how often I was reloading the page. The problem persisted at higher resolutions.)
The clouds are there, and the edges look alright, wispy and translucent. But the inside is opaque and seemingly being rendered differently (each pixel is the same color, only the alpha channel is changed)
I realize this is likely something to do with how the code is ultimately compiled/generated in haxe, but I'm hoping it's something simple like a render setting or blending mode I'm not setting. But since I'm not even sure exactly what is happening, I wouldn't know where to look.
Here's the diffuse map being produced. I overlaid it on red so the clouds would be viewable.
Bitmapdata.perlinNoise does not work on html5.
You should implement it by yourself, or you could use pre-rendered image.
public function perlinNoise (baseX:Float, baseY:Float, numOctaves:UInt, randomSeed:Int, stitch:Bool, fractalNoise:Bool, channelOptions:UInt = 7, grayScale:Bool = false, offsets:Array = null):Void {
openfl.Lib.notImplemented ("BitmapData.perlinNoise");
}
https://github.com/openfl/openfl/blob/c072a98a3c6699f4d334dacd783be947db9cf63a/openfl/display/BitmapData.hx
Also, WebGL-Inspector is very useful for debugging WebGL apps. Have you used it?
http://benvanik.github.io/WebGL-Inspector/
Well, then, did you upload that image from ByteArray?
Lime once allowed access ByteArray with array index operator, even though it shouldn't on js. This is fixed in the lastest version of Lime to avoid mistakes.
I used __get and __set method instead of [] to access a byte array.
Away3d itself might be the cause of this issue too, because the code of backend is generated from different source files depending on the target you use.
For example, byteArrayOffset parameter of Texture.uploadFromByteArray is supported on html5, but not on native.
If away3d is the cause of the problem, which part of the code is causing the problem? I'm not sure for now.
EDIT: I've also experienced a problem with OpenFL's latest WebGL backend. I think legacy OpenFL doesn't have this problem. OpenFL's sprite renderer was changing colorMask (and possibly other OpenGL render states) without my knowledge! This problem occured because my code and OpenFL's sprite renderer was actually using the same OpenGL context. I got rid of this problem by manually disabling OpenFL's sprite renderer.

Triangle, with 3 levels, containing text on iOS

I need some advice with my current project. The big problem being, I'm an android dev, helping out on iOS for the next few days.
I need to create a triangle, with 3 levels of text (as seen in the image below). Just adding labels at the different levels is leaving me with a lot of unused space. I have also though of using CGMutablePathRef to create a triangle, but it doesn't seem I can add a label to it, like you can to a CALayer. Or am I missing something?
Please, any advice would be appreciated (and example code even more so, as my iOS skills are still quite shocking).
Regards

One image with alpha lagging spritekit

I am making a game, and it involves a sandstorm. I decided that the basic concept would be that I would make an image that looks roughly like a sandstorm, and then decorate it with some particles/whatever else it takes.
I ran into an issue at step one. I threw together a simple image for testing purposes:
I added that to my game, and the FPS dropped by 60%. I was surprised by the effect one image had, but I wasn't too worried about it. I cut the resolution of the image in half, and again, lots of lag.
Is spritekit/iOS really that bad at handling moderately sized images with alpha? I read on another question that the simulator is bad at rendering, but that can't be the entire problem.
Is there any hope for getting this to render without slicing my performance? The particles work well, everything else runs at 60fps just fine, but the addition of this image is apparently a severe drain on resources.
EDIT: I tested my game out on my phone, and I got no lag. So apparently, the simulator is just really bad at rendering after all. At the same time, I am curious as to how to speed up performance, as there is clearly some kind of lag going on.
I'm no expert on SpriteKit, but I had similar experiences with plain core animation and layering.
The issue is that an image with alpha, even for the "opaque" parts of it, it introduces a redrawing call on all the sublayers underneath it for every time it moves. First check if this is actually the problem, and then, try one of this, and see if it improves:
SKCropNode could prevent for rendering the underneath elements
Tile the image so only the border has alpha
Snapshot the underneath layers.
Reduce the amount of nodes being rendered, hide the ones that are "under the sandstorm".
And you should be using real devices to test performance of your game, you cannot rely on the simulator for that.

How to check intersection of two images that aren't rectangular?

New user to the site, but I have used it in the past so I felt it best to ask my question here, for the best chance of getting a response.
What I'm dealing with is one object, this being the sprite for my latest app, which I need to check for when it comes in to contact with another object, in this case, a tunnel which will curve.
Now, I'm aware of CGRectIntersectsRect, however I can't see that being helpful, as if I've got 2 UIImages, that being the top and bottom of a "mountain", and said pieces curving, there's no doubt that the sprite would touch the "rectangle".
What I need is something to trigger when the sprite hits the actual wall, however my limited knowledge of Objective-C isn't helping my case.
I imagine someone out there will know what I can do to resolve this, as for all I know it could be a simple solution.
Thank you in advance everyone!
First, I'd probably not build these basic pieces yourself. For iOS 7, you can use SpriteKit, which is built-in. If you want to support older versions of iOS, look at cocos2d (it's good for iOS 7, too).
But to the question, one approach for detecting arbitrary overlaps is to draw both objects into a buffer and check if there are any overlapping pixels (for instance, by drawing one in in pure red, and another in pure green, and then looking for pixels that have both). For a discussion of how to do this kind of thing in Core Graphics, see Clipping a CGRect to a CGPath, which provides sample code for the simplest version (checking for the intersection of a rectangle and curve), but the same approach can be used more generally. Note that this drawing can get expensive if you're doing it constantly, so usually you first check whether the bounding rectangles overlap. That tells you whether it's even worth the trouble to look closer.
But first I'd look at SpriteKit.

WebGL with CocoonJS - Duplicate triangle

I have a very simple test code which draws a moving triangle. In Chrome it works fine, however on an Android 4.1 Device with the CocoonJS 1.4.1 launcher (which funnels work to OpenGL ES 2.0) a random effect pops in:
The triangle is drawn, but quite often also a bit translated triangle is also drawn (more exactly, the extra triangle seems to be a replica of a formerly drawn one, but the distance is not consistently the same). The tri needs to be moved with some minimal speed for the effect to show (or maybe the replica is just hidden if moving is slow). The tint of the replica seems to be a bit different (even though the fragment shader color is constant), but it might be some alpha magic.
Other CocoonJS WebGL demos work fine on the device, however they don't exhibit fast movement. OpenGL benchmarks run fine.
Drawing multiple triangles has the same effect. Even though gl.Clear is used, it seems like part of some previous buffer shines through. Have you seen anything similar? Any ideas?
Thank you so much for your report, this is a known bug and we are working to solve this issue.
btw, by changing the setInverval time to this one: setInterval(loop, 16); should solve the problem temporarily.

Resources