Posting something on sunday is never been easy ;).Ok let me start with next article,will brief you about HTML touch and native touch on UIWebView.So many iOS developers will find it difficult if they try to do their own,because most of the developers were not familiar in javascript.Hold on i am here to save your time :)
<button type="button" autofocus="autofocus" ontouchstart ="button1_click();">Click Me!</button>function button1_click()
{
htmltouch=1;
}
In the script will declare a global variable called "htmltouch",whenever i tap on any html events,i will make htmltouch=1.
<html>
<head>
<meta http-equiv="Content-type" content="text/html" charset="utf-8" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=768, height=1024, user-scalable=yes">
<script type="text/javascript">
var htmlTouch = 0;
//function which we will call from oObjective-c
function toCallFromiOS()
{
if( htmlTouch == 1 )
{
alert("its a html touch");
return 'touched';
}
}
function resetTheHTMLtouch()
{
htmlTouch = 0;
}
function button1_click()
{
htmlTouch =1;
}
</script>
</head>
<body>
<button type="button" autofocus="autofocus" ontouchstart ="button1_click();">Click Me!</button>
</body>
<html>
//Wondering why i used toCallFromiOS and resetTheHTMLtouch function?.Those are the golden functions which will call from native.HTML side is completed,now bring it on!
Now we are all set.Next step is to add the delegate called "-(BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer"
On detecting the touch event on the webview,the added delegate function gets called.
- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer
HTML Side:
Well i am not an expert at HTML/Javascript,but i will share the things which i know,and with which i achieved the success.I will take one simple html with one button. You're not going to distinguish the HTML and UIWebView touch by using onlick event in the html,so importantly you have to use the on "ontouchstart" event for the button tap,because when you tap on any button/image etc with onClick(); event,your UIWebView takes it both HTML and native touch and note that HTML touch will take the priority over native touch.<button type="button" autofocus="autofocus" ontouchstart ="button1_click();">Click Me!</button>function button1_click()
{
htmltouch=1;
}
In the script will declare a global variable called "htmltouch",whenever i tap on any html events,i will make htmltouch=1.
<html>
<head>
<meta http-equiv="Content-type" content="text/html" charset="utf-8" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=768, height=1024, user-scalable=yes">
<script type="text/javascript">
var htmlTouch = 0;
//function which we will call from oObjective-c
function toCallFromiOS()
{
if( htmlTouch == 1 )
{
alert("its a html touch");
return 'touched';
}
}
function resetTheHTMLtouch()
{
htmlTouch = 0;
}
function button1_click()
{
htmlTouch =1;
}
</script>
</head>
<body>
<button type="button" autofocus="autofocus" ontouchstart ="button1_click();">Click Me!</button>
</body>
<html>
//Wondering why i used toCallFromiOS and resetTheHTMLtouch function?.Those are the golden functions which will call from native.HTML side is completed,now bring it on!
Native Side:
Create UIWebview to load the above html (well i am doing it in local now).
self.webView = [[UIWebView alloc] initWithFrame:self.view.bounds];
[self.webView loadRequest:[NSURLRequest requestWithURL:[NSURL fileURLWithPath:[[NSBundle mainBundle]
pathForResource:@"touch" ofType:@"html"] isDirectory:NO]]];
Now add the gesture delegate to the whole webview.
Now add the gesture delegate to the whole webview.
UITapGestureRecognizer *tapGestureDown = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleTapGesture)];
tapGestureDown.numberOfTapsRequired = 1;
tapGestureDown.delegate = self;
[self.webView addGestureRecognizer:tapGestureDown];
//handleTapGesture is a native method,in the sense "On detecting if its a native touch,what you want perform?"
-(void)handleTapGesture
-(void)handleTapGesture
{
NSLog(@"Touch is native");
}
Now we are all set.Next step is to add the delegate called "-(BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer"
On detecting the touch event on the webview,the added delegate function gets called.
- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer
{
return YES;
}
Now how do we proceed?.If you add the above code just like that,on tapping the webview the above delegate gets called N number of times(sometimes 8,9,13 etc).Only solution is we should be able to know the state of the touch(whether its end or start),to reset the touch even for the next call.
This is all about HTML touch and Native touch.Hope you guys enjoyed doing this.Good luck.:)
- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer
{
NSString *javastr=[self.webView stringByEvaluatingJavaScriptFromString:@"toCallFromiOS();"];
NSLog(@"%@",javastr);
if((otherGestureRecognizer.state==UIGestureRecognizerStateEnded && [javastr hasPrefix:@"touched"]))
{
javastr= [self.webView stringByEvaluatingJavaScriptFromString:@"resetTheHTMLtouch();"];
return NO;
}
if([javastr hasPrefix:@"touched"])
{
return NO;
}
return YES;
}
If the javastr returns any value its a HTML touch or else its a native touch,"handleTapGesture" gets called.
If the javastr returns any value its a HTML touch or else its a native touch,"handleTapGesture" gets called.
This is all about HTML touch and Native touch.Hope you guys enjoyed doing this.Good luck.:)
Very good article about webview.Thanks for sharing.
ReplyDeletevery usefull information...thanks for posting
ReplyDeleteawesome reading experience buddy.. keep it up..
ReplyDelete