與iPhone

Question

透明度

我的拼圖類遊戲，我有遮蔽兩個圖像的工作剪切圖像， 我已經實現了這個代碼，屏蔽

- (UIImage*) maskImage:(UIImage *)image withMaskImage:(UIImage*)maskImage { 

    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB(); 
    CGImageRef maskImageRef = [maskImage CGImage]; 

    CGContextRef mainViewContentContext = CGBitmapContextCreate (NULL, maskImage.size.width, maskImage.size.height, 8, 0, colorSpace, kCGImageAlphaPremultipliedLast); 

    if (mainViewContentContext==NULL) 
     return NULL; 

    CGFloat ratio = 0; 
    ratio = maskImage.size.width/ image.size.width; 
    if(ratio * image.size.height < maskImage.size.height) { 
     ratio = maskImage.size.height/ image.size.height; 
    } 

    CGRect rect1 = {{0, 0}, {maskImage.size.width, maskImage.size.height}}; 
    CGRect rect2 = {{-((image.size.width*ratio)-maskImage.size.width)/2,-((image.size.height*ratio)-maskImage.size.height)/2},{image.size.width*ratio, image.size.height*ratio}}; 

    CGContextClipToMask(mainViewContentContext, rect1, maskImageRef); 
    CGContextDrawImage(mainViewContentContext, rect2, image.CGImage); 

    CGImageRef newImage = CGBitmapContextCreateImage(mainViewContentContext); 
    CGContextRelease(mainViewContentContext); 

    UIImage *theImage = [UIImage imageWithCGImage:newImage]; 
    CGImageRelease(newImage); 
    return theImage; 
} 

+

=

這是我掩飾後得到的最終結果。

現在我想裁剪圖像中的片狀和等參（由透明度裁剪圖像）。

如果任何人已經實現了這種代碼或任何想法在這種情況下請分享。

謝謝。

我使用這行代碼如岡蒂斯烏爾Treulands的建議

int i=1; 
    for (int x=0; x<=212; x+=106) { 
     for (int y=0; y<318; y+=106) { 
      CGRect rect = CGRectMake(x, y, 106, 106); 
      CGRect rect2x = CGRectMake(x*2, y*2, 212, 212); 

      UIImage *orgImg = [UIImage imageNamed:@"cat@2x.png"]; 
      UIImage *frmImg = [UIImage imageNamed:[NSString stringWithFormat:@"%d@2x.png",i]]; 
      UIImage *cropImg = [self cropImage:orgImg withRect:rect2x]; 

      UIImageView *tmpImg = [[UIImageView alloc] initWithFrame:rect]; 
      [tmpImg setUserInteractionEnabled:YES]; 
      [tmpImg setImage:[self maskImage:cropImg withMaskImage:frmImg]]; 

      [self.view addSubview:tmpImg]; 
      i++; 
     } 
    } 

orgImg是原始貓圖像，frmImg框架用於保持單個片，在Photoshop和cropImg掩蔽是原始貓的106x106裁剪圖像@ 2x.png。

我要裁切功能如下

- (UIImage *) cropImage:(UIImage*)originalImage withRect:(CGRect)rect { 
    return [UIImage imageWithCGImage:CGImageCreateWithImageInRect([originalImage CGImage], rect)]; 
} 

Answer 1

更新2

我就真的很好奇，找到更好的方法來創建一個拼圖，所以我花了兩個週末，並創建了一個演示項目Jigsaw puzzle。

它包含：

• 提供行/列數，它會產生必要的拼圖與正確的寬度/高度。列/行越多 - 寬度/高度和輪廓/內聯拼圖形式越小。
• 每次生成隨機兩側
• 可以隨機地定位在發射的開頭/旋轉件
• 每件可通過抽頭被旋轉，或者通過兩個手指（像一個真正的片） - 但一旦釋放時，它會捕捉到90/180/270/360度
• 如果它的「可觸摸的形狀」邊界接觸每一塊可以移動（這是主要是 - 相同可見拼圖形狀，但沒有內嵌形狀）

缺點：

• 不檢查零件是否在正確的位置
• 如果超過100個零件 - 它開始滯後，因爲在拾取零件時，它會遍歷所有子零件，直到找到正確的零件。

UPDATE

感謝更新的問題。

我設法得到這個：

正如你所看到的 - 拼圖項正確修剪，它是方形的ImageView （綠色爲的UIImageView的backgroundColor）。

所以 - 我所做的是：

CGRect rect = CGRectMake(105, 0, 170, 170); //~ location on cat image where second Jigsaw item will be. 

UIImage *originalCatImage = [UIImage imageNamed:@"cat.png"];//original cat image 

UIImage *jigSawItemMask = [UIImage imageNamed:@"JigsawItemNo2.png"];//second jigsaw item mask (visible in my answer) (same width/height as cat image.) 

UIImage *fullJigSawItemImage = [jigSawItemMask maskImage:originalCatImage];//masking - so that from full cat image would be visible second jigsaw item 

UIImage *croppedJigSawItemImage = [self fullJigSawItemImage withRect:rect];//cropping so that we would get small image with jigsaw item centered in it. 

對於圖像屏蔽我使用的UIImage類功能：

（但你也許可以用你的屏蔽功能，但我反正它張貼。）

- (UIImage*) maskImage:(UIImage *)image 
{  
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB(); 

    UIImage *maskImage = self; 
    CGImageRef maskImageRef = [maskImage CGImage]; 

    // create a bitmap graphics context the size of the image 
    CGContextRef mainViewContentContext = CGBitmapContextCreate (NULL, maskImage.size.width, maskImage.size.height, 8, 0, colorSpace, kCGImageAlphaPremultipliedLast); 


    if (mainViewContentContext==NULL) 
      return NULL; 

    CGFloat ratio = 0; 

    ratio = maskImage.size.width/ image.size.width; 

    if(ratio * image.size.height < maskImage.size.height) { 
      ratio = maskImage.size.height/ image.size.height; 
    } 

    CGRect rect1 = {{0, 0}, {maskImage.size.width, maskImage.size.height}}; 
    CGRect rect2 = {{-((image.size.width*ratio)-maskImage.size.width)/2 , -((image.size.height*ratio)-maskImage.size.height)/2}, {image.size.width*ratio, image.size.height*ratio}}; 


    CGContextClipToMask(mainViewContentContext, rect1, maskImageRef); 
    CGContextDrawImage(mainViewContentContext, rect2, image.CGImage); 


    // Create CGImageRef of the main view bitmap content, and then 
    // release that bitmap context 
    CGImageRef newImage = CGBitmapContextCreateImage(mainViewContentContext); 
    CGContextRelease(mainViewContentContext); 

    UIImage *theImage = [UIImage imageWithCGImage:newImage]; 

    CGImageRelease(newImage); 

    // return the image 
    return theImage; 
} 

以前的答案

你能準備每片口罩？

例如，您有該幀圖像。你可以用9張獨立的圖像在Photoshop中剪切它，每幅圖像中只顯示相應的圖像。 （所有其他 - 刪除）。

實例 - 第二片面膜：

然後使用這些新創建的蒙片上的貓形象 - 每件將屏蔽所有的形象，但一個和平。因此，你將有9張不同的面具使用9張不同的面具。

對於較大或不同的拼圖幀 - 再次創建分離的圖像蒙版。

這是一個基本的解決方案，但並不完美，因爲您需要分別準備每個和平面具。

希望它可以幫助..