How to add CSS file to iphone project in xcode? - iphone

I am working on a web based application for iphone, I have created new cssfile to the project this css file doesn't affect the html file, but when I have uploaded the css file a host it worked fine and styled the html
What is the problem ?
edit 1
This the head element .
css.css is working fine and is linked to the html correctly
jquery.mobile-1.0.min.css is NOT !
Despite the both files exist in the same border
Onotha.com
<link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.0.min.css" />
edit 2
This is the Objective-C code, I have an exception, I think in the last line of code
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
[window makeKeyAndVisible];
NSString *path= [[NSBundle mainBundle] pathForResource:#"index" ofType:#"html" inDirectory:NO];
// [webView loadRequest:[NSURLRequest requestWithURL:[NSURL fileURLWithPath:path]]];
// NSString *path = [[NSBundle mainBundle] bundlePath];
// NSURL *baseURL = [NSURL fileURLWithPath:path];
// [webView loadHTMLString:htmlString baseURL:baseURL];
// load css styles
NSString *cssPath = [[NSBundle mainBundle] pathForResource:#"css/jquery.mobile-1.0.min.css" ofType:#"css"];
NSData *cssData = [NSData dataWithContentsOfFile:cssPath];
NSString *cssString = [[NSString alloc] initWithData:cssData encoding:NSASCIIStringEncoding];
// load js
NSString *jsPath = [[NSBundle mainBundle] pathForResource:#"MyJS" ofType:#"js"];
NSData *jsData = [NSData dataWithContentsOfFile:jsPath];
NSString *jsString = [[NSString alloc] initWithData:jsData encoding:NSASCIIStringEncoding];
// compose full html page
NSString *pageContent = [NSString stringWithFormat:#"%#%#%#", cssString, jsString, path];
[webView loadHTMLString:pageContent baseURL:baseURL];
return YES;
}
edit 3
I got this after using code posted by Srikar

You can load CSS from local project directory
NSString *path = [[NSBundle mainBundle] bundlePath];
NSURL *baseURL = [NSURL fileURLWithPath:path];
[webView loadHTMLString:htmlString baseURL:baseURL];
detail info check this site.
More elaborate code here -
// load css styles
NSString *cssPath = [[NSBundle mainBundle] pathForResource:#"MyCSS" ofType:#"css"];
NSData *cssData = [NSData dataWithContentsOfFile:cssPath];
NSString *cssString = [[NSString alloc] initWithData:cssData encoding:NSASCIIStringEncoding];
// load js
NSString *jsPath = [[NSBundle mainBundle] pathForResource:#"MyJS" ofType:#"js"];
NSData *jsData = [NSData dataWithContentsOfFile:jsPath];
NSString *jsString = [[NSString alloc] initWithData:jsData encoding:NSASCIIStringEncoding];
// compose full html page
NSString *pageContent = [NSString stringWithFormat:#"%#%#%#", cssString, jsString, actualPageMarkup];
[webView loadHTMLString:pageContent baseURL:[NSURL URLWithString:#""]];
More info here

I don't know if you have solved this, but I think you have to load in "pageContent" the content of the page instead of the path.
Something like this:
NSString *htmlString = [NSString stringWithContentsOfFile:path encoding:NSASCIIStringEncoding];
NSString *pageContent = [NSString stringWithFormat:#"%#%#%#", cssString, jsString, htmlString];
[webView loadHTMLString:pageContent baseURL:baseURL];

Related

how to set the html +css add in the iphone

how to set the html +css add in the iphone
webView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 0,320,458)];
webView.delegate=self;
[self.view addSubview:webView];
// HTML files are stored in the main bundle
NSBundle *bundle = [NSBundle mainBundle];
NSString *path = [bundle bundlePath];
NSString *filename = #"index";
NSString *fullPath = [NSBundle pathForResource:filename ofType:#"html" inDirectory:path];
[fullPath stringByReplacingOccurrencesOfString:#"/" withString:#"_"];
// load a HTML from a file
// NSString *chapter_filename = [NSString stringWithFormat:#"Section%#", filename];
// NSString *sectionHTMLPath = [[NSBundle mainBundle] pathForResource:fullPath ofType:#"html"];
NSString* htmlContent = [NSString stringWithContentsOfFile:fullPath encoding:NSUTF8StringEncoding error:nil];
// add a generic template and the css file directive
NSString* htmlString = #"<!doctype html xmlns:fb=#\"http://ogp.me/ns/fb#\"><head><meta charset=\"utf-8\"><meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge,chrome=1\"><title>Ways Group</title><meta name=\"description\" content=\"An very basic example of how to use the Wookmark jQuery plug-in.\"><meta name=\"author\" content=\"Christoph Ono\"><meta name=\"viewport\" content=\"width=device-width,initial-scale=1\"><link href=\"landing-page/css/jquerysctipttop.css\" rel=\"stylesheet\" type=\"text/css\"><!-- Link to the built CSS --><link rel=\"stylesheet\" href=\"landing-page/css/modal.css\"><link rel=\"stylesheet\" href=\"css/main.css\"><link rel=\"stylesheet\" href=\"css/style.css\"><link rel=\"stylesheet\" href=\"css/menu.css\" type=\"text/css\" media=\"screen\" /><!-- CSS Reset --><link rel=\"stylesheet\" href=\"css/reset.css\"><link href=\"css/social-likes.css\" rel=\"stylesheet\"><script src=\"http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js\"></script><script src=\"js/social-likes.js\"></script><!-- Styling for your grid blocks --><style type=\"text/css\">max-height: 300px;</style></head><body>%#</body></html>";
// load the html into a web view
NSURL *url = [NSURL fileURLWithPath:htmlContent];
[webView loadHTMLString:[NSString stringWithFormat:htmlString, htmlContent] baseURL:url];
NSString *htmlPath = [[NSBundle mainBundle] pathForResource:#"demo" ofType:#"html" inDirectory:nil];
NSString *htmlString = [NSString stringWithContentsOfFile:htmlPath encoding:NSUTF8StringEncoding error:nil];
NSURL *Url = [NSURL fileURLWithPath:htmlFile];
[WebView loadHTMLString:htmlString baseURL:Url];
And Don't forget to link the css in html
<link rel="stylesheet" type="text/css" href="Sample.css">
try this:
NSString *path = [[NSBundle mainBundle] bundlePath];
NSURL *baseURL = [NSURL fileURLWithPath:path];
CGRect frame2ref = CGRectMake(0, 45, 320,380);
webview1 = [[[UIWebView alloc] initWithFrame:frame2ref] autorelease];
[webview1 loadHTMLString:ref baseURL:baseURL];

How to use HTML file in iPhone

I want to use an HTML file in my code currently I am using following line of code:
NSString *htmlFile = [[NSBundle mainBundle] pathForResource:#"index" ofType:#"htm" inDirectory:nil];
NSString* htmlString = [NSString stringWithContentsOfFile:htmlFile encoding:NSUTF8StringEncoding error:nil];
[WebView loadHTMLString:htmlString baseURL:nil];
But the problem which I am facing is: the HTML Page contains some images, and all that images are in a folder in my project but I am not able to see that images in the HTML page at run time.
You can set the baseURL to your resource folder, where your images are located:
NSString *htmlFile = [[NSBundle mainBundle] pathForResource:#"index" ofType:#"htm" inDirectory:nil];
NSString *htmlString = [NSString stringWithContentsOfFile:htmlFile encoding:NSUTF8StringEncoding error:nil];
NSString *resourcePath = [[NSBundle mainBundle]resourcePath];
NSURL *baseUrl = [[NSURL alloc]initFileURLWithPath:resourcePath];
[self.myWebView loadHTMLString:htlmString baseURL:baseUrl];
Here the possible ways to use HTML into the project,
Following code for the load HTML file into xcode project
Example 1, loading the content from a URLNSURL
NSURL *url = [NSURL URLWithString:#"http://google.com"];
NSURLRequest *request = [NSURLRequest requestWithURL:url];
[webView loadRequest:request];
Example 2, loading the content from a string
NSString *HTMLData = #"<h1>Hello this is a test</h1>";
[webView loadHTMLString:HTMLData baseURL:nil];
Example 3, loading the content from a local file
NSString *htmlFile = [[NSBundle mainBundle] pathForResource:#"sample" ofType:#"html"];
NSData *htmlData = [NSData dataWithContentsOfFile:htmlFile];
[webView loadData:htmlData MIMEType:#"text/html" textEncodingName:#"UTF-8" baseURL:[NSURL URLWithString:#""]];
Hope this code helping to develop a application

what is the wrong when loading local resource files in webview in iphone

I am trying to load local css and html files into WebView , but the web view displays the content of css file in webview as you see in the following image ..
objective-c code:
NSString *htmlPath= [[NSBundle mainBundle] pathForResource:#"index" ofType:#"html" inDirectory:NO];
//[webView loadRequest:[NSURLRequest requestWithURL:[NSURL fileURLWithPath:htmlPath]]];
// load css styles
NSString *cssPath = [[NSBundle mainBundle] pathForResource:#"css" ofType:#"css"];
NSData *cssData = [NSData dataWithContentsOfFile:cssPath];
NSString *cssString = [[NSString alloc] initWithData:cssData encoding:NSASCIIStringEncoding];
// load js
NSString *jsPath = [[NSBundle mainBundle] pathForResource:#"MyJS" ofType:#"js"];
NSData *jsData = [NSData dataWithContentsOfFile:jsPath];
NSString *jsString = [[NSString alloc] initWithData:jsData encoding:NSASCIIStringEncoding];
// compose full html page
NSString *pageContent = [NSString stringWithFormat:#"%#%#%#", cssString, jsString, htmlPath];
[webView loadHTMLString:pageContent baseURL:[NSURL URLWithString:#""]];
what is the problem ?
You must not use
[webView loadHTMLString:pageContent baseURL:[NSURL URLWithString:#""]];
instead loadHTMLString try to use stringByEvaluatingJavaScriptFromString
And if you have any problem check the following post. I think you will get it easily
UIWebView and local css file
I have not used it for CSS but hope this will help you...Good Luck...

Images not showing in device for Web view in iphone

I am working on one application. I stuck with one problem. I have HTML page and some images are in Resource Directory. Whenever i run the application on Simulator it works perfectly fine. But when i run the application on the device the image are not displaying but text is displaying only and instead of image Question mark is showing.
Code:
NSString *path = [[NSBundle mainBundle] pathForResource:#"test1" ofType:#"html"];
NSFileHandle *readHandle = [NSFileHandle fileHandleForReadingAtPath:path];
NSString *htmlString = [[NSString alloc] initWithData: [readHandlereadDataToEndOfFile]encoding:NSUTF8StringEncoding];
NSURL *baseurl = [NSURL fileURLWithPath:path];
[self.webView loadHTMLString:htmlString baseURL:baseurl];
HTML Code:
<img src="mainGrid.png">
Change your HTML code to (file:// tells that it's local resource):
<img src='file://%#'>
Then use it in this way:
NSString *pathToLocalImage = [[NSBundle mainBundle] pathForResource:#"mainGrid" ofType:#"jpg"];
NSString *content = [NSString stringWaithFormat:htmlString, pathToLocalImage];
[self.webView content baseURL:nil];

Load different html file on one UIWebView

iam going to change my UIWebView files via UISwipeGuesture but have problem :
i have 100 HTML files that loaded on UIWebView , so i want implement something like this :
if user swipes the view my webView will load next html file but the problem is my code just load first HTML file :
NSString *path = [[NSBundle mainBundle] pathForResource:[NSString stringWithFormat:#"file%d",+1] ofType:#"html"];
NSFileHandle *readHandle = [NSFileHandle fileHandleForReadingAtPath:path];
NSString *htmlString = [[NSString alloc] initWithData:
[readHandle readDataToEndOfFile] encoding:NSUTF8StringEncoding];
[self.myWebView loadHTMLString:htmlString baseURL:nil];
[NSString stringWithFormat:#"file%d",+1] is always going to return the string file1, so you're always loading file1.html.
Do you mean to be using a counter or index instead of the number 1?
EDIT: More code. This isn't how I'd recommend implementing this, but it should give you an idea and it's relatively compact. (I'd use an ivar or property to track the current file index.)
static NSInteger currentIndex = 0;
if (currentIndex < 99) {
currentIndex++;
}
NSString *path = [[NSBundle mainBundle] pathForResource:[NSString stringWithFormat:#"file%d",currentIndex] ofType:#"html"];
NSFileHandle *readHandle = [NSFileHandle fileHandleForReadingAtPath:path];
NSString *htmlString = [[NSString alloc] initWithData:
[readHandle readDataToEndOfFile] encoding:NSUTF8StringEncoding];
[self.myWebView loadHTMLString:htmlString baseURL:nil];