以编程方式缩放UIWebView而不使用手势 - 中心点未正确计算 [英] Programmatically zooming a UIWebView without gestures - Center Point not calculated correctly
问题描述
问题
我的iPad应用程序中有一个UIWebView,我需要以编程方式进行缩放,但不使用手势/点击。该应用程序。有一个+和一个 - 按钮,用于以用户定义的增量放大和缩小(这是一个视觉障碍的应用程序)。
I have a UIWebView inside my iPad application which I need to zoom programmatically, but without the use of gestures/taps. The app. has a "+" and a "-" button for zooming in-and-out in user-defined increments (it is an app. for the visually impaired).
这个+/-缩放按钮功能以前在我的应用程序时100%正常工作。在UIScrollView(而不是WebView)中使用了UIImageView。 ImageView是缩放的实际视图,并且为ScrollView的zoomToRect方法计算了CenterPoint。
This +/- zoom-button functionality previously worked 100% fine when my app. used a UIImageView inside of a UIScrollView (instead of the WebView). The ImageView was the actual view which was zoomed, and the CenterPoint was calculated for the ScrollView's zoomToRect method.
我现在有一个WebView,我知道它包含一个ScrollView作为子视图。我尝试调整以前使用ImageView / ScrollView组合的代码来缩放WebView的ScrollView,但它不再为zoomToRect正确计算CenterPoint:。
I now have a WebView, which I know contains a ScrollView as a subview. I tried adapting the code which previously worked with the ImageView/ScrollView combo to instead zoom the WebView's ScrollView, but it is no longer calculating the CenterPoint correctly for zoomToRect:.
发生了什么:
WebView在缩放级别方面正确缩放,但中心点始终为错误。出于某种原因,屏幕每次都会在左上角放大。
The WebView zooms correctly in-terms of the zoom-level, but the center point is always wrong. For some reason, the screen always zooms-in on the top-left every time.
另一个奇怪的问题是,在你第一次放大后,你无法在WebView中滚动超过屏幕的可见部分。如果您尝试,它会显示一些超出当前可见区域范围的内容,但它会立即快照。
Another odd problem, is that after the very first time you zoom-in, you cannot scroll in the WebView past the visible portion of the screen. If you try to, it shows a bit of the content past the bounds of the currently visible area, but it instantly snaps-back.
我尝试过的内容:
我正在尝试缩放UIWebView的ScrollView。
I am trying to zoom the UIWebView's ScrollView.
我创建一个指向ScrollView的指针,并将self设置为其委托。然后我设置了各种变量,例如scrSize(缩放视图的大小)和ZoomHandler(如下所述):
I create a pointer to the ScrollView, and set "self" as its delegate. I then setup various variables, such as scrSize (the size of the view to zoom) and ZoomHandler (explained below):
- (void)viewDidLoad {
// ... Various UIWebView setup ...
[self LoadURL];
// Zooming & scrollview setup
zoomHandler = [[ZoomHandler alloc] initWithZoomLevel: ZOOM_STEP];
scrSize = CGPointMake(self.WebView.frame.size.width, self.WebView.frame.size.height);
scrollView = [WebView.subviews objectAtIndex:0];
[scrollView setTag:ZOOM_VIEW_TAG];
[scrollView setMinimumZoomScale:MINIMUM_SCALE];
[scrollView setZoomScale:1];
[scrollView setMaximumZoomScale:10];
scrollView.bounces = FALSE;
scrollView.bouncesZoom = FALSE;
scrollView.clipsToBounds = NO;
[scrollView setDelegate:self];
[super viewDidLoad];
}
要覆盖WebView的默认缩放限制,我将此Javascript注入已加载的网页在webViewDidFinishLoad:方法中:
To override the WebView's default zooming limitations, I inject this Javascript into the loaded webpage in the webViewDidFinishLoad: method:
function increaseMaxZoomFactor() {
var element = document.createElement('meta');
element.name = "viewport";
element.content = "maximum-scale=10 minimum-scale=1 initial-scale=1 user-scalable=yes width=device-width height=device-height;"
var head = document.getElementsByTagName('head')[0];
head.appendChild(element);
}
CenterPoint代码:
此代码用于计算要传递到zoomToRect:的CenterPoint。当我在ScrollView内部缩放ImageView时,这个效果非常好。
This code is used to calculate the CenterPoint to pass into zoomToRect:. This worked 100% fine when I was zooming an ImageView inside of a ScrollView.
-(IBAction)zoomOut {
float newScale = [scrollView zoomScale] / ZOOM_STEP;
if( [scrollView zoomScale] > MINIMUM_SCALE) {
[self handleZoomWith:newScale andZoomType: FALSE];
}
}
-(IBAction)zoomIn {
float newScale = [scrollView zoomScale] * ZOOM_STEP;
if( [scrollView zoomScale] < MAXIMUM_SCALE){
[self handleZoomWith:newScale andZoomType: TRUE];
}
}
-(void)handleZoomWith: (float) newScale andZoomType:(BOOL) isZoomIn {
CGPoint newOrigin = [zoomHandler getNewOriginFromViewLocation: [scrollView contentOffset]
viewSize: scrSize andZoomType: isZoomIn];
CGRect zoomRect = [self zoomRectForScale:newScale withCenter:newOrigin];
[scrollView zoomToRect:zoomRect animated:YES];
}
- (CGRect)zoomRectForScale:(float)scale withCenter:(CGPoint)center {
CGRect zoomRect;
// At a zoom scale of 1.0, it would be the size of the scrollView's bounds.
// As the zoom scale decreases, so more content is visible, the size of the rect grows.
zoomRect.size.height = [WebView frame].size.height / scale;
zoomRect.size.width = [WebView frame].size.width / scale;
// Choose an origin so as to get the right center.
zoomRect.origin.x = center.x / scale;
zoomRect.origin.y = center.y / scale;
return zoomRect;
}
/**
Determine the origin [THIS IS INSIDE ZOOMHANDLER]
*/
-(CGPoint) getNewOriginFromViewLocation: (CGPoint) oldOrigin viewSize: (CGPoint) viewSize andZoomType:(BOOL) isZoomIn {
// Calculate original center (add the half of the width/height of the screen)
float oldCenterX = oldOrigin.x + (viewSize.x / 2);
float oldCenterY = oldOrigin.y + (viewSize.y / 2);
// Xalculate the new center
CGPoint newCenter;
if(isZoomIn) {
newCenter = CGPointMake(oldCenterX * zoomLevel, oldCenterY * zoomLevel);
} else {
newCenter = CGPointMake(oldCenterX / zoomLevel, oldCenterY / zoomLevel);
}
// Calculate the new origin (deduct the half of the width/height of the screen)
float newOriginX = newCenter.x - (viewSize.x / 2);
float newOriginY = newCenter.y - (viewSize.y / 2);
return CGPointMake(newOriginX, newOriginY);
}
有没有人知道为什么没有正确计算CenterPoint?任何帮助将不胜感激;我已经坚持了一个星期了。
Does anyone have any idea why the CenterPoint is not being calculated correctly? Any help would be GREATLY appreciated; I have been stuck on this for a week now.
谢谢,
Alex
Thanks, Alex
推荐答案
您是否尝试使用JavaScript而不是UIWebView的scrollview实现缩放?
Have you tried implementing the zoom using JavaScript rather than the UIWebView's scrollview ?
我相信您可以通过调用来缩放webview:
I believe you can zoom the webview by calling:
[webView stringByEvaluatingJavaScriptFromString:@document.body.style.zoom = 5.0;];
(使用你的 ZOOM_STEP
作为值)
您还可以使用JS计算浏览器窗口的中心:
You could also calculate the center of the browser window using JS:
posY = getScreenCenterY();
posX = getScreenCenterX();
function getScreenCenterY() {
var y = 0;
y = getScrollOffset()+(getInnerHeight()/2);
return(y);
}
function getScreenCenterX() {
return(document.body.clientWidth/2);
}
function getInnerHeight() {
var y;
if (self.innerHeight) // all except Explorer
{
y = self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientHeight)
// Explorer 6 Strict Mode
{
y = document.documentElement.clientHeight;
}
else if (document.body) // other Explorers
{
y = document.body.clientHeight;
}
return(y);
}
function getScrollOffset() {
var y;
if (self.pageYOffset) // all except Explorer
{
y = self.pageYOffset;
}
else if (document.documentElement &&
document.documentElement.scrollTop) // Explorer 6 Strict
{
y = document.documentElement.scrollTop;
}
else if (document.body) // all other Explorers
{
y = document.body.scrollTop;
}
return(y);
}
(来源: http://sliceofcake.wordpress.com/2007/09/13/use -javascript-to-the-the-the-the-browser / )
这篇关于以编程方式缩放UIWebView而不使用手势 - 中心点未正确计算的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!