IOS Objective C 将具有透明背景的 PNG 文件加载到 UIImageView

IOS Objective C load a PNG file with transparent background to a UIImageView

我正在尝试将具有透明背景的 PNG 文件加载到 UIImageView 中(以防万一,使用 Objective C、XCode 8.0 开发,针对 IOS 10.0 目标). 在 UIImageView 中显示时,图像的背景颜色显示为黑色(见下文)。

如何将任意 PNG 文件加载到 UIImageView 以保留其透明背景?

奇怪的是,我的应用程序资产中有透明背景的 PNG 图像,它们显示在 UIImageView 中,没有任何额外的混乱。

注意在下面的代码中,我尝试的其中一件事是重建从 imagePicker 传递的 UIImage(请参阅 imageWithImage),为新图像设置新的图形上下文。我曾在一些关于模糊相似问题的帖子中看到过这种方法,但它没有用(更不用说它似乎很愚蠢 IOS 要求它支持加载图像中定义的透明度)。

我正在测试的 PNG 图像是标准的 PNG32(出于测试目的从互联网上收集 - 请注意,我已经尝试了许多其他图像):

左下图显示加载上图之前的应用程序屏幕,右图显示加载后的图像:

PNG 图像文件由单击屏幕底部的 'select image' 打开的图像选择器选择。

我的ViewController代码:

//
//  ViewController.m
//  ImageTest
//

#import "ViewController.h"
#import "MobileCoreServices/MobileCoreServices.h"


#define FONT_SIZE_BUTTON    32

@interface ViewController ()

@end

@implementation ViewController

UIImageView *myImageView;
UIImage *myImage;
UIButton *btnSelect;

- (void)viewDidLoad {

    NSLog(@"viewDidLoad" );

    [super viewDidLoad];

    CGRect screenRect = [[UIScreen mainScreen] bounds];

    CGFloat btnHeight = 40;
    CGFloat btnMargin = 10;
    CGFloat btnWidth = screenRect.size.width - 2*btnMargin;
    CGFloat btnULY = screenRect.size.height - btnHeight - 2*btnMargin;

    btnSelect  = [[UIButton alloc] initWithFrame:CGRectMake(btnMargin, btnULY, btnWidth, btnHeight)];
    [btnSelect.titleLabel setFont:[UIFont boldSystemFontOfSize:FONT_SIZE_BUTTON]];
    [btnSelect setAutoresizingMask:UIViewAutoresizingFlexibleWidth];
    [btnSelect setTitle :@"Select Image" forState:UIControlStateNormal];
    [btnSelect.layer setBorderWidth:4.0f];
    [btnSelect.layer setBorderColor:[UIColor blueColor].CGColor];
    [btnSelect setTitleColor:[UIColor blueColor] forState:UIControlStateNormal];
    [btnSelect setTitleColor:[UIColor grayColor] forState:UIControlStateSelected];
    [btnSelect setTitleColor:[UIColor grayColor] forState:UIControlStateDisabled];
    btnSelect.backgroundColor = [UIColor whiteColor];
    btnSelect.tag = 4200;
    [btnSelect addTarget:self action:@selector(onClick:) forControlEvents:UIControlEventTouchUpInside];
    btnSelect.userInteractionEnabled = true;

    CGFloat ulx = 10;
    CGFloat uly = 20;
    CGFloat width = screenRect.size.width - 2*ulx;
    CGFloat height = width * 9.0 / 16.0;

    CGRect imageFrame = CGRectMake(ulx, uly, width, height);

    myImageView = [[UIImageView alloc] initWithFrame:imageFrame];
    myImageView.alpha = 1.0f;
    myImageView.backgroundColor = [UIColor lightGrayColor];
    myImageView.contentMode = UIViewContentModeScaleAspectFit;

    myImageView.opaque = false;
    [[myImageView layer] setOpaque:false];

    [[myImageView layer] setBorderWidth:4.0f];
    [[myImageView layer] setBorderColor:[UIColor redColor].CGColor];

    // Add elements to this view controller
    [self.view addSubview:myImageView];
    [self.view addSubview:btnSelect];
}


- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}


// Ensure image is opened honoring transparency of PNGs
- (UIImage *)imageWithImage:(UIImage *)image {
    CGSize newSize = image.size;
    CGRect newRect = CGRectMake(0,0,newSize.width, newSize.height);

    UIGraphicsBeginImageContextWithOptions(newSize, NO, 1.0);

    CGContextRef ctx = UIGraphicsGetCurrentContext();
    [[UIColor clearColor] set];
    CGContextFillRect(ctx, newRect);

    [image drawInRect:CGRectMake(0, 0, newSize.width, newSize.Height)];
    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return newImage;
}


// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#pragma mark - Select Actions
// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- (IBAction)onClick: (UIButton *)btn
{
    NSLog(@"onClick" );
    //    DDLogInfo(@"%@:%@", THIS_FILE, THIS_METHOD );

    UIImagePickerController *picker = [[UIImagePickerController alloc] init];
    picker.delegate = self;
    picker.allowsEditing = YES;
    picker.sourceType = UIImagePickerControllerSourceTypePhotoLibrary;
    NSMutableArray *mediaTypes = [[NSMutableArray alloc] init];
    [mediaTypes addObject:(__bridge NSString *)kUTTypeImage];
    picker.mediaTypes = mediaTypes;

    [self presentViewController:picker animated:YES completion:NULL];
}


// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#pragma mark - UIImagePicker's Delegate
// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info {

    NSLog(@"imagePickerController" );

    UIImage *chosenImage = [self imageWithImage:info[UIImagePickerControllerEditedImage]];
//    UIImage *chosenImage = info[UIImagePickerControllerEditedImage];
//    UIImage *chosenImage = [info[UIImagePickerControllerEditedImage] imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
    if (myImageView != nil)
        myImageView.image = chosenImage;

    myImage = chosenImage;

    [picker dismissViewControllerAnimated:YES completion:NULL];
}



- (void)imagePickerControllerDidCancel:(UIImagePickerController *)picker {

    [picker dismissViewControllerAnimated:YES completion:NULL];
}


@end

**

编辑并最终修复

**

显示问题的更新应用程序屏幕截图:

和最终的(固定的)代码,显示了使用字典键(UIImagePickerControllerOriginalImage)和字典键(UIImagePickerControllerEditedImage)的区别:

//
//  ViewController.m
//  ImageTest
//
//  Created by Robb Main on 2016-11-21.
//  Copyright © 2016 Robb Main. All rights reserved.
//

#import "ViewController.h"
#import "MobileCoreServices/MobileCoreServices.h"


#define FONT_SIZE_BUTTON    32

@interface ViewController ()

@end

@implementation ViewController

UIImageView *myImageView1;
UIImageView *myImageView2;
UIImageView *myImageView3;
UIImage *myImage;
UIButton *btnSelect;

- (void)viewDidLoad {

    NSLog(@"viewDidLoad" );

    [super viewDidLoad];

    CGRect screenRect = [[UIScreen mainScreen] bounds];

    CGFloat btnHeight = 40;
    CGFloat btnMargin = 10;
    CGFloat btnWidth = screenRect.size.width - 2*btnMargin;
    CGFloat btnULY = screenRect.size.height - btnHeight - 2*btnMargin;

    btnSelect  = [[UIButton alloc] initWithFrame:CGRectMake(btnMargin, btnULY, btnWidth, btnHeight)];
    [btnSelect.titleLabel setFont:[UIFont boldSystemFontOfSize:FONT_SIZE_BUTTON]];
    [btnSelect setAutoresizingMask:UIViewAutoresizingFlexibleWidth];
    [btnSelect setTitle :@"Select Image" forState:UIControlStateNormal];
    [btnSelect.layer setBorderWidth:4.0f];
    [btnSelect.layer setBorderColor:[UIColor blueColor].CGColor];
    [btnSelect setTitleColor:[UIColor blueColor] forState:UIControlStateNormal];
    [btnSelect setTitleColor:[UIColor grayColor] forState:UIControlStateSelected];
    [btnSelect setTitleColor:[UIColor grayColor] forState:UIControlStateDisabled];
    btnSelect.backgroundColor = [UIColor whiteColor];
    btnSelect.tag = 4200;
    [btnSelect addTarget:self action:@selector(onClick:) forControlEvents:UIControlEventTouchUpInside];
    btnSelect.userInteractionEnabled = true;

    CGFloat imgMargin = 60;
    CGFloat ulx = imgMargin;
    CGFloat uly = 20;
    CGFloat imgWidth = screenRect.size.width - 2*imgMargin;
    CGFloat imgHeight = imgWidth * 9.0 / 16.0;

    CGRect imageFrame = CGRectMake(ulx, uly, imgWidth, imgHeight);

    myImageView1 = [[UIImageView alloc] initWithFrame:imageFrame];
    myImageView1.alpha = 1.0f;
    myImageView1.backgroundColor = [UIColor lightGrayColor];
    myImageView1.contentMode = UIViewContentModeScaleAspectFit;
    myImageView1.opaque = NO;
    [myImageView1.layer setOpaque:NO];
//    myImageView.clearsContextBeforeDrawing = YES;
    [myImageView1.layer setBorderWidth:4.0f];
    [myImageView1.layer setBorderColor:[UIColor redColor].CGColor];

    myImageView1.image = [UIImage imageNamed:@"imageTest.png"];

    uly += imgHeight+8;
    CGFloat lblHeight = 10;
    CGRect lblFrame = CGRectMake( ulx, uly, imgWidth, lblHeight);
    UILabel *myLabel1 = [[UILabel alloc] initWithFrame:lblFrame];
    [myLabel1 setFont:[UIFont systemFontOfSize:12]];
    myLabel1.text = @"PNG Image from assets";

    uly += lblHeight+20;
    imageFrame.origin.y = uly;

    myImageView2 = [[UIImageView alloc] initWithFrame:imageFrame];
    myImageView2.alpha = 1.0f;
    myImageView2.backgroundColor = [UIColor lightGrayColor];
    myImageView2.contentMode = UIViewContentModeScaleAspectFit;
    myImageView2.opaque = NO;
    [myImageView2.layer setOpaque:NO];
//    myImageView2.clearsContextBeforeDrawing = YES;
    [myImageView2.layer setBorderWidth:4.0f];
    [myImageView2.layer setBorderColor:[UIColor redColor].CGColor];

    uly += imgHeight+8;
    lblFrame.origin.y = uly;

    UILabel *myLabel2 = [[UILabel alloc] initWithFrame:lblFrame];
    [myLabel2 setFont:[UIFont systemFontOfSize:12]];
    myLabel2.text = @"UIImagePickerControllerOriginalImage";

    uly += lblHeight+20;
    imageFrame.origin.y = uly;

    myImageView3 = [[UIImageView alloc] initWithFrame:imageFrame];
    myImageView3.alpha = 1.0f;
    myImageView3.backgroundColor = [UIColor lightGrayColor];
    myImageView3.contentMode = UIViewContentModeScaleAspectFit;
    myImageView3.opaque = NO;
    [myImageView3.layer setOpaque:NO];
//    myImageView3.clearsContextBeforeDrawing = YES;
    [myImageView3.layer setBorderWidth:4.0f];
    [myImageView3.layer setBorderColor:[UIColor redColor].CGColor];

    uly += imgHeight+8;
    lblFrame.origin.y = uly;

    UILabel *myLabel3 = [[UILabel alloc] initWithFrame:lblFrame];
    [myLabel3 setFont:[UIFont systemFontOfSize:12]];
    myLabel3.text = @"UIImagePickerControllerEditedImage";

    // Add elements to this view controller
    [self.view addSubview:myImageView1];
    [self.view addSubview:myLabel1];
    [self.view addSubview:myImageView2];
    [self.view addSubview:myLabel2];
    [self.view addSubview:myImageView3];
    [self.view addSubview:myLabel3];
    [self.view addSubview:btnSelect];
}


- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}


// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#pragma mark - Select Actions
// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- (IBAction)onClick: (UIButton *)btn
{
    NSLog(@"onClick" );
    //    DDLogInfo(@"%@:%@", THIS_FILE, THIS_METHOD );

    UIImagePickerController *picker = [[UIImagePickerController alloc] init];
    picker.delegate = self;
    picker.allowsEditing = NO;
    picker.sourceType = UIImagePickerControllerSourceTypePhotoLibrary;
    NSMutableArray *mediaTypes = [[NSMutableArray alloc] init];
    [mediaTypes addObject:(__bridge NSString *)kUTTypeImage];
    picker.mediaTypes = mediaTypes;

    [self presentViewController:picker animated:YES completion:NULL];
}


// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#pragma mark - UIImagePicker's Delegate
// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info {

    NSLog(@"imagePickerController" );

    myImage = info[UIImagePickerControllerOriginalImage];
    if (myImageView2 != nil)
        myImageView2.image = myImage;

    if (myImageView3 != nil)
        myImageView3.image = info[UIImagePickerControllerEditedImage];

    [picker dismissViewControllerAnimated:YES completion:NULL];
}



- (void)imagePickerControllerDidCancel:(UIImagePickerController *)picker {

    [picker dismissViewControllerAnimated:YES completion:NULL];
}


@end

这有效,但我不清楚原因:

  1. 对于无效的字典键,imagePicker 不会 return nil(我已经指定不允许编辑)。

  2. 'edited'图像会去除透明度信息。

您的主要问题是在获取所选图像时使用 UIImagePickerControllerEditedImage 而不是 UIImagePickerControllerOriginalImage。编辑后的图像丢失了 alpha 通道,导致黑色而不是透明。

您也不需要 imageWithImage: 方法。