UIWebView change css file according to selected theme

Question

I am programming an application which includes multiple themes. User chooses a theme from application settings and all the application theme changes. But what I couldn't achieve is to change local htmls' css files.

I have several local html files.

HtmlFileA.html
HtmlFileB.html
HtmlFileC.html
. . .

and css files

genericCssTheme1.css
genericCssTheme2.css
. . .

with respect to each theme.

What I am trying to do is to change the css file in an html so that I can fit my colors to new selected theme. I dont want to create same Html files again and again for every theme. Just changing css reference is enough to achieve what I want. This is how I load my htmls to UIWebView.

NSString *path = [[NSBundle mainBundle] bundlePath];
NSURL *baseURL = [NSURL fileURLWithPath:path];
[webView loadHTMLString:htmlString baseURL:baseURL];

Each html file links to its css in same manner. Like this:
<link rel="stylesheet" type="text/css" href="genericCssTheme1.css"/>
<link rel="stylesheet" type="text/css" href="genericCssTheme2.css"/>

I had a solution actually but I wanted to ask it if there is another way (an efficient way) to do this. This is what I came up with. I am going to write a generic href reference in each html.

<link rel="stylesheet" type="text/css" href="genericcssfilename"/>

And before loading it to UIWebView I am going to replace it with actual file name.

<link rel="stylesheet" type="text/css" href="genericCssTheme2.css"/>

Is there an alternative way you can suggest me?

Pavel Oganesyan Pavel Oganesyan · Accepted Answer · 2012-03-30T12:35:55

Maybe you can use JS to select theme in webView? Don't know how to achieve it in JS (you can ask on this site) but it should be good enough to just call

[webView stringbyevaluatingJavaScript:@"ChangeThemeTo(1)"]

and do all the job in webView without reloading and recreating HTML. Your JS-function must be added to your html as reference or something (web programming is not my skill)

UIWebView change css file according to selected theme

1 Answers