There is a problem with the sprite animation on the homepage of one of my clients, but it only appears when the site is viewed on an iOS device, namely an iPhone or iPad. I can't replicate the problem on any other device or emulator, so I'm having an issue troubleshooting it (don't own an iPhone or iPad). The problem is: what looks to be a 1px line is appearing on the right edge of the animation frame pretty much all the time, and a similar line flickers occasionally at the top of the frame as the animation runs. The animation itself is a simple javascript sprite sheet animation. I'm operating under the assumption that I have the sprite animation programmed correctly since it appears correctly on every other device, platform and browser I've checked. It even works in IE.
Two questions:
What would cause a simple sprite animation to display differently when rendered by iOS?
As a small business consultant, I don't have the time and my clients don't have the budget for me to physically test on every single device, so I have to rely on emulators. What other options do I have if the emulators don't properly demonstrate what the device will display?
I'm not entirely sure of the protocol regarding posting a link to my client's production website, but happy to send a link to anyone willing to help that responds and/or messages me.
welcome to SO.
I spend a lot of time working specifically with iOS on the web and have run into similar situations. Without tweaking an example you post I won't be able to prove it exactly, but this should at least give you direction.
Flickering or semi opaque lines are often caused by the scaling set to the asset. In the world of high DPI displays and fluid layouts, there are differences in rounding that result in fine lines, shimmers, et al. Is there any scaling set on the assets, e.g. background-size, downsampling?
The emulators are displaying the software correctly - these issues are a result of hardware. Best thing you can do is buy a flagship for all of the platforms you test on, or look into local resources like Clearleft's Device Testing Lab
Related
I am fairly new to developing for iOS. I have a fully functioning program written in Swift and the UI was created in the scene builder on Xcode. I created an app for my work to simplify closing out the registers and other financial aspects. The app is complete and works perfectly, but was designed on the iPhoneX. The problem is that only a few of the employees have an iPhoneX, but they all have some kind of iPhone. I have tried setting up constraints but it never works. Ive tried scaling restraints and position restraints but I can't get the layout to look right on any other phone, and when I add the constraints it affects the view on the iPhoneX as well and doesn't look good on any iPhone. I need help getting this to work on all iPhones. I would like it to look and act the exact same regardless of the size of the phone, basically just scaled down. There are a lot of things on the screen and I can't figure out how to do this. Please help!!!
I have been working on this for a long time and I really need help. Please let me know if I need to clarify anything. I have posted links to some pictures of my UI so you have an idea of whats going on.
Constraints I tried adding, although I have played around with some other options.
Here's what it looks like on the iPhoneX, this is how I want it to look.
What it looks like on iPhoneSE (with constraints).
One thing I noticed in your Xcode project that none of your features are in UIView. Without it, it will be quite challenging and somewhat always different results. In theory, if you use AutoLayout features correctly it should work without UIView, but they make life so much easier. This is something I learned the hard way at the beginning of my iOS development. First set up your UIViews without any content inside it, give them some background colour to differentiate, once they are working on all devices. You can pin your features to superviews with no difficulty.
Since you have a repetitive features, you could also consider using Stack Views. You don't have complicated features, so as long as AutoLayout is set up correctly you should have no problems seeing it ok on all devices
Hi I have been working on a blackberry app and developed about 90% of the app .But my client wants the app should work on blackberry touch also. So I just wanted to know what changes I will need to do to convert the same code to work on blackberry touch .Please help me I am new to Blackberry app development .
Just to confirm, we are talking about a Java application running on BB7 or earlier OS.
The short answer is, it depends.
If you have used standard RIM controls (buttons, ObjectChoiceField etc.) then these will work on the touch screen with no change. If you have used your own controls, for example an image button, then these might not work very well - for example the button might not be big enough to be hit easily with a fat finger.
The other problem is the virtual keyboard, it may appear at points when you do not want it to and not appear when you do. Not a problem on a lot of phones, but remember there are at least 2 non keyboard phones out there, so the Virtual keyboard is the only option for typing.
The best approach is work through each of your screens and try them in the Simulator. Zoom the Simulator so that it looks like the real device. And pretend you are using a finger, don't rely on the mouse because you can position the mouse very accurately.
I would raise new questions about specific Fields that you have problems with, rather than continue this with any issues you find.
I am developping a swipe gallery for mobile devices. Users can change images by sliding the screen, as any normal images gallery in most iPhone app.
Here is a demo:
http://daviddarx.com/stuffs/work/custom/swip/
To debug the iOS orientation bug (which let the content zoomed when you change the orientation), I used the only library that correct that:
http://scottjehl.github.com/iOS-Orientationchange-Fix/
Unfortunately, this library is working perfectly most of the time, but it happens to fail and not work correctly. This happen around 1 time on 10 times, and the result is then the same as if the library wasn't here.
This is not a huge problem on most of the mobile and responsive website, as the user can manually dezoom and then get back to the normal display.
But the problem here is that I had to disable the zoom function, to make my system work correctly. So, when the bug happen, once on 10 times, the gallery is then just bugged and stay like that....
So, here are my questions:
-do you know any other library that manage that bug fix, and is 100% completely reliable?
-if not, do you know a way to correct the used library to get a 100% support rate?
-if not, do you have any idea or solution for me?
Thank you in advance for your help!
David
There's an outstanding pull request on Scott Jehl's repo that uses slope detection instead of absolute values which seems to not suffer from the intermittent-ness of the original solution.
https://github.com/PeterWooster/iOS-Orientationchange-Fix/
I am developing a small web application optimized for iPad (using mainly javascript & CSS quirks and hacks). However, there is an issue that I just can not find or come up how to resolve.
The thing is that if I change the orientation of the iPad, during the rotation animation a transparent ("checkered") background is shown in the places that were not rendered in previous orientation. One guy on forums.macrumors.com posted an excellent screenshot illustrating this behavior. The thing is, since my application has a rather dark look and & feel, this checkered background showing during the rotation seems to be awkwardly out of place.
However, this guy's screenshot was for the iPhone - that said, and considering that stackoverflow.com is more programming-focused, I thought I'd ask if anyone struggled with and, hopefully, successfully resolved this issue.
Safari displays the checkered background when the rendering can't keep up (try scrolling really fast). As far as I know there is no way of changing the pattern.
Does anyone know if the iPad has any limitations on the canvas tag?
Currently I'm working on a creative that uses a flipbook and audio tag combination to simulate inline video content. The animations are drawn to the canvas element and synced with the audio content being played. There are 4 short video clips that get played when someone clicks on the four buttons below.
http://cs.sandbox.millennialmedia.com/~tkirchner/rich/K/kungfupanda2_test/
The problem I'm having though is in iPad. After playing a few animations, mobile safari just suddenly crashes. It never happens when I play it on my iPhone but it happens every time on the iPad. Its not one particular animation either because if I click a different combination of buttons, the previous clip that it crashed on plays fine, and then it decides to crash on another clip.
I think the problem might have to do with the amount of memory Safari gives individual page views. I found a blog post that explains that problem pretty well.
http://roblaplaca.com/blog/2010/05/05/ipad-safari-image-limit-workaround/
According to that post, once mobile Safari reaches a particular threshold of memory, images begin to return blank. This is consistant with my finds so far. The iPad that I'm testing this all on is running iOS 3.2.1 (and before anyone tells me that I should just explain to my boss that nobody uses 3.X anymore, I tried... they still want me to investigate this). I borrowed a co-workers iPad running iOS 4.2.1 and that device didn't crash, but some of the images weren't being drawn to the canvas.
I'm pretty sure its a problem with the canvas tag too, because I tried experimenting with running the animation without drawing anything to the canvas element, and the page never crashed.
Thats why I think maybe its a limitation with Safari's support of the canvas tag. Of course, I'm open to anybody else's suggestions.
Feels kinda weird answering my own question again, buuuut I figured if anyone did a search on this kind of question, an answer would be helpful.
I believe my original hypothesis was correct. The total amount of images that the aniamtions were using was around 600+. I think the older iPad loaded as many as it could and then when it ran out of cache and the canvas tag was trying to draw images that weren't really there anymore, it crashed.
Eventually we ended up serving the ad to devices with iOS 4.2 and higher, since the problem didn't seem to occur on those newer devices. Plus, we compressed the image sizes further, so that helped reduce the amount of images we were storing into memory.
If anybody knows approximately what the cache threshold in iOS 4.2 or higher browsers are, I'd appreciate it if you commented. Just want to get an idea of how many KB of image data I can safely load.