The bottom of page cannot display in WKWebView - scroll

A long web page is rendered in a WKWebView, but a small part of the page on the bottom cannot display even scrolling the page to the bottom.
It seems that the bottom of the page is out of the screen because I can see it when I pull the page up and not releasing my finger.
How can I fix this problem?

I am coming to answer my own question as I have found out the reason that made this issue.
I don't have enough knowledge about Objective-C, so maybe there will be some small mistakes when I describing my answer.
Firstly, there is a default margin at the top of the WKWebView if the property automaticallyAdjustsScrollViewInsets was set to true, and maybe there is a bug of XCode 8.3 (everything was going well when I compiled my code with XCode 8.0), the margin occupied a real part of web page, so the web page can not scroll to its bottom even though I set it to a small size. So set the automaticallyAdjustsScrollViewInsets to false will remove the margin of WKWebView; This is the documentation of this property: https://developer.apple.com/documentation/uikit/uiviewcontroller/1621372-automaticallyadjustsscrollviewin
Then, set the height of WKWebView by the calculation result of that the height of viewport minus the height of the status bar and minus the height of navigation bar.
Pasting my code here:
self.automaticallyAdjustsScrollViewInsets = false;
CGFloat statusBarHeight = [UIApplication sharedApplication].statusBarFrame.size.height;
CGFloat navBarHeight = self.navigationController.navigationBar.frame.size.height;
WKWebView *webView = [[WKWebView alloc] initWithFrame:CGRectMake( 0, statusBarHeight + navBarHeight, self.view.bounds.size.width, self.view.bounds.size.height - statusBarHeight - navBarHeight )];

Related

NSOutlineView strange padding is cropping a badge

I created a view-based NSOutlineView with an image and a badge (an inline button). Although the custom cell is wide enough, I have the following problem:
So there is a strange margin from the right which overlays my badge (the NSOutlineView is embedded in a ScrollView and this in a SplitView).
Any ideas, how I can remove this margin / overlay?
Ok, my last comment brought me the answer ;)
As far as I can see, it's really a problem with the scrollbar, no matter if it's hidden or not. I think it's a relict of older OS X versions, where the scrollbars were permanently shown. When you resize the outlineview (embedded in a scrollview and this embedded in a splitview), the width of the cells automatically will always become a little bit smaller than the width of the outlineview itself (probably because the NSScrollView code thinks, it has to adjust because of the scrollbar).
Therefore I subclassed NSTableCellView (I'm using a viewbased outlineview) and added this:
- (void)setFrameSize:(NSSize)newSize {
//resize the textframe, so that it will not be cropped too early with "..."
NSRect textFrame = self.textField.frame;
textFrame.size.width = newSize.width;
self.textField.frame = textFrame;
//increase the size of the whole cell
newSize.width = newSize.width + 10.0;
[super setFrameSize:newSize];
}
You also have to increase the width of the textframe, because - as you can see in Finder or Mail etc. - the text of the cell is very early cropped (with "..."). By increasing it's width, this problem is also solved.
I hope, this description is nearly understandable ;)

iOS 7 - Fixed status bar, now bottom of PhoneGap app is cut off by 20px

My PhoneGap application was messed up on iOS 7, like apparently most are at first - the status bar was clear & the text was on top of (overlapping) my app's HTML-based navigation bar. I fixed that by:
In [app name] info.plist:
View controller-based status bar : NO
Status bar style : UIStatusBarStyleLightContent
In MainViewController.m underneath - (void)viewWillAppear:(BOOL)animated is:
self.view.frame = [[UIScreen mainScreen] applicationFrame];
[super viewWillAppear:animated];
NSArray *vComp = [[UIDevice currentDevice].systemVersion
componentsSeparatedByString:#"."];
if ([[vComp objectAtIndex:0] intValue] >= 7) { // iOS 7 or above
CGRect oldBounds = [self.view bounds];
/* Changing the -20 to 0 takes away the black bar
at the top, making the status bar text overlap
my content again... positive 20 of course makes
my content cut off by 20px at the top, so obviously
this is the cause of the problem */
CGRect newBounds = CGRectOffset(oldBounds, 0, -20);
[self.view setBounds:newBounds];
}
I won't bother taking an image of the MainViewController.xib file's settings pane because I'm pretty sure they're made irrelevant by what I've set in info.plist? Let me know if I'm wrong about that.
My app supports rotation as well, in case that matters. And I'm using Cordova 2.1.0.
QUESTION
My HTML code is being cut off by 20px at the bottom because of what I added when trying to get iOS 7's status bar to display properly. If I'm at the bottom of the page in the app & I drag my finger to scroll down further, I can actually see the bottom of my page, but when I lift my finger it's still cut off by 20px (let me know if that makes no sense). What's wrong here? And how do I fix it? In iOS 6 and below, this is NOT an issue - everything is perfect.
Thanks!
https://stackoverflow.com/a/19188984/706751
This is the best solution for people using PhoneGap who experience the iOS 7 Status Bar issue. If other solutions clip your content or don't do well with rotation, this is probably going to work for you!

UIScrollView without AutoLayout shows horizontal scroll Indicator in iOS 6 but not in iOS 7

I spent several days trying to see the working UIScrollView horizontal scroll indicator (without AutoLayout) on iOS7 (on iPad). But without success.
Has anyone fixed such bug?
My project is simple and running iOS5 and iOS6 without troubles.
I found out, that on iOS7 height of the scroll indicator image is always zero:
UIImageView * scrollBar = [[scrollView subviews] lastObject];
if (scrollBar != nil)
{
PrintRect(#"FRAME", scrollBar.frame);
PrintRect(#"BOUNDS", scrollBar.bounds);
}
Result for iOS7:
FRAME x:0.000000 y:54.000000 w:338.000000 h:0.000000
BOUNDS x:0.000000 y:0.000000 w:338.000000 h:0.000000
but for iOS6:
FRAME x:0.000000 y:47.000000 w:338.000000 h:7.000000
BOUNDS x:0.000000 y:0.000000 w:338.000000 h:7.000000
So the height scroll bar image on iOS7 is equal to zero.
It's possible to change the height, but only for a quick time because during drugging the height becames zero again.
I was stuck on something similar. I am doing the CS193P course on iTunes and there was this scrollView exercise - Imaginarium. Basically it's just a UIImageView embedded in a UIScrollView. I was having the same problem that the scroll indicators were not being displayed (with Autolayout turned off)
I looked up the header file for UIScrollView in the documentation and there is this property in scrollView called scrollIndicatorInsets:
The distance the scroll indicators are inset from the edge of the scroll view.
#property(nonatomic) UIEdgeInsets scrollIndicatorInsets
It goes on to say that the default value is UIEdgeInsetsZero!! So I created a UIEdgeInset using UIEdgeInsetsMake (see documentation). Then in viewDidLoad I set this UIEdgeInsets to be my scrollView's scrollIndicatorInsets, after which my indicators appeared when I scrolled.
Hope this works for you too.

Floating UIView on UITableView broken in iOS6

In my app i have UIView that floats at the top of a UITableView (Visualise:Attached to the bottom of the navigation Bar), under iOS5 i was enabling it to float at the top using these lines of code in scrollViewDidScroll
// get the table and buttonView bounds
CGRect tableBounds = self.tableView.bounds;
CGRect buttonViewFrame = self.buttonView.frame;
// make sure the buttonView at the table's original x and y as the content moves
self.buttonView.frame = CGRectMake(tableBounds.origin.x,tableBounds.origin.y,buttonViewFrame.size.width,buttonViewFrame.size.height);
This however no longer seems to work in iOS6, does anyone know why or how to fix the problem? I'm supporting iOS5 and above.
Having looked through the iOS6 release notes i found this...
Note that you can make a subview of the scroll view appear to float (not scroll) over the other scrolling content by creating constraints between the view and a view outside the scroll view’s subtree, such as the scroll view’s superview.
How would I set this up in code as Im not using AutoLayout in storyboards as I'm still supporting iOS5. It would also be great if anyone can enlighten me as to why the code i was using in iOS5 no longer works in 6.

How to make only vertical scroll view?

I already read this one:
http://api.three20.info/interface_t_t_scroll_view.php
But it seems like there is no property for vertical scroll only. However based on the:
http://three20.info/gallery
There are few apps that has "vertical-scroll-only" apps, like the facebook apps. In the facebook app, you can keep vertically scroll to view the latest status/posts/images from your friends, I was wondering if they use TTScrollview or UIScrollview.
Whats the correct way of displaying the "vertical-scroll-only" view in Three20 framework?
Please advise, thanks !
Facebook is most likely using TTTableView for displaying the status updates view in the Facebook app.
TTTableView inherits UITableView, which only scrolls vertically.
Whether you're using Three20 or not, a simple way to implement a vertical only scroll view is to use UIScrollView.
To make a UIScrollView "vertical-scroll-only" you would set the width of the contentSize property to less than or equal to the width of your scroll view, while its height needs to be greater than your scroll view's height to allow for vertical scrolling.
UIScrollView *yourScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 320, 200)];
yourScrollView.contentSize = CGSizeMake(320, 210); // <-- sets the scrollable area
yourScrollView.backgroundColor = [UIColor grayColor];
[self.view addSubview:yourScrollView];

Resources