我在UIScrollView中有一个包含许多UIView子视图的UIView。每个子视图都有一个CATiledLayer图层。此外,我有一个放大镜放大镜功能,在其上下文中绘制容器UIView(以及所有子视图)。相关代码:
这是放大镜的drawRect方法:
- (void)drawRect:(CGRect)rect
{
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextClipToMask( context , loupeRect, self.maskImage);
CGContextSetFillColorWithColor(context, [[UIColor whiteColor] CGColor]);
CGContextFillRect(context, loupeRect);
CGContextSaveGState( context );
CGContextScaleCTM(context, gridScale, gridScale);
CGContextTranslateCTM(context, offset.x, offset.y);
CGRect rectToDraw = CGRectMake(-offset.x, -offset.y, 512, 512);
[appDelegate.gridViewController.objectContainerView drawInContext:context forRect:rectToDraw];
CGContextRestoreGState( context );
[overlayImage drawAtPoint:CGPointZero];
}
这是绘制子视图的容器UIView的drawInContext:forRect方法:
- (void)drawInContext:(CGContextRef)ctx forRect:(CGRect)rect {
CGRect newrect = CGRectMake(rect.origin.x-1024, rect.origin.y-1024, 2048, 2048);
for (UIView* v in [self subviews]) {
float viewscale = v.transform.a;
if (CGRectIntersectsRect(newrect,v.frame)) {
CGContextSaveGState(ctx);
CGContextScaleCTM(ctx, viewscale, viewscale);
CGContextTranslateCTM(ctx, v.frame.origin.x/viewscale, v.frame.origin.y/viewscale);
[v drawLayer:v.layer inContext:ctx];
CGContextRestoreGState(ctx);
}
}
[super drawLayer:self.layer inContext:ctx];
}
最后这是带有CATiledLayer的子视图的drawRect方法:
- (void)drawRect:(CGRect)rect {
CGContextRef context = UIGraphicsGetCurrentContext();
CGFloat scale = CGContextGetCTM(context).a;
scale = (scale <= .125) ? .125 : (scale <= .250 ? .250 : (scale <= .5 ? .5 : 1));
CATiledLayer *tiledLayer = (CATiledLayer *)[self layer];
CGSize tileSize = tiledLayer.tileSize;
tileSize.width /= scale;
tileSize.height /= scale;
int firstCol = floorf(CGRectGetMinX(rect) / tileSize.width);
int lastCol = floorf((CGRectGetMaxX(rect)-1) / tileSize.width);
int firstRow = floorf(CGRectGetMinY(rect) / tileSize.height);
int lastRow = floorf((CGRectGetMaxY(rect)-1) / tileSize.height);
for (int row = firstRow; row <= lastRow; row++) {
for (int col = firstCol; col <= lastCol; col++) {
UIImage *tile = [self tileForScale:scale row:row col:col];
CGRect tileRect = CGRectMake(tileSize.width * col, tileSize.height * row,
tileSize.width, tileSize.height);
tileRect = CGRectIntersection(self.bounds, tileRect);
[tile drawInRect:tileRect];
}
}
}
现在,一切都按我想要的方式工作,但是当放大镜放大并且正在移动时,应用程序显着减慢速度。问题是,每次移动放大镜视图时,都会调用其drawRect方法(因此它可以更新放大的内容),随后调用容器UIView的drawInContext方法等等...导致所有CATiledLayers更新其图像每当放大镜移动时都会放置瓷砖。
正如您所看到的,我试图在放大镜的上下文中绘制更大部分的容器视图,但这就是我被困住的地方。我无法看到如何“缓冲”此容器视图的大部分内容,因此当移动放大镜时,仅当要重绘的矩形超出“缓冲”矩形时才会重绘子视图。
很抱歉,如果代码是草率/新手 - 我在中间并寻求帮助。
谢谢!
答案 0 :(得分:1)
您可以一次预渲染放大镜/放大镜视图会显示的内容吗?我不确定你试图放大的显示器是相对静止还是不断变化。
在我的应用中,用户点按屏幕以放置其他视图。因为他们触摸&amp;移动他们的手指放大镜视图显示项目将被放置的确切位置。此外,当他们正在积极使用放大镜时,背景图像不会改变(他们可能会在其他时间平移/缩放/移动视图,而不是在放大镜正好打开时)。
由于我放大的显示器在放大过程中是静态的,我能够实现一个不会覆盖'draw'方法的放大镜。以下是整个实施;它由ViewController / touch处理程序实例化并持久化。
下面的技巧是截取整个窗口的截图并将其输入到放大镜的layer.contents
。然后使用layer.contentsRect
裁剪,缩放和放大将屏幕截图放在触摸点上。
touchesBegin
来电[_magnifier magnify...
touchesMoved
来电[_magnifier touchPointMovedTo...
touchesEnded
致电[_magnifier removeFromSuperview];
MagnifierView.h
#import <UIKit/UIKit.h>
@interface MagnifierView : UIView {
float _xscale;
float _yscale;
float _loupewidth;
float _loupeheight;
float _xzoom;
float _yzoom;
}
- (void) magnify:(CGPoint) touchPoint;
- (void) touchPointMovedTo:(CGPoint) touchPoint;
@end
MagnifierView.m
#import "MagnifierView.h"
#import <QuartzCore/QuartzCore.h>
#define kMagnifierDiameter 120
@implementation MagnifierView
- (id)initWithFrame:(CGRect)frame {
self = [super initWithFrame:CGRectMake(0, 0, kMagnifierDiameter, kMagnifierDiameter)];
if (self) {
self.layer.borderColor = [[UIColor darkGrayColor] CGColor];
self.layer.borderWidth = 3;
self.layer.cornerRadius = kMagnifierDiameter / 2;
self.layer.masksToBounds = YES;
UIImageView *crosshair = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"crosshairs.png"]];
[crosshair setCenter:self.center];
[self addSubview:crosshair];
[crosshair release];
}
return self;
}
- (void) magnify:(CGPoint)touchPoint
{
UIView *windowview = [[UIApplication sharedApplication] keyWindow];
/// grab a screenshot of the window (sloppy; goal is to get a CGImageRef to put into this view's layer)
UIGraphicsBeginImageContext(windowview.bounds.size);
CGContextRef context = UIGraphicsGetCurrentContext();
[windowview.layer renderInContext:context];
UIImage *screenshot = UIGraphicsGetImageFromCurrentImageContext(); /// autoreleased
UIGraphicsEndImageContext();
/// while we have the image size update our positioning and zooming numbers
_xscale = 1 / screenshot.size.width; /// layer units are 0.0 - 1.0 so scale the numbers to that range
_yscale = 1 / screenshot.size.height;
_loupewidth = _xscale * CGRectGetWidth(self.frame); /// scaled size of this view
_loupeheight = _yscale * CGRectGetHeight(self.frame);
_xzoom = (_xscale * 18); /// arbitrary 16; make sure it's in scaled units (negative to zoom out)
_yzoom = (_yscale * 18);
/// set our layer contents to the imageRef of the screenshot above (again, sloppy; can we skip UIImage altogether?)
CGImageRef imageRef = CGImageCreateWithImageInRect([screenshot CGImage], CGRectMake(0, 0, screenshot.size.width, screenshot.size.height));
self.layer.contents = (id)imageRef;
CGImageRelease(imageRef);
/// add us to the window view and move us
[windowview addSubview:self];
[self touchPointMovedTo:touchPoint];
}
- (void) touchPointMovedTo:(CGPoint)touchPoint
{
self.center = CGPointMake(touchPoint.x, touchPoint.y - 80); /// arbitrary 80 so we float 'above' your fat finger
/// touchPoint is the center; figure out the x,y (top,left)
float xcenter = (_xscale * touchPoint.x);
float x = xcenter - (_loupewidth / 2);
float ycenter = (_yscale * touchPoint.y);
float y = ycenter - (_loupeheight / 2);
/// with no additional adjustments this rect will just 'see through' to the screenshot
CGRect seethrough = CGRectMake(x , y, _loupewidth, _loupeheight);
/// RectInset with the zoom factor to scale up the contents
self.layer.contentsRect = CGRectInset(seethrough, _xzoom, _yzoom);
}
- (void)dealloc {
[super dealloc];
}
@end