I am using AePubreader sample code for reading ePub in my app. The issue I am facing is that the last page of the chapters are not rendered properly and they go off the visible area. I had edited AePubreader code in following way to convert in a two page mode in ipad.
-In chaper.m file the webViewDiDFinishLoading has following code :
- (void) webViewDidFinishLoad:(UIWebView*)webView{
NSString *varMySheet = @"var mySheet = document.styleSheets[0];";
NSString *addCSSRule = @"function addCSSRule(selector, newRule) {"
"if (mySheet.addRule) {"
"mySheet.addRule(selector, newRule);" // For Internet Explorer
"} else {"
"ruleIndex = mySheet.cssRules.length;"
"mySheet.insertRule(selector + '{' + newRule + ';}', ruleIndex);" // For Firefox, Chrome, etc.
"}"
"}";
NSString *insertRule1 = [NSString stringWithFormat:@"addCSSRule('html', 'padding-left: 0px;padding-right: 0px; padding-top: 0px; padding-bottom: 0px; height: %fpx;-webkit-column-count: 2; -webkit-column-gap: 0px; ')", webView.frame.size.height];
NSString *insertRule2 = [NSString stringWithFormat:@"addCSSRule('p', 'text-align: justify;')"];
NSString *setTextSizeRule = [NSString stringWithFormat:@"addCSSRule('body', '-webkit-text-size-adjust: %d%%;')",fontPercentSize];
NSString *setImageRule = [NSString stringWithFormat:@"addCSSRule('img', 'max-width: %fpx; height:%fpx;')", webView.frame.size.width-200,webView.frame.size.height-200];
NSString *setFontRule = [NSString stringWithFormat:@"addCSSRule('body', 'font-family: Arial;' , 'font-name: Arial-BoldItalicMT;')"];
[webView stringByEvaluatingJavaScriptFromString:setFontRule];
[webView stringByEvaluatingJavaScriptFromString:setImageRule];
[webView stringByEvaluatingJavaScriptFromString:varMySheet];
[webView stringByEvaluatingJavaScriptFromString:addCSSRule];
[webView stringByEvaluatingJavaScriptFromString:insertRule1];
[webView stringByEvaluatingJavaScriptFromString:insertRule2];
[webView stringByEvaluatingJavaScriptFromString:setTextSizeRule];
float totalWidth = [[webView stringByEvaluatingJavaScriptFromString:@"document.body.scrollWidth"] floatValue];
pageCount = (ceilf)((float)totalWidth/webView.frame.size.width);
NSLog(@"Chapter %d: %@ -> %d pages & totalWidth :: %f", chapterIndex, title, pageCount,totalWidth);
[webView dealloc];
[delegate chapterDidFinishLoad:self];
}
In EpubViewController.m webViewDidFinishLoading is as follows:-
- (void)webViewDidFinishLoad:(UIWebView *)theWebView{
NSString *varMySheet = @"var mySheet = document.styleSheets[0];";
NSString *addCSSRule = @"function addCSSRule(selector, newRule) {"
"if (mySheet.addRule) {"
"mySheet.addRule(selector, newRule);" // For Internet Explorer
"} else {"
"ruleIndex = mySheet.cssRules.length;"
"mySheet.insertRule(selector + '{' + newRule + ';}', ruleIndex);" // For Firefox, Chrome, etc.
"}"
"}";
NSString *insertRule1 = [NSString stringWithFormat:@"addCSSRule('html', 'padding-left: 0px;padding-right: 0px; padding-top: 0px; padding-bottom: 0px; height: %fpx;-webkit-column-count: 2; -webkit-column-gap: 0px; ')", webView.frame.size.height];
NSString *insertRule2 = [NSString stringWithFormat:@"addCSSRule('p', 'text-align: justify;')"];
NSString *setTextSizeRule = [NSString stringWithFormat:@"addCSSRule('body', '-webkit-text-size-adjust: %d%%;')", currentTextSize];
NSString *setHighlightColorRule = [NSString stringWithFormat:@"addCSSRule('highlight', 'background-color: yellow;')"];
NSString *setImageRule = [NSString stringWithFormat:@"addCSSRule('img', 'max-width: %fpx; height:%fpx;')", (webView.frame.size.width/2)-200,webView.frame.size.height-150];
NSString *setFontRule = [NSString stringWithFormat:@"addCSSRule('body', 'font-family: Arial;' , 'font-name: Arial-BoldItalicMT;')"];
[webView stringByEvaluatingJavaScriptFromString:setFontRule];
[webView stringByEvaluatingJavaScriptFromString:setImageRule];
[webView stringByEvaluatingJavaScriptFromString:varMySheet];
[webView stringByEvaluatingJavaScriptFromString:addCSSRule];
[webView stringByEvaluatingJavaScriptFromString:insertRule1];
[webView stringByEvaluatingJavaScriptFromString:insertRule2];
[webView stringByEvaluatingJavaScriptFromString:setTextSizeRule];
[webView stringByEvaluatingJavaScriptFromString:setHighlightColorRule];
if(currentSearchResult!=nil){
// NSLog(@"Highlighting %@", currentSearchResult.originatingQuery);
[webView highlightAllOccurencesOfString:currentSearchResult.originatingQuery];
}
// int totalWidth = [[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.scrollWidth"] intValue];
// NSLog(@">>>>>>>>>>>>>>>>>>>>>>>total width is %d",totalWidth);
// CGFloat moduloResult = (float)(totalWidth/((int)webView.bounds.size.width % 2));
//NSLog(@"moduloresult is %f",moduloResult);
// pagesInCurrentSpineCount = (round)((float)totalWidth/(webView.frame.size.width));
float pageCountofChapter = [[loadedEpub.spineArray objectAtIndex:currentSpineIndex] pageCount];
pagesInCurrentSpineCount =(ceilf)(pageCountofChapter/2.0);
UIScrollView* sv = nil;
for (UIView* v in webView.subviews) {
if([v isKindOfClass:[UIScrollView class]])
{
sv = (UIScrollView*) v;
sv.contentSize = CGSizeMake(pagesInCurrentSpineCount*1024, sv.contentSize.height);
}
}
// NSLog(@"TotalWidth :: %d && pagesInCurrentSpineCount :: %d && currentPageInSpineIndex :: %d",totalWidth,pagesInCurrentSpineCount,currentPageInSpineIndex);
[self gotoPageInCurrentSpine:currentPageInSpineIndex];
}
I have noticed that when the pages calculated are in odd numbers the last page of the chapter is not rendered properly ? Also , is there any alternative library available which provides two page mode support to accurately render epub?
@dineshprasanna do following changes in your project.
in chapter.m file
- (void) webViewDidFinishLoad:(UIWebView*)webView{
NSString *varMySheet = @"var mySheet = document.styleSheets[0];";
NSString *addCSSRule = @"function addCSSRule(selector, newRule) {"
"if (mySheet.addRule) {"
"mySheet.addRule(selector, newRule);" // For Internet Explorer
"} else {"
"ruleIndex = mySheet.cssRules.length;"
"mySheet.insertRule(selector + '{' + newRule + ';}', ruleIndex);" // For Firefox, Chrome, etc.
"}"
"}";
// NSLog(@"w:%f h:%f", webView.bounds.size.width, webView.bounds.size.height);
NSString *insertRule1 = [NSString stringWithFormat:@"addCSSRule('html', 'padding-left: 50px;padding-right: 50px; padding-top: 50px; padding-bottom: 50px; -webkit-column-gap: 100px;height: %fpx; -webkit-column-width : %fpx')", webView.frame.size.height-100,webView.frame.size.width/2-200];
NSString *insertRule2 = [NSString stringWithFormat:@"addCSSRule('p', 'text-align: justify;')"];
NSString *setTextSizeRule = [NSString stringWithFormat:@"addCSSRule('body', '-webkit-text-size-adjust: %d%%;')",fontPercentSize];
// NSString *setImageRule = [NSString stringWithFormat:@"addCSSRule('img', 'max-width: %fpx; height:auto;')", webView.frame.size.width *0.75];
NSString *setImageRule = [NSString stringWithFormat:@"addCSSRule('img', 'max-width: %fpx; height:%fpx;')", webView.frame.size.width/2-200,webView.frame.size.height-200];
NSString *setFontRule = [NSString stringWithFormat:@"addCSSRule('body', 'font-family: Arial;' , 'font-name: Arial-BoldItalicMT;')"];
[webView stringByEvaluatingJavaScriptFromString:setFontRule];
[webView stringByEvaluatingJavaScriptFromString:setImageRule];
[webView stringByEvaluatingJavaScriptFromString:varMySheet];
[webView stringByEvaluatingJavaScriptFromString:addCSSRule];
[webView stringByEvaluatingJavaScriptFromString:insertRule1];
[webView stringByEvaluatingJavaScriptFromString:insertRule2];
[webView stringByEvaluatingJavaScriptFromString:setTextSizeRule];
int totalWidth = [[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.scrollWidth"] floatValue];
pageCount = (ceilf)((float)totalWidth/webView.frame.size.width);
if (totalWidth % (int)webView.frame.size.width != 0)
{
UIScrollView *scrollV = [self getScrollViewFromWebView:webView];
scrollV.contentSize = CGSizeMake(pageCount*(webView.frame.size.width), webView.scrollView.contentSize.height);
}
NSLog(@"Chapter %d: %@ -> %d pages & totalWidth :: %d", chapterIndex, title, pageCount,totalWidth);
[activityIndicator removeFromSuperview];
[activityIndicator stopAnimating];
[webView dealloc];
[delegate chapterDidFinishLoad:self];
}
in your epubviewcontroller file :-
- (void)webViewDidFinishLoad:(UIWebView *)theWebView{
NSString *varMySheet = @"var mySheet = document.styleSheets[0];";
NSString *addCSSRule = @"function addCSSRule(selector, newRule) {"
"if (mySheet.addRule) {"
"mySheet.addRule(selector, newRule);" // For Internet Explorer
"} else {"
"ruleIndex = mySheet.cssRules.length;"
"mySheet.insertRule(selector + '{' + newRule + ';}', ruleIndex);" // For Firefox, Chrome, etc.
"}"
"}";
// NSString *insertRule1 = [NSString stringWithFormat:@"addCSSRule('html', 'PADDING-LEFT: 25px; padding-top: 100px; padding-right: 25px; height: %fpx; -webkit-column-gap: 50px; -webkit-column-width:%fpx;')", webView.frame.size.height-200, (webView.frame.size.width/2-100) ];
NSString *insertRule1 = [NSString stringWithFormat:@"addCSSRule('html', 'padding-left: 50px;padding-right: 50px; padding-top: 50px; padding-bottom: 50px; -webkit-column-gap: 100px;height: %fpx; -webkit-column-width : %fpx')", webView.frame.size.height-100,webView.frame.size.width/2-200];
NSString *insertRule2 = [NSString stringWithFormat:@"addCSSRule('p', 'text-align: justify;')"];
NSString *setTextSizeRule = [NSString stringWithFormat:@"addCSSRule('body', '-webkit-text-size-adjust: %d%%;')", currentTextSize];
NSString *setHighlightColorRule = [NSString stringWithFormat:@"addCSSRule('highlight', 'background-color: yellow;')"];
NSString *setImageRule = [NSString stringWithFormat:@"addCSSRule('img', 'max-width: %fpx; height:%fpx;')", (webView.frame.size.width/2)-200,webView.frame.size.height-200];
NSString *setFontRule = [NSString stringWithFormat:@"addCSSRule('body', 'font-family: Arial;' , 'font-name: Arial-BoldItalicMT;')"];
[webView stringByEvaluatingJavaScriptFromString:setFontRule];
[webView stringByEvaluatingJavaScriptFromString:setImageRule];
[webView stringByEvaluatingJavaScriptFromString:varMySheet];
[webView stringByEvaluatingJavaScriptFromString:addCSSRule];
[webView stringByEvaluatingJavaScriptFromString:insertRule1];
[webView stringByEvaluatingJavaScriptFromString:insertRule2];
[webView stringByEvaluatingJavaScriptFromString:setTextSizeRule];
[webView stringByEvaluatingJavaScriptFromString:setHighlightColorRule];
if(currentSearchResult!=nil){
// NSLog(@"Highlighting %@", currentSearchResult.originatingQuery);
[webView highlightAllOccurencesOfString:currentSearchResult.originatingQuery];
}
float pageCountofChapter = [[loadedEpub.spineArray objectAtIndex:currentSpineIndex] pageCount];
pagesInCurrentSpineCount =pageCountofChapter;
int totalWidth = [[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.scrollWidth"] floatValue];
if (totalWidth % (int)webView.frame.size.width != 0)
{
UIScrollView *scrollV = [self getScrollViewFromWebView:webView];
scrollV.contentSize = CGSizeMake(pagesInCurrentSpineCount*(webView.frame.size.width), webView.scrollView.contentSize.height);
}
[self gotoPageInCurrentSpine:currentPageInSpineIndex];
}
Hope this will help you. Arrange the padding and margin as per your requirement.