레이블이 UIImageView인 게시물을 표시합니다. 모든 게시물 표시
레이블이 UIImageView인 게시물을 표시합니다. 모든 게시물 표시

2012/12/19

[iOS6] 큰 이미지를 작게 표시할 때..


큰 이미지를 iPhone의 작은 화면에 표시를 하거나, 작은 이미지로 사용해야 되는 경우가 많다. 이 경우에 이미지를 그대로 사용하게 되면, 이미지 사이즈가 커서 이미지를 로딩하는 메모리도 많이 사용하게 되고, 이미지를 그대로 압축해서 표시하므로, 계단현상이나 부드럽지 못한 이미지가 표시되게 된다.
이런 경우 Context를 생성하고, 거기에 DrawImage를 해서 작은 이미지와 Blend된 이미지로 표시할 수 있다.

소스
- (UIImage*)getResizedImage:(UIImage*)image inBound:(CGSize)size
{
    if (NULL != UIGraphicsBeginImageContextWithOptions)
        UIGraphicsBeginImageContextWithOptions(size, NO, 0);
    else
        UIGraphicsBeginImageContext(size);
    
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    // Flip the context because UIKit coordinate system is upside down to Quartz coordinate system
    CGContextTranslateCTM(context, 0.0, size.height);
    CGContextScaleCTM(context, 1.0, -1.0);
    
    // Draw the original image to the context
    CGContextSetBlendMode(context, kCGBlendModeCopy);
    CGContextDrawImage(context, CGRectMake(0.0, 0.0, size.width, size.height), image.CGImage);
    
    // Retrieve the UIImage from the current context
    UIImage *imageOut = UIGraphicsGetImageFromCurrentImageContext();
    
    UIGraphicsEndImageContext();
    
    return imageOut;
}

설명
UIImage로 받은 큰 사이즈의 원본을 context에 작게 그리고, 그린 Context에서 UIImage를 받아오면, 작게 Blend된 이미지를 추출할 수 있게 된다.

비교


왼쪽이 원 이미지를 그대로 사용한 것이고 오른쪽이 이미지를 작게 렌더링 한 후 표시한 것입니다.
이미지를 캡춰해서 별 차이가 나지 않지만, 실제로 보면, 차이가 나고 메모리 사용량도 차이가 나는 겁니다.
 많이 필요없는 곳에 많은 데이터를 쓰고 있는 것이지요..

[iOS6] UIImageView의 Shadow설정하기.

이미지를 화면에 표시할 때, 사진처럼 보여주기 위해서, 그림자를 설정해야 되는 경우가 많다.
이럴 경우, UIImageView의 CALayer를 이용해서 그림자를 설정해줄 수 있다.
그림자 설정은 테두리 설정과 동시에 사용할 수 있지만, 라운드 처리와는 같이 사용할 수가 없다.
masksToBounds를 설정해서 주변을 Mask처리해야 하므로 그림자 부분이 사라지게 된다.

소스

#import <QuartzCore/QuartzCore.h>
..
- (void)viewDidLoad
{
    [super viewDidLoad];
    
    self.imageView.layer.shadowColor = [UIColor blackColor].CGColor; //그림자 색상
    self.imageView.layer.shadowOffset = CGSizeMake(5.0, 5.0); //그림자 Offset
    self.imageView.layer.shadowOpacity = 0.9f; //투명도
    self.imageView.layer.shadowRadius = 2.0f; //그림자 코너 부분
    self.imageView.layer.backgroundColor = [UIColor blackColor].CGColor;
}

동작 화면
storyboard에서 UIImageView를 등록하고, property로 연결한 다음에, 위와 같이 설정을 하면, 왼쪽과 같이 그림자를 표시할 수 있게 된다.

2012/12/15

[iOS6] UIImageView의 라운드 처리와 테두리 넣기


iOS6에서 UIImageView의 테두리를 넣고, 라운드 처리하는 것을 정리한다.

CALayer속성 변경하기.
- UIImageView는  UIView의 하위 클래스이므로, UIView에 있는 CALayer인 layer의 property를 변경해서 라운드 처리를 할 수 있다.

#import <QuartzCore/QuartzCore.h>
..

UIImageView* imageView = [[UIImageView alloc] initWithImage:[UIImage ....]];
imageView.layer.cornerRadius = 5.0;        //테두리가 라운드가 된다.
imageView.layer.masksToBounds = YES; //테두리의 배경을 투명하게

imageView.layer.borderColor = [UIColor whiteColor].CGColor; //테두리 색상
imageView.layer.borderWidth = 3.0; //테두리의 두께


예제.