I'm experiencing a strange PNG issue in my as3 flash project. I am loading a bunch of PNG's into flash which have gradient transparencies.
In early slides, these are displaying correctly, later on in the project, the gradient transparency is showing as a solid black background.
Is this a memory issue? I've been pretty hot about memory clean up. All the images are loaded in using exactly the same scripts, and I can swap the images around with the identical results. It just seems like after a while flash stops showing the transparency right.
Images of my problem can been seen below.
Working:
http://s331209305.websitehome.co.uk/board/working.jpg
and then after the first level has played:
broken:
broken.jpg (same url as above with broken.jpg at the end (apparently as I am a new user here I can't have more than one url in a post))
I've been search Google for literally hours but can't find anyone experiencing a similar issue.
Any advice very much appreciated.
T
Ok, I know this is an old post but I too searched for a long time on google and only found this reference to the problem I was having as well.
Anyways, long story short, I fixed my issue.
The problem was I had set the alpha way to high. I set it to 5 and it did something similar to yours. I had to make sure the alpha was always clamped between 0 and 1.
Hope that was your issue as well.
I'm curious if you are loading them on top of each other, and you start seeing buildup.
it's hard to tell what exactly is going on without seeing any code, but here are some ideas
make sure that the BitmapData has
alpha enabled (this is usually done
through the constructor)
if this is a
memory issue (though this doesn't
seem like it is) try using object
pools. the HYPE framework has one,
but there are others too.
Check how they are loaded. I use the casa lib for loading, which makes the handling of the images easier, I load pngs through it and haven't had any issues like this.
post a simplified version of the problem. I've solved a problem countless times where I tried to post the problem, but would simplify it to the bare essentials and end up seeing the cause.
Related
I'm not sure entirely what's going on here. I'm exporting SVG's from Illustrator artboards. In the boards, they are exactly the same size (this is an icon set).
However when I set them as a background image there are some that will consistently not "fill up" the space they're set to take up in the height/width parameters.
Here's a jsFiddle to show what I mean. These were both exported the same exact way from Illustrator.. and if you inspect the smaller one it physically takes up as much space, as if there was an inside padding. So even if it make it twice as large in CSS with a width/height: 110px;, it becomes hard to position as it pushes other elements away.
I have a total of 6 icons used in this set, and 4 of them are exactly the same. There's 4 that are smaller like this though & I'm not sure why this is.
First of all shouts out to ccprog for noticing I had an embedded PNG of a prostate massager in my SVG file. Definitely defeats my purpose of using SVGs. Took it out and while the filesize went down by 2mb I still was facing my original issue.
If someone has any insight as to what's going on here that would be amazing, but hopefully this helps out someone else running into this.
I was using Shopify when I noticed this but this appears to also affect my jsFiddle so I don't think it's specific to certain services (although I know Shopify does a lot of stuff in the bg in regards to compression, etc.) I had tried every export option I could in Illustrator. Someone in this answer suggested something about saving normally rather than exporting, and allowing the -01 suffix Illustrator automatically appends.
I did this and it worked all of a sudden. I played around and took the -01 off of the filename and had the SAME issue as before. So next I saved straight from Illustrator and made sure there was no '-01'. Again, the issue persisted. I just renamed the file, putting -01 there. No issues.
I have no idea why this is but using '-01' at the end of the file name corrected my issue. I didn't change anything else.
I have an interesting problem.
I was making the solar system for fun, which can be seen here:
http://jessemorgan.me/solar-system/
Everything is working fine until I add Saturn, or anything after Jupiter. When I do that, all background images disappear, however are still being loaded successfully. Then out of curiosity, I added Neptune as well and Saturn's border then wasn't visible.
After debugging, I found that if I lowered the width/height of Saturn's orbit significantly, everything became visible again. That, for obvious reasons isn't a solution though.
It's all pure css/html. I only added jquery for zooming and popups. So hopefully, the solution will be a rather easy one. I'm just not seeing it.
Saturn and Neptune have been commented out, but all of the code remains.
Does anyone know why it's going all wacky?
Just a note and I will expand later... have you run it without Javascript? One of the parameters in your JS code could be funky, which would mess with how far you're "zoomed" in, when you really aren't--essentially cutting off parts of the solar system.
So here's a fun one for you guys. Is there a limit on the number of images that can be imported into Flash or Flash Builder?
The answer, I would initially think, is no, however my current project is telling me otherwise. It started in Flash Builder. I was embedding images and etc like normal, using the standard "" code, when I noticed that when I exported the release build, some of the images would be missing. I went through all the links, everything was fine. I looked at all the images, they were all there. Eventually, I began shifting positions to see about layering issues, and I found something odd. Images that were being loaded first were also being removed after a certain number of images had been loaded. This interesting dilemma was also not tied to any specific image. Changing visible properties for different images would always cause the same results: the newest visible image would be added in, but the background image would be removed. There are a total of 65 images that may or may not need to be onscreen at any point in time. There are also 29 buttons, but they don't seem to affect anything when they're marked as visible or not. 22 images seems to be the safe number. When at 23 and 24, it seems to occasionally throw graphical errors when hovering over a button, in that all the area around the button seems to disappear to black. Upon reaching 25, the entire background image goes missing and there are more graphical errors when hovering over or clicking buttons. And for clarity's sake, these screens are not from the actual project. There copyright issues or US trade secrets or something that I could probably get fired for for showing. Either way, these images were put through FB and are exactly how they showed when I ran it.
How it should be:
https://forums.adobe.com/servlet/JiveServlet/downloadImage/2-6434400-644532/450-365/howitshouldlook.png
What it turned into:
https://forums.adobe.com/servlet/JiveServlet/downloadImage/2-6434400-644531/450-369/howitreallylooks.png
Note that there are 31 images in this example, including the gray/grey background. So yeah. Either I'm doing something wrong with how these are put into this project, or Flash Builder and Flash don't like it when you've imported over 22 images into them. I'm including Flash in this because a co-worker suggested I build it in Flash instead and do some wonky coding as a work around. Once I dragged the 20-somethingth png file in, things started to disappear. Then, when doing a ctrl-enter test, nothing is visible but a few of the upper layers, and yes, I've checked to make sure things weren't turned off/on.
I cannot give you code better than I've already stated, because that is literally all that is in the file. The Flash Builder SDK being used is 4.1, Flash version is CS 5.5. I have also fixed my .ini file so that it gets max memory without the extra crashing.
Thanks in advance guys :D
The issue is not the number of images, but the number of transparent pixels to render. It is a compositing optimization that has been in Flash Player since at least Flash Player 4 (though it was 8 instead of 23 at the time). As a side effect, it used to be a hacky way of creating interactive masks back when masks could only be layers in Flash Pro.
It doesn't even have to be images. If you make a movie clip and set its alpha to below 100% (but above 0%) and stack 23, whatever you put under it won't render. The number of compositing layers before giving up is ties to the SWF version you are targeting as well (for backwards compatibility).
(this was one of the first things I asked the Flash Player architect about when I worked on that team)
I'm using haxe and openfl to create an html5 application. I tested the app in multiple browsers and devices, all work fine except in Chrome on iOS 7 only. The images used are not appearing seemingly randomly. Every time I re load different images appear and others disappear with exception to a couple that are always there. Here is what I tried:
I tried setting the z-index on the canvas that is used for one of the missing images, as well as a bigger width and height.
I know that the images are being loaded, I used Charles to take a look. There are no errors in the console log and changing the time and place where the images are being added to the display list in haxe changes nothing.
I swapped out one of the images that are always there for an image that is never there and it still didn't load.
The file names had a couple dashes and spaces in them so I changed that as well with no effect.
It's a very strange problem that I can't seem to diagnose. nor can I really find anyone with a similar problem.
The main issue is the fact that I can't see what haxe is building that might be causing this issue.
This is hard to answer without code samples. My advise is to look at what's different about the pictures that stay versus the ones that don't, both in how you're coding and the pictures themselves. I've had problems with images displaying correctly on ios only to find the problem was embedded somewhere in the metadata of an image. Hope this helps.
I want the visitor to see the loading GIF as soon as he enters the website, until the the website has completely loaded and ready to go.
HTML:
<img id = "firstLoadedImage" border="0" alt="title" src="Pictures/loading.gif" />
There is no CSS associated with this.
And I loaded every other image through my javascript document.ready call. This is the only occurance of declaring an image in HTML or CSS, beacuse I know that all the images are loaded together if I do that, but I only want this gif to load first.
But the problem still exists where in CHROME only, that there is a very noticeable delay before my gif image actually loads and starts to animate. I've extensively researched this and found the best matching solution, yet I tried their ways to find that it's somewhat a slightly different case from mine. - Loading GIF (Preloader) gets stuck only on Chrome -
The difference being that I'm using the GIF before the entire web page finished loading. I've tried dataURI with base64 already. It didn't work for me, as the same reasons from #amiregelz OP stated in his comments. So the only other solution is deleting the delcaration:
background-attachment: fixed;
But the only problem is that I never even used that code anywhere. So I guess the problem is now, what should I try next.
Any help from Guru's would be highly appreciated. Thanks in advance.
This issue should be fixed now in the newer versions of chrome.