Рисование в CATiledLayer с помощью CoreGraphics CGContextDrawImage - PullRequest
6 голосов
/ 01 ноября 2010

Я хотел бы использовать CATiledLayer в iPhone OS 3.1.3 и для этого все рисование в -(void)drawLayer:(CALayer *)layer inContext:(CGContext)context должно быть сделано только с coregraphics.

Теперь я сталкиваюсь с проблемами перевернутой координатысистема на iPhone, и есть несколько советов, как это исправить с помощью преобразований:

Моя проблема в том, что я не могу заставить его работать.Я начал использовать пример кода PhotoScroller и заменил метод рисования только вызовами coregraphics.Выглядит это так:

- (void)drawLayer:(CALayer *)layer inContext:(CGContextRef)context {
CGContextSaveGState(context);
CGRect rect = CGContextGetClipBoundingBox(context);
CGFloat scale = CGContextGetCTM(context).a;
CGContextConcatCTM(context, CGAffineTransformMakeTranslation(0.f, rect.size.height));
CGContextConcatCTM(context, CGAffineTransformMakeScale(1.f, -1.f));

CATiledLayer *tiledLayer = (CATiledLayer *)layer;
CGSize tileSize = tiledLayer.tileSize;


tileSize.width /= scale;
tileSize.height /= scale;
// calculate the rows and columns of tiles that intersect the rect we have been asked to draw
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++) {
     //   if (row == 0 ) continue;
        UIImage *tile = [self tileForScale:scale row:row col:col];
        CGImageRef tileRef = [tile CGImage];
        CGRect tileRect = CGRectMake(tileSize.width * col, tileSize.height * row,
                                     tileSize.width, tileSize.height);
        // if the tile would stick outside of our bounds, we need to truncate it so as to avoid
        // stretching out the partial tiles at the right and bottom edges
        tileRect = CGRectIntersection(self.bounds, tileRect);
        NSLog(@"row:%d, col:%d, x:%.0f y:%.0f, height:%.0f, width:%.0f", row, col,tileRect.origin.x, tileRect.origin.y, tileRect.size.height, tileRect.size.width);

        //[tile drawInRect:tileRect];
        CGContextDrawImage(context, tileRect, tileRef);
// just to draw the row and column index in the tile and mark the origin of the tile with a red line        
        if (self.annotates) {
            CGContextSetStrokeColorWithColor(context, [[UIColor whiteColor]CGColor]);
            CGContextSetLineWidth(context, 6.0 / scale);
            CGContextStrokeRect(context, tileRect);
            CGContextSetStrokeColorWithColor(context, [[UIColor redColor]CGColor]);
            CGContextMoveToPoint(context, tileRect.origin.x, tileRect.origin.y);
            CGContextAddLineToPoint(context, tileRect.origin.x+100.f, tileRect.origin.y+100.f);
            CGContextStrokePath(context);
            CGContextSetStrokeColorWithColor(context, [[UIColor redColor]CGColor]);
            CGContextSetFillColorWithColor(context, [[UIColor whiteColor]CGColor]);
            CGContextSelectFont(context, "Courier", 128, kCGEncodingMacRoman);
            CGContextSetTextDrawingMode(context, kCGTextFill);
            CGContextSetShouldAntialias(context, true);
            char text[30]; 
            int length = sprintf(text,"row:%d col:%d",row,col);
            CGContextSaveGState(context);
            CGContextShowTextAtPoint(context, tileRect.origin.x+110.f,tileRect.origin.y+100.f, text, length);
            CGContextRestoreGState(context);
        }
    }
}

CGContextRestoreGState(context);

}

Как вы можете видеть, я использую преобразование Масштаб, чтобы инвертировать систему координат, и преобразование переноса, чтобы сместить начало координат в нижний левый угол.Изображения рисуются правильно, но рисуется только первый ряд плиток.Я думаю, что есть проблема с операцией перевода или способом вычисления координат плиток.

Вот как это выглядит:

image

IЯ немного запутался со всеми этими преобразованиями.

Бонусный вопрос: как бы обработать сетчатку, отображающую изображения в основной графике?

РЕДАКТИРОВАТЬ: Чтобы заставить его работать наОтображение сетчатки Я только что использовал оригинальный метод из примера кода для предоставления изображений:

- (UIImage *)tileForScale:(CGFloat)scale row:(int)row col:(int)col
{
// we use "imageWithContentsOfFile:" instead of "imageNamed:" here because we don't want UIImage to cache our tiles
NSString *tileName = [NSString stringWithFormat:@"%@_%d_%d_%d", imageName, (int)(scale * 1000), col, row];
NSString *path = [[NSBundle mainBundle] pathForResource:tileName ofType:@"png"];
UIImage *image = [UIImage imageWithContentsOfFile:path];
return image;
}

В принципе масштаб отображения игнорируется, поскольку Core Graphics работает в пикселях, а не в точках поэтому, когда вас просят нарисовать больше пикселей, для заполнения экрана используется больше CATiledLayers (или подслоев).

Большое спасибо Thomas

1 Ответ

10 голосов
/ 02 ноября 2010

Томас, я начал с того, что следил за докладом ScrollView на WWDC 2010, и документации по работе с drawLayer:inContext для iOS 3.x почти нет или нет вообще. У меня были те же проблемы, что и у вас, когда я переместил демонстрационный код со drawRect: на drawLayer:inContext:.

Некоторые исследования показали, что в пределах drawLayer:inContext: размер и смещение rect, возвращаемые из CGContextGetClipBoundingBox(context), - это именно то, что вы хотите нарисовать. Где drawRect: дает вам целые границы.

Зная это, вы можете удалить итерацию строки и столбца, а также пересечение CGRect для краевых плиток и просто нарисовать прямоугольник после перевода контекста.

Вот что я закончил:

- (void)drawLayer:(CALayer *)layer inContext:(CGContextRef)ctx {
  CGRect rect = CGContextGetClipBoundingBox(ctx);
  CGFloat scale = CGContextGetCTM(ctx).a;

  CATiledLayer *tiledLayer = (CATiledLayer *)[self layer];
  CGSize tileSize = tiledLayer.tileSize;
  tileSize.width /= scale;
  tileSize.height /= scale;

  int col = floorf((CGRectGetMaxX(rect)-1) / tileSize.width);
  int row = floorf((CGRectGetMaxY(rect)-1) / tileSize.height);

  CGImageRef image = [self imageForScale:scale row:row col:col];

  if(NULL != image) {
    CGContextTranslateCTM(ctx, 0.0, rect.size.height);
    CGContextScaleCTM(ctx, 1.0, -1.0);
    rect = CGContextGetClipBoundingBox(ctx);

    CGContextDrawImage(ctx, rect, image);
    CGImageRelease(image);
  }
}

Обратите внимание, что rect переопределено после TranslateCTM и ScaleCTM.

И для справки вот моя imageForScale:row:col функция:

- (CGImageRef) imageForScale:(CGFloat)scale row:(int)row col:(int)col {
  CGImageRef image = NULL;
  CGDataProviderRef provider = NULL;
  NSString *filename = [NSString stringWithFormat:@"img_name_here%0.0f_%d_%d",ceilf(scale * 100),col,row];
  NSString *path = [[NSBundle mainBundle] pathForResource:filename ofType:@"png"];

  if(path != nil) {
    NSURL *imageURL = [NSURL fileURLWithPath:path];

    provider = CGDataProviderCreateWithURL((CFURLRef)imageURL);

    image = CGImageCreateWithPNGDataProvider(provider,NULL,FALSE,kCGRenderingIntentDefault); 
    CFRelease(provider);
  }
  return image;
}

Над этими двумя функциями еще предстоит проделать небольшую работу, чтобы правильно поддерживать графику высокого разрешения, но она выглядит хорошо на всех, кроме iPhone 4.

...