Green square on game canvas using Phaser - phaser-framework

Can someone please tell me why I'm getting a green square on my Phaser game canvas as below?

Without seeing any code I can tell you that you'll see that when an image can't be loaded by the Phaser framework.
Open developer tools in your browser of choice and refresh after opening the Network tab. You should see a 404 for one of your images.
I believe if you look at the standard browser console you may also see messages about the name of the asset that it failed to load.

I had a slightly different case. Images were being loaded in the init function, which apparently doesn't work. I renamed that function to preload and suddenly the green squares are gone and the images show up.

My case was also a little different too; it appeared that all my image resources were loaded, but I think I was trying to create the sprites a little too quickly - in order words, I was trying to create and add sprites to my scene before the scene was properly loaded.
I'm going to try waiting until 'scene.scene.isActive(key);' returns a boolean of true.....maybe that's what will solve my issue. Failing that, I might just put in some sort of sleep/await promise of 1 second or something (not ideal, but might work)
ALSO NOTE: Part of the reason I was able to create my sprites too quickly was because I was doing so in my own custom function, not the typical create() function. Actually, the best solution is probably to create my sprites in the create() function and not a custom function...

Related

Trouble with the javafx 8 sample 3D application

Since the release of javafx 8 is coming up right around the corner, I figured now would be a good time to get better acquainted with a few of the new features. First on my list: enhanced (true) 3D shapes and rendering! Working for an engineering company, being able to integrate a rich 3d environment into some of our visualizations will be great!
In any case, I was working through the 'getting started' here and all was well. Able to compile everything, getting familiar with how they structure all of their layouts in 3d, etc. etc. It was great! After familiarizing myself with some of the more advanced translations, I decided to take a look at their final 'sample 3d application' that had things like mouse and keyboard listeners to set the angle and orientation of the camera, which was the only thing I hadn't done yet. (you can find a link to the source code I downloaded for it, complete with a nbproject here It's called MoleculeSampleApp.zip and it's in the top right corner of the page).
So I go to compile it, everything shows up just fine, the molecule, the axis, and then I try to initiate any action at all, a mouse click, drag, a recognized keyboard input, etc. Everything on the scene simply vanishes.
Well that's strange, I think to myself, so I take a look at the code. Everything looks to be in order, and a few print lines later, I find out that the contents of the graph aren't disappearing until the very END of the listener, whenever that happens to be. Nothing inside of the listener is actually causing the disappearing (unless of course it's the hide/show keyboard shortcuts).
To be honest, I'm a bit baffled by this. There are no exceptions being thrown, no errors printing out. It just disappears, and that's the end of it.
If anyone has any idea why this is happening I would be immensely grateful. It's worth noting, I'm using the javafx 8 developer preview b132.
(if you would like me to post the entire source here, let me know, it's only about 600 lines altogether, but that's pretty heavy for a SO question so I'm just going to leave the links for now).
tl;dr
The moleculesimpleapp.zip located here makes everything disappear on any action it knows to listen for, with no clear reason, why?
-Will

Draw flowchart on webpage as navigation menu

I need to draw a simple "flow chart" that is used to navigation on my site. What I have been doing now is that I've drawn this MSPaint, then I add pixelmaps so that it navigate the user to different pages according to where in the pictures he clicks.
What I also want is that the page the user is on, changes colour (for instance, if user clicks on step 3, he navigates to page 3, and the page 3 changes colour to to green).
What is the best method to implement this? SVG? Canvas? JavaScript? CSS?
All answers that can point me to the right direction is very welcome.
Your first mistake here, I'd say, is that you're using pixelmaps; for something as simple as this, I'd recommend just making it a pure HTML/CSS entity, then giving a .active class or some equivalent to whatever page you're actually on. This is the easiest way of doing things in my books, and it has the benefit of degrading gracefully if the image fails to load for whatever reason.
That said, if you don't want to do it that way and are really attached to the static image for whatever reason, you could have variants of that image where the specific step is highlighted, and display whatever image is appropriate for that page. That would accomplish what you're looking for, but I wouldn't recommend it--it's very heavy in terms of network usage when compared with an HTML solution.
Now, bear in mind you could draw this with canvas, but that seems like overkill in this situation if you're basically just drawing a navbar; if you were drawing a full flowchart already and just wanted to reuse that code, well, that would be a different story; but in this case, with static imagery, just use HTML--it's just faster and easier.

Interacting with a SVG in Pharo?

I want to get a very basic interaction with a SVG loaded through Athens in Pharo using Morphic. This example shows what I'm looking for. I have used
(ASVGMorph fromFile: 'lion.svg') drawOn: Display getCanvas
but clicking the SVG makes the picture dissapear. However all examples I have seen were using a web browser. Is this possible using Athens? There is any other work in this area?
That's because you are drawing it in display canvas, which is refreshed every time... so is natural that you lost it...
What you need to do is:
(ASVGMorph fromFile: 'lion.svg') openInWorld.
or better, you probably want to put it in a window:
(ASVGMorph fromFile: 'lion.svg') openInWindow.
at the end, you will probably want it inside some other morph that you create, but debugging anyone of the solutions above with show you how to proceed :)
Yes, as Esteban pointed, to keep morph on desktop, you should add it to world, i.e. use
openInWorld, or #openInWindow.
ASVGMorph is very basic, however, and not intended to serve all possible use cases.
For more advanced uses, it is preferred to use ASVGRoot instance and draw it in own morph or compose with other drawings.

Custom navigation Titanium

I need do a very special nav or tab bar for a app, I looked this but I not have idea how to make some similar, I work with Titanium mobile, someone with experience could tell me how to make some similar with Titanium, or if someone have other navigation bar more complex that the examples on the kitchensink.
This is where I'd start. Understand that that video is obviously a complex interface and will definitely take work on your part.
This (http://softlywired.com/ticustommenu/) piece of code will get you started, but you will need to go way beyond it writing that interface control. I'd then move on to creating the boxes that pop up, without animation, down the center. After that was working, I'd look at animating them and adding the event listeners to it.
You'd be a star in the Titanium community if you got it working and released the source code to it.

Strange behaviour in my android app (Android 2.3.5) - Things get inflated wrong

I've been experiencing some very strange behavours in an app I'm developing. The app is not very advanced, it stores a couple of places in a sqlite database and is displayed in listviews, on a mapview etc. So, when browsing through my app after deploying it to my phone everything works great, but after a while one listview doesn't get inflated. A scrollbar appears as if the items were there but I can't see them. I push the back button to close the app. When revisiting the app my first view, which has two buttons, gets all messed up. The buttons fill the viewport and the background disappears etc. I can't figure out what's wrong.
Anyone else facing these problems? My phone is a HTC Desire HD with Android 2.3.5
The app is pretty "layout heavy", if you know what I mean. The listview items has custom background images, I'm using custom fonts etc. But the app is running smoothly up to the point when it freaks out and displays/don't display everything wrong.
My first thought is there is some kind of memory issue, ideas?
EDIT:
I believe this might have something to do with defining and using #00000000 as transparent color. Use #android:color/transparent instead.
SOLUTION:
So after doing some testing I found that what I previously mentioned in the edit really is the cause of this problem. I had defined the transparent color in my colors.xml as #00000000. This seems to work, sometimes... And other times it grabs a drawable instead, but not a drawable that is named "transparent", it grabs ANY drawable. Weird but true.
After some testing I finally found the cause of this problem. I had defined the transparent color in my colors.xml as #00000000. This seems to work, sometimes... And other times it grabs a drawable instead, but not a drawable that is named "transparent", it grabs ANY drawable. Weird but true.
So to fix this problem you should use #android:color/transparent instead when you want transparency on, for example, a view background.
If there are memory errors you should be able to catch them in logcat. You'll get "VM failed on xxxx byte allocation" messages (or the like).
Silly/stupid answer: often when I run into layout issues within my app, it's because I needed to do a clean build after having changed my layouts. You might want to start there.
Edit: You might also try the emulator, and if you suspect memory issues you could start the emulator with a small heap to force the issue to occur sooner. You can also check your heap usage in DDMS or with the Eclipse MAT to see if it's leaking.
I was experiencing the same problem on Galaxy tab even with #android:color/transparent. Was able to fix it only by replacing android:background="#color/transparent" with android:background="#null".

Resources