CODEWITHSUNDEEP
iphonehtmlcssuiwebview
ICL1901
ICL1901

Reputation: 7778

How can I add an external stylesheet to a UIWebView in Xcode?

I have looked at various similar questions and answers and still cannot get this to work, so I'm adding my own question:

I'm playing with UIWebView. I can create a working html page with inline CSS. I cannot figure out how to get the CSS to load if it is in a file in the app resources group.

My code is:

NSString *path = [[NSBundle mainBundle] pathForResource:@"webViewPage2" ofType:@"html"];
    NSFileHandle *readHandle = [NSFileHandle fileHandleForReadingAtPath:path];

    NSString *htmlString = [[NSString alloc] initWithData: 
                              [readHandle readDataToEndOfFile] encoding:NSUTF8StringEncoding];


    webView.opaque = NO;
    webView.backgroundColor = [UIColor clearColor];
    [self.webView loadHTMLString:htmlString baseURL:nil];
    [htmlString release];

And my html call is this:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width">
<link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 480px)" href="/greek123.css" />
</head>

<body style="background-color: transparent;">

<h2>Some Title</h2>


<p>We can put instructions here. Such as: 
"uh-oh You should not have pushed that button!"
</p>


</body>

</html>

I would appreciate any ideas or solutions. Many thanks!

Upvotes: 19

Views: 19564

Answers (4)

Matthias Bauch
Matthias Bauch

Reputation: 90127

change the baseURL of the UIWebView to the url of your mainbundle.

NSURL *mainBundleURL = [[NSBundle mainBundle] bundleURL];
[self.webView loadHTMLString:htmlString baseURL:mainBundleURL];

Swift 3:

webView.loadHTMLString(contentString, baseURL: Bundle.main.bundleURL)

Upvotes: 31

Eldhose
Eldhose

Reputation: 756

I think i have figured it out. the htmlString is simply an NSString we can replace text in it. this code worked for me

NSString *info = [NSString stringWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"your html file name" ofType:@"html"] encoding: NSUTF8StringEncoding error: &error];

info=[info stringByReplacingOccurrencesOfString:@"styles.css" withString:@"stylesIPad.css"];

Upvotes: 8

Denis
Denis

Reputation: 21

NSURL *BundleURL = [NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@"name your style" ofType:@"css"]];
webView.opaque = NO;
webView.backgroundColor=[UIColor clearColor];
[webView loadHTMLString:htmlString baseURL:BundleURL];

Upvotes: 2

ICL1901
ICL1901

Reputation: 7778

I thought I should post the entire code block to access an external CSS file. Hopefully, it will be useful to others:

- (void)viewDidLoad
{
    NSURL *mainBundleURL = [NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]];

    NSString *path = [[NSBundle mainBundle] pathForResource:@"mypagename" ofType:@"html"];
    NSFileHandle *readHandle = [NSFileHandle fileHandleForReadingAtPath:path];

    NSString *htmlString = [[NSString alloc] initWithData: 
                              [readHandle readDataToEndOfFile] encoding:NSUTF8StringEncoding];
    webView.opaque = NO;
    webView.backgroundColor = [UIColor clearColor];
    [self.webView loadHTMLString:htmlString baseURL:mainBundleURL];

    [htmlString release];
}

Upvotes: 5

Related Questions