How to resize UIWebView content to specific dimensions? - iphone

I have an application requirement of displaying custom ads in it so I decided to use UIWebView and load specific url with 468x60 ads generated in it. It works like charm, except one thing: loaded ad is too big (naturally) for 320px iPhone screen and I am unable to force it to shrink a litle bit.
What could I possibly do about it? Maybe there are some Javascript/CSS/HTML stuff I could do in ad page?

Checkout the "viewport" meta-tag. It'll let you tell the phone what the width of the page is and you can also set the initial zoom level.
https://developer.apple.com/library/content/documentation/appleapplications/reference/safariwebcontent/UsingtheViewport/UsingtheViewport.html

UIWebView has a property called scalesPageToFit, or you could clip the image to the required dimensions, or resize the property to the correct size before downloading and displaying.

Related

obj c uiwebview responsive html

I want to load responsive html in uiwebview (xcode) , but the page is not adjusting itself as it is responsive html. When i tried same file in other iphone browsers it is displaying adjusted contents i.e. adjusted contents . I dont want to use phonegap for this. How can I display responsive html in this case.
A couple of things you might check are the following:
try to define (or undefine) the viewport in your responsive HTML, e.g.:
<meta name="viewport" content="width=320,user-scalable=yes,initial-scale=1.0">
check if things improve by setting scalesPageToFit:
If you set this to YES, the webpage is scaled to fit and the user can zoom in and zoom out. If NO, user zooming is disabled. The default value is NO.
But these are just shots in the dark, since you provide no information about the way you are doing things and what exactly does not work. In any case, I hope it helps.

iphone flip is zooming in (against my will)

I've started working on a mobile page and I've made the css so that the page can expand or contract and look fine. When I rotate the page though, by turning my iphone sideways, instead of resizing as though there is a new screen size (wide), it's zooming in. I have an image on the page and I really don't want it to zoom in, because it pixelates the image. I would rather it resize as though it was a new page.
You can see it here:
http://scclib.com/mobile
I figured it out by adding this meta tag, I haven't tested it on android or ipads, but this at least solves my problem for iphone.

Dynamically change launch image in iOS

I have a sponsor logo on the launch image. Is there a way to dynamically change the launch image to rotate sponsor logos?
Thanks
The default image for an iphone app must be a fixed image file in your bundle. You cannot change it dynamically.
However, you can have a dynamic image that appears when the app loads after the launch image. You can set that up with animations or simply to select a random image each time.
According to Apple's HIG, Human Interface Guide, the splash screen is supposed to be used only as a placeholder to give the user the illusion the app is open while it completes it's startup process.
Apple will allow some use of the startup screen, but know they can and do have the right to reject your app solely on how you use it.
Like the previous answer stated, you could do anything you want after the initial startup screen has passed. Play a video, run an animation, or display a second view with your sponsored images.
And finally, I don't recommend doing this, but if you are determined to work something into the startup screen, you could try this.
The splash screen is hardcoded or set to 1 filename. Before your app closes, you could dynamically replace the hardcoded filename with a new file from a webservice or local storage, replacing the existing splash screen image. I haven't tried this, but it is more than likely possible. Just beware that it may not pass muster with Apple's approval process. Good luck.
As i needed different images on iPhone & iPad Splash screens, i followed below steps:
1. Add two UIImageViews
2. Set Width & Height constants for both UIImageViews as per your requirements.
3. Now select the iPhone UIImageView and set its Height Constraints Regular Regular (RR) height constant as 0.
4. Do the same for for iPad UIImageView and set its Height Regular Regular (RR) height constant as actual required height and set 0 to the Constant.
5. When you test it on iPhone the iPad ImageView will disappear and vice-versa will happen on iPad.

How did Feedly implemented custom pagecontrol for its app for iPhone?

Feedly for iPhone comes with cool design especially its custom pagecontrol(scrollbar?) placed on the top.
I'm developing an app for iPhone, and to use spaces efficiently as much as it's possible I'm trying to find a way to implement custom pagecontrol like Feedly. I actually think it's possible the app is made with HTML5 and CSS? Although I am not sure. I found some custom opensourced pagecontrol frameworks, but they're to do with something else such as dots' colors either sizes.
Here's example image link to Feedly for iOS http://i.stack.imgur.com/wf595.jpg
Although this is an iPad version, basically iPhone one is the same. You see the green bar just below the status bar, if you slide pages the colored bar scrolls. It's much more like scrollbar.
Thanks.
Okay, so I unarchived the app and it turned out it's mainly made with HTMLs and converted using PhoneGap. I'm not going to use HTML in my app, my journey still goes on...
Putting all contents into an UIWebView (implementing in HTML & CSS) is generally a bad idea performance wise.
What Feedly seems to do is use an UIScrollView.
The ScrollView sends several events including when it's moved and tapped.
They then update the green scroll bar on top whenever the ScrollView is moved.
Likely, they will also load the actual contents within the ScrollView as the user approaches their position to conserve memory.
You can implement something like this yourself in a few days of coding work.
(Disclaimer: This is just how I would implement what you showed. How it is actually done - only Feedly knows.)

For UIImage, use of #2x w/o duplicating files

Beginner here. My app shows an UIImage (in a scroll view).
If you are on retina device, then it should not scroll and I set the scroll view frame to be
the exact size (640x960).
If you are not on a retina device then it should scroll, so I set the scroll view frame to the pixels (480x320).
I have this working by setting the frame sizes, as mentioned, in viewDidLoad()
So...my question is that I have to keep both images on disk. I have pix.png and pix#2x.png and they are exactly the same thing.
Any help on how to handle this? Maybe it is obvious, but not to me ;-)
thx!
In my opinion,If you load the image with the two file name, I think you should keep them on disk.If not, you can delete one of them. Nomatter what pixels size you set, the original pixels datas are always which image file you load from disk.
No, you shouldn't need two copies of the same image. The #2x scheme is just lets you automatically load a high resolution image when one is available. It sounds like you're already managing your scroll view's content size and things are working, so you can just get rid of the pix#2x.png file.
I'm not sure it's a great UI decision to change the app's behavior based on its screen resolution, though. Since you're already using a scroll view, it can be easy for the user to zoom in and out. Non-retina devices will display at native resolution when zoomed in; retina devices will display at native resolution when zoomed out.