iOS Transparent background for WKWebView - html

I'm in the process of migrating some code over from UIWebView to a WKWebView on a iOS project.
I'm currently trying to make a wkwebview transparent but the functionality doesn't seem work.
I could do this on a UIWebView by doing this
self.opaque = NO;
self.backgroundColor = [UIColor clearColor];
and setting the html page to be transparent via styling would allow me to see the view content underneath.
If I try the same code on a WKWebView the background of the html page isn't becoming transparent.
I've had search on google and there seems to be work around for MacOS X but I can't see to find a solution for iOS.
This is how it's done on a UIWebView (How to make a transparent UIWebView)
Has anyone any ideas if this is possible?
Thank you.

You can try out the following snippet:
webView.opaque = false
webView.backgroundColor = UIColor.clearColor()
webView.scrollView.backgroundColor = UIColor.clearColor()

This is exactly how our app works - we rely on the transparency. Our WkWebView is made transparent with this code:
_primaryWebView = [[WKWebView alloc] initWithFrame:frame configuration:theConfiguration];
_primaryWebView.opaque = false;
_primaryWebView.backgroundColor = [UIColor clearColor];
Our web content hosted in the WkWebView has a transparent background, then for the areas of the page where we want to see the native content we place DIV elements sized properly, with a transparent background. This allows us to easily combine HTML and native iOS content.

Related

Autodesk Forge Viewer transparent background

I am trying to use workaround described in the post: https://forge.autodesk.com/blog/transparent-background-viewer-long-last to set transparent background to the viewer.
And it is ok for desktop browsers. But if I try to open the same page (e.g. example page from the post) in Chrome/Safari browser on iPhone, the background isn't transparent.
Is there any solution to have a stable transparent background for the viewer?
What's iOS version and what version of Chrome did you try? Unfortunately I was unable to reproduce the issue - I was able to get transparent background on my iOS 13.4.1 following the demo link in the blog article:

Fonts are blured in fullscreen Flash as3

I'm having the following problem. when I switch to fullscreen - all my fonts are blurred. I use the following code to enter fullscreen:
stage.fullScreenSourceRect = new Rectangle( ... );
stage.displayState = StageDisplayState.FULL_SCREEN_INTERACTIVE;
I've tried with embed fonts, with antialiastype = advanced but there was no difference.
When I right-click and choose Zoom In the fonts are not blurred - can I achieve the same effect - no blurred fonts in fullscreen mode?
Here are some images:
img1.jpg - original
img2.jpg - fullscreen - blured fonts
img3.jpg - Zoom in - the fonts are ok
Try using advanced settings. Set the textFields antiAliasType to flash.text.AntiAliasType.ADVANCED. And then set the textField sharpness property to 400. See the documentation here.
And I would say yes, use embedFonts = true

Alignment issue while showing webpage in UIWebview

While showing a webpage in the UIWebview, there are some alignment issues.
Let me show that,
Below is the screenshot of the webpage in desktop browser
Below is the screenshot for while showing that page in UIWebview in iPhone
You can see the red dots aligned differently from its original view.
I've tried the below code to fit the screen
-(void)fitthescreen
{
if ([wbvw respondsToSelector:#selector(scrollView)])
{
UIScrollView *scroll=[wbvw scrollView];
float zoom=wbvw.bounds.size.width/scroll.contentSize.width;
[scroll setZoomScale:zoom animated:YES];
}
}
But same result.
How to solve this?
Do you have the same problem using iOS Safari? This is almost certainly just an CSS problem, not a UIWebView problem.

UIWebView mobile site width

I am making an app which has a UIWebView, in which I need to display the mobile version of an SE question, However, the page seems to have a minimum width - 768 to be precise - which just happens to be the width of the tablet itself.
This is the code I am using:
- (void)viewDidAppear:(BOOL)animated
{
[super viewDidAppear:animated];
[self.webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:#"http://stackoverflow.com/questions/7312584/inject-a-local-javascript-into-uiwebview"]]];
}
Nothing fancy. My web view, however, has a width just a little smaller, which means that there is just a little bit of ugly side-scrolling involved.
How do I make the mobile site ignore that I'm on an iPad (it works fine on an iPhone), and just scale to whatever size I make the UIWebView?
It knows what you are by the User Agent, which you can see how to do in this question
Change User Agent in UIWebView (iPhone SDK)
Alternatively, you could inject JavaScript into the page after it loads and change the width of the body or main div
Injecting JavaScript into UIWebView
To set the body width, see this question
set body width in px?

How do I prevent a WebView from scaling down a rendered web page? [duplicate]

This question already has an answer here:
Cocoa WebView font too small
(1 answer)
Closed 9 years ago.
I'm developing a Cocoa/Obj-C application that involves a WebView (from the WebKit framework). I've noticed that this WebView presents a slightly scaled-down version of the rendered webpage. An example screenshot:
In a browser (Safari or Firefox):
alt text http://img132.imageshack.us/img132/9824/plain.png
In my WebView:
alt text http://img21.imageshack.us/img21/6673/picture2sa.png
These happen to be local HTML/CSS files generated by the program, but if you tell the WebView to load http://www.google.com, it'll do the same thing. Both images and text seem slightly smaller. As you see, in this example, the 1px horizontal rule just disappears.
It's very important that this WebView presents an accurate picture of what the page will look like in a browser, so I would like to resolve this issue. I've looked at the WebView documentation and at all of the options in Interface Builder, but no luck.
You may want to try this method: - (void)setTextSizeMultiplier:(float)multiplier.
In Interface Builder, try changing the font size default option for the web view from 12 to 16. I believe most web browsers, including Safari, use a default font size of 16, but the default font size is set to 12 for a Cocoa web view, so everything is rendered a bit smaller.
Is it possible that one of the superviews that contains your webview is being rescaled? I don't remember seeing any automatic scaling in WebKit docs.
Here's how I made the WebView web page look the same as in Safari:
[[webView preferences] setDefaultFontSize:16];
(I did the above in applicationDidFinishLaunching handler, after setMainFrameURL call. Solution is taken from a similar question. Changing WebView font size in Interface Builder didn't work for some reason.)