So, I have a UIView with a UIWebView inside serving up a local HTML file (a document preview). I also have "Accept" & "Reject" UIButtons. I need these buttons to only appear after the user has scrolled to the bottom of the web page. Is there a way to capture an event for scrolling to the bottom of a UIWebView?
I have not seen any good answers for this, can anyone help?
Thanks in advance.
UIWebView conforms to UIScrollViewDelegate. As such, you can create a subclass of UIWebView (say, ScrollDetectWebView) and capture the calls to the UIScrollViewDelegate.
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
[super scrollViewDidScroll: scrollView];
// Whatever scroll detection you need to do
}
huh?
Why not just included the buttons on the bottom of the page?
JavaScript lets handle the scrolling event and send message to Objective-c.
- (void)viewDidLoad {
[super viewDidLoad];
self.webView.scrollView.delegate = self;
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
CGSize fittingSize = [self.webView sizeThatFits:CGSizeZero];
CGFloat height1 = scrollView.bounds.origin.y + self.webView.bounds.size.height;
CGFloat height2 = fittingSize.height;
int delta = fabs(height1 - height2);
if (delta < 30) {
NSLog(#"HELLO!!! You reached the page end!");
}
}
Related
Are there any examples of infinite vertical scrollview, something like Facebook and 9gag app. When you scroll it shows for example pictures, but it stops after lets say 10 pictures showing refresh/loading indicator, and then loading new pictures (so it doesn't have to download all pics at app start).
Thanks.
This amazing dev has made it easy to add infinite scroll with a UIScrollView category. You should probably give it a try.
when user scroll upside then it call the following method
#pragma mark -
#pragma mark - Scroll View Delegate Method
- (void) scrollViewDidScroll:(UIScrollView *)scrollView {
if (scrollView == scrollObj) {
CGFloat scrollPosition = scrollObj.contentSize.height - scrollObj.frame.size.height - scrollObj.contentOffset.y;
if (scrollPosition < 30)
{
if ((!spinnerBottom.isAnimating) ) {
[spinnerBottom startAnimating];
[self getAPICall]; //your apicall function
}
}
}
}
So what I'm trying to do is to write a simple gallery app - detail view behaves pretty much like the PhotoScroller provided by Apple in their sample code section on developer.apple.com, that is it allows the user to swipe across all the images. What I'd like to do is to update the title property on users swipe, in other words, if the user changes the image she's looking at, the self.title property should update itself to that photo's title. I know that is possible, since Apple's own Photo app is capable of displaying the current index ("1 of x"). How can this be done? I'd really appreciate any suggestions and thank you in advance.
When you scroll the ScrollView after ending the scrolling
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
method is call. So You can give the title inside this method. First Make an array of your all
Image's title. Then if your image's width is 320, then use this :-
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
int index = scrollView.contentOffset.x / 320;
self.title = [titleArray objectAtIndex:index];
}
If you are putting images in a scroll view then this method will give you the page number you are currently in:
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
NSInteger pageNum = (int)(scrollView.contentOffset.x / scrollView.frame.size.width);
NSLog(#"page no is:%d",pageNum);
[self updateTitleForIndex: pageNum];
}
- (void)updateTitleForIndex:(NSInteger) pageNum
{
//set title using your page number
//also call this method initially for setting title
}
If you're using a paged UIScrollView, the best approach would be to do the manipulation of the title in the delegate method called
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
You should use a method of UIScrollViewDelegate protocol, such as -scrollViewDidScroll:
I have an application that is running on the iPhone that has a UIWebView on it. I load a webpage into this view and the user can continue to the next page by pressing buttons that I have added to a UIToolBar at the bottom of the page. What I am after is to stop the user from pressing these buttons until they have scrolled half way or all the way down the page. Is this possible?
If it's going to be half way down the page and further then you could probably use the content offset of the scroll view of the webview.
I would create an instance variable in your controller that references the scrollview of the webview. In iOS 5 you can use the webview.scrollView property to access the scrollView but in previous versions you would have to search the subviews of the webView.
if([_webView respondsToSelector:#selector(scrollView)]) {
_webViewScrollView = _webView.scrollView;
}
else {
for (UIView *subview in _webView.subviews) {
if ([subview isKindOfClass: [UIScrollView class]]) {
_webViewScrollView = subview;
break;
}
}
}
Then I would set the scrollviews delegate to be the controller I'm interested in
_webViewScrollView.delegate = self;
and implement the following delegate method:
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
if( scrollView.contentOffset.y > someValue ) {
// Enable Buttons
}
else {
// Make / Keep buttons inactive..
}
}
An alternative method would be to use some javascript and do some funky stuff with stringByEvaluatingJavaScriptFromString
use scrollView property of UIWebView and use its delegation call back
- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate;
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView;
to handle the scrolling end event and UIScrollview property contentOffset can tell u that the scroll position with respect to its content size(actual size of ur webpage).
At the launch of application make your toolbar button disable. Then check for current scroll position by adding this line.
int position = [webView stringByEvaluatingJavaScriptFromString:#"window.scrollBy(0,180);"];
Once you scrolled your page to above specific position make your toolbar button enabled.
OR
You can use scroll view delegate methods.
How do I check/call a method when a user is at the bottom of the UIWebView when scrolling? I want to popup a view (add a subiview) when the user is at the bottom of the content.
Building on other ideas here, UIWebView conforms to the UIScrollViewDelegate protocol. You could subclass UIWebView and override the appropriate UIScrollViewDelegate methods, calling [super ...] so the original behavior is still present.
#interface SpecialWebview : UIWebView
#end
#implementation SpecialWebview
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
[super scrollViewDidScroll:scrollView];
// Check scroll position and handle events as needed...
}
#end
First get the reference to the UIWebView scrollView using this property:
#property(nonatomic, readonly, retain) UIScrollView *scrollView
Once you get the reference to it you could check for the contentSize of it and compare it with the contentOffSet. You cannot make yourself a delegate of it, since the UIWebView is already the delegate for the scrollView, but that trick should work.
The problem is that you don't get the callBack when the scrolling is happening... so you would have to check every so often. Otherwise you will have to make yourself the delegate of the scrollView, and implement all the methods that UIWebView is implementing and mimic that behavior, and then check on the didScroll for that condition.
Another option would be to inject some JavaScript into the web view and then use the window.onscroll event in JavaScript to detect when the user has scrolled to the bottom of the window (you can find plenty of examples online if detecting scroll events using JS).
Once you detect the the user is at the bottom, you could call back to the app by loading a fake url in the web view from the JavaScript by saying document.location.href = "http://madeupcallbackurl", then use the web view delegate to intercept that request and perform your native code logic.
Using the scrollview delegate is probably easier though if you can make that work!
Sorry, I was thinking UITableView. You are asking about a UIWebView. I don't know if this will work with the UIWebView.
I have code that does this using a UIScrollViewDelegate.
#interface myViewController : UIViewController_iPad <UIScrollViewDelegate> {
UITableView *myTableView;
...
}
- (void)viewDidLoad {
myTableView.delegate = self;
...
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
// If necessary, verify this scrollview is your table:
// if (scrollView == myTableView) {
CGPoint offset = myTableView.contentOffset;
if (myTableView.contentSize.height - offset.y >= myTableView.bounds.size.height)
{
// The table scrolled to the bottom. Do your stuff...
}
// }
}
This is how I would do it.
UIWebView conforms to UIScrollViewDelegate. Use the - (void)scrollViewDidScroll:(UIScrollView *)scrollView callback to keep track of when your UIWebView is scrolling:
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
//The webview is is scrolling
int xPosition = [[webView stringByEvaluatingJavaScriptFromString: #"scrollX"] intValue];
int yPosition = [[webView stringByEvaluatingJavaScriptFromString: #"scrollY"] intValue];
}
Now this method will be invoked whenever your webView scrolls. Your webView will have scrolled to the bottom when:
webView_content_height - webView(y) = webView.frame.height; //pseudo code
Your delegate callback will now look like:
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
//The webview is is scrolling
int xPosition = [[webView stringByEvaluatingJavaScriptFromString: #"scrollX"] intValue];
int yPosition = [[webView stringByEvaluatingJavaScriptFromString: #"scrollY"] intValue];
if([webView stringByEvaluatingJavaScriptFromString: #"document.body.offsetHeight"] - yPosition == webView.frame.height)
{
//The user scrolled to the bottom of the webview
}
}
What the code translates to is that when the user scrolls to the bottom of the content, the difference between the webView's y Position (which is the y-coordinate of the webView's top left corner) and the bottom of the content will be equal to the height of the webview frame. The code acts upon this condition being satisfied to enter inside the if condition.
To be on the safe side, you could modify the if condition to have a margin for error (maybe + or - 10 pixels).
Sometimes, my UIWebView will have a grey box over part or all of the content. I can't make heads or tails of why it's happening. It happens regularly for certain content.
Thanks!
--Update--
It seems to occur when the webview is not immediately viewable on the screen -- ie i've got a scrollview, and the webview is below the fold.
--Update #2--
When I bring the content above the fold, it loads fine most of the time. There are still instances when the grey box is still showing up. The weird part is if i double-tap it, it finishes loading the content just fine. bizarre
--Update #3--
Okay, so it seems to be that if my uiwebview has a height greater than 1000px, a grey box appears on the rest of the content below 1000px. A double-tap reveals the actual content.
All UIViews have a size limit of 1024x1024 pixels. This is stated at the end of the Overview section of the UIView documentation.
If your web view must have more than 1024px of content, you will have to take it out of the parent scroll view and let it manage scrolling on its own.
Nudging the UIScrollView in the UIWebView it fixes this for me:
[UIScrollView *webScroller= [[webView subviews] lastObject];
[webScroller setContentOffset:CGPointMake(0,1) animated:NO];
[webScroller setContentOffset:CGPointMake(0,0) animated:NO];
I have been dealing with this glitch as well, and have opened a bug report at apple.
I would have commented above, but I don't have the 50 rep yet.
For anyone else encountering this glitch, send them a report, I included a full project demonstrating it, with a few screenshots from another app I am working on.
The more bug reports they get on a topic, the more likely they are to address it, apparently.
https://bugreport.apple.com/
I've got the same problem. I put a UIWebView inside a big TableViewCell (>1024px) and when I scroll to the bottom of the cell, there is this grey box.
But, if I put a UILabel (also with a big size > 1024px), there is no grey box. So I think this has nothing to do with a max height of a UIView (BTW I can't find anything about this so called 1024 max height). I think it's more a UIWebView issue.
The solution for me is to reload the content of the webview when the grey box appears. Actually, I just have a HTMLString to load so I call [webview loadHTMLstring:] again, and the grey box disappear.
Hope that will help
I found a very intersting post about that, it solved the problem for me :
link ttp://pinchzoom.com/blog/items/view/1386/one-of-the-problems-with-the-uikit-at-the-moment-is-an-issue-embedding-a-uiwebview-within-a-table
Hope that helps
I've used stringByEvaluatingJavaScriptFromString plus moving UIWebView origin.
Design overview: I had a set of controls(UIImage in this example) above(I mean frame.origin.y) UIWebView. So, layout was:
UIView
UIScrollView
UIImageView
UIWebView
Since UIWebView doesn't support scrolling in such hierarchy I've rearrange it like:
UIView
UIScrollView
UIImageView
UIWebView
My view controller is delegate for UIWebViewDelegate and UIScrollViewDelegate.
Then,
- (void)viewDidLoad
{
// set delegates
self.scrollView.delegate = self;
self.webView.delegate = self;
// store original UIWebView position in ivar
webViewPosY = self.webView.frame.origin.y;
// load html into UIWebView
[self.webView loadHTMLString:someHTML baseURL:nil];
}
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
// get UIWebView size and store in ivar
webSize = [self.webView sizeThatFits:CGSizeMake(1.0,1.0)];
// set proper content height for UIScrollView
CGSize contentSize = self.scrollView.contentSize;
contentSize.height = webViewPosY + webSize.height;
self.scrollView.contentSize = contentSize;
// set UIWebView's frame height same as UIScrollView has
CGRect wf = self.webView.frame;
wf.size.height = self.scrollView.frame.size.height;
self.webView.frame = wf;
}
// scrolling logic:
// 1. if origin of UIWebView > 0 then move UIWebView itself
// 2. if origin of UIWebView == 0 then scroll with javascript
// 3. if origin is 0 and whole html is scrolled then move UIWebView again(this happens to support scroll "bouncing", or if you have some views below UIWebView
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
CGFloat scrollPosY = self.scrollView.contentOffset.y;
// (1) and (2) ifs
// how much to move UIWebView
CGFloat scrollOriginY = (scrollPosY >= webViewPosY) ? webViewPosY : scrollPosY;
// how much to scroll via JS
CGFloat scrollJSY = scrollPosY - scrollOriginY;
// (3) if
if ( scrollPosY > (webSize.height - scrollViewSize.height + webViewPosY ) )
scrollOriginY += scrollPosY - (webSize.height - scrollViewSize.height + webViewPosY);
// scroll with JS
[self.webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:#"document.body.scrollTop = %f;", scrollJSY]];
// move UIWebView itself
CGRect wf = self.webView.frame;
wf.origin.y = webViewPosY - scrollOriginY;
self.webView.frame = wf;
}
This works just fine for me.
I ran into the same issue when dynamically resizing a UIWebView. Here's what worked for me:
#define LAYER_FOR(ui) [(ui) layer]
#define FRAME_FOR(ui) [LAYER_FOR((ui)) frame]
#define SET_FRAME_FOR(ui, frame) [LAYER_FOR((ui)) setFrame: (frame)]
+ (void) setHeightTo: (CGFloat *) height_ptr forView: (UIView *) a_view {
CGFloat height = *height_ptr;
CGRect existing_frame = [[a_view layer] frame];
existing_frame.size.height = height;
// need to reassign the same frame !?
NSLog(#"setting text view: %# to height: %f", a_view, (float) height);
SET_FRAME_FOR(a_view, existing_frame);
}
+ (void) resizeWebView: (UIWebView *) webView {
NSString *js = #" \
var __html_element = document.getElementsByTagName('html')[0]; \
var __height_string = document.defaultView.getComputedStyle(__html_element, null).getPropertyValue('height'); \
__height_string.replace('px', ''); \
";
NSString *heightString = [webView stringByEvaluatingJavaScriptFromString: js];
float height = [heightString floatValue];
if (height != UI_VIEW_HEIGHT(webView)) {
[self setHeightTo: &height forView: webView];
// resize scrollView inside webview to the same height
UIScrollView *webScroller = [[webView subviews] lastObject];
[self setHeightTo: &height forView: webScroller];
}
}
I called this code from webview's delegate 'webViewDidFinishLoad:' method.
Basically, the trick is to resize the webScroller inside webview.
Thanks to Padraig for the suggestion to nudge the webview's subview (the scrollview).