iOS개발을 하다보면 특정 그림을 키워서 쓰기도하고 줄여서 쓰기도 해야 되는 경우가 자주 발생한다. (예를들면 로고?)


보통은 큰이미지 가지고 리사이징해서 많이들 사용하는데. 그림이 디테일이 쩔어서 리사이징 할때  우그러진다든지해서 일일히 각 사이즈별로 다 디자이너가 리사이징해줘야 될때..

이미지로 해결하려다 보면 메모리 이슈가 당근발생한다. UIImage Cache를 Purge할까? 싶을때도 생긴다. 물론 해본적은 없음.


하여튼 개발자라면 아~ 이건아닌데란 생각 많이 한다.


간단한 그림은 iOS CoreGraphic으로 직접그려서 사용하기도 하는데 복잡한 그림은 ....3살짜리도 형님으로 모셔야할 내 그림실력으로는 생각보다 쉽지가 않다.


다시 본론으로 돌아와서 일러스트레이터 그림을 코드상으로 가져오는 방법을 설명하겠다.



1. SVGKit https://github.com/SVGKit/SVGKit


오픈소스이고 iOS & OSX상에서  svg파일을 로드할 수 있다.

.ai 파일을 svg파일로 바꿔야 되는 부분이 있긴하지만.

UIImage 나 UIImageView로 변환해서 쉽게 사용할 수 있는 장점이 있다.


2. PaintCode http://www.paintcodeapp.com/

벡터그래픽툴이고 실시간으로 코드가 생성되는게 보이는 장점

PSD , SVG Import 기능있음 

99.99$라는게 함정.



3. drawscrip.pt http://drawscri.pt  

Adobe Illustrator에서 바로 코드로 변환이 가능하다. 그러나 현재는 베타버전이라는 거..


4. Qwarkee

이역시 SVG to Coregraphic 앱이다. 제한적이기는 하나 잘된다.

함정은 역시 39.99$라는거..


iOS개발자는 돈 많은니 99.99$정도는 그냥살거라 믿기에 PaintCode만 소개 하려 했지만.

선택의 폭을 넓혀드립니다.~


난 돈없으니깐 막 베타 쓰고 그래야지~


 PS. 검색하다가 좋은거 찾았는데 유료 ㅜㅜ

 코드 컴플리션 'Accesorizer' - https://itunes.apple.com/us/app/accessorizer/id402866670?mt=12



저작자 표시 비영리 변경 금지
신고

Cocos2D는 게임을 위한 라이브러리라서 UI관련 컴포넌트들이 상대적으로 부실하다. EAGLView를 지원하므로 UIKit을 함께 쓸 수 있지만. 간단한 UI만 필요한 경우에 굳이 UIKit을 함께 쓰는 것도 그다지 추천할 만한 방법은 아니다.

왜냐하면 UIKit을 함께 쓸경우 잠재적인 버그가 나타날 위험이 있기 때문이다. Cocos2D는 3rd Party 라이브러리 이므로 iOS 업데이트 후에 UIKit 연동에 문제가 생길 확률이 상당히 높다. 예를 들면 iOS5에서 iPad의 경우키보드 스플릿을 지원하게 되었는데 EAGLView에서 UITextField를 사용하고 키보드가 보일때 스플릿 해보면 프리징되면 스플릿이 동작하지 않는다.


COCOS2D에서 지원하는 메뉴 CCMenu는 Touchupinside 이벤트를 지원한다. 터치스크린에서 손이 떨어질 때 이벤트가 발생한다. 

하지만,  다양한 이유(슬라이드 버튼,확장메뉴,즉시 응답이 필요한 경우)로 인해 Touchdown이 필요한 경우가 있다.
TouchDown 이벤트를 지원하는 버튼은 CCSprite를 이용해 만들수도 있고 CCMenu를 상속받아서 CustomCCmenu를 만들 수도 있다.

그 중 CCMenu를 상속하여 TouchDown 이벤트를 지원하는 방법을 소개한다


CCTouchDownMenu.h

//
// CustomCCMenu.h
// MyName
//
// Created by Uzys on 12. 1. 31..
// Copyright 2012 Uzys. All rights reserved.
//

#import <Foundation/Foundation.h>
#import "cocos2d.h"

@interface CCTouchDownMenu : CCMenu {
}
-(BOOL) ccTouchBegan:(UITouch *)touch withEvent:(UIEvent *)event;
@end


CCTouchDownMenu.m

//
// CustomCCMenu.m
// MyName
//
// Created by Uzys on 12. 1. 31..
// Copyright 2012 Uzys. All rights reserved.
//
#import "CCTouchDownMenu.h"

@implementation CCTouchDownMenu

-(CCMenuItem *) itemForTouch: (UITouch *) touch
{
CGPoint touchLocation = [touch locationInView: [touch view]];
touchLocation = [[CCDirector sharedDirector] convertToGL: touchLocation];

CCMenuItem* item;
CCARRAY_FOREACH(children_, item){
// ignore invisible and disabled items: issue #779, #866
if ( [item visible] && [item isEnabled] ) {
CGPoint local = [item convertToNodeSpace:touchLocation];
CGRect r = [item rect];
r.origin = CGPointZero;
if( CGRectContainsPoint( r, local ) )
return item;
}
}
return nil;
}

-(BOOL) ccTouchBegan:(UITouch *)touch withEvent:(UIEvent *)event
{
if( state_ != kCCMenuStateWaiting || !visible_ )
return NO;

for( CCNode *c = self.parent; c != nil; c = c.parent )
if( c.visible == NO )
return NO;
selectedItem_ = [self itemForTouch:touch];
[selectedItem_ selected];

if( selectedItem_ ) {

        [selectedItem_ unselected];
        [selectedItem_ activate];
        state_ = kCCMenuStateWaiting;
return NO;
}
return NO;
}
@end



CCTouchDownMenu 예제의 경우는 해당링크에서 다운로드 받을 수 있다. 
https://github.com/uzysjung/CCTouchDownMenu

저작자 표시 비영리 변경 금지
신고

NSUserDefaults 클래스는 공통으로 사용되는 Default Property를 관리한다.

CoreData,SQLite,File 저장 보다는 간단하게 사용이 가능하다.

보통 로그인,설정,Version 정보 불러오기,저장하기에 사용한다.

이 것 또한 결국에는 Plist를 이용한 것이기 때문에

저장가능한 클래스타입은. NSData, NSString, NSNumber, NSDate, NSArray, NSDictionary 만을 지원한다.

다른 타입의 클래스 인스턴스를 저장하기를 원하면 NSKeyedArchiver/NSKeyedUnarchiver를 이용한 Serialization 과정을 거쳐야 한다. 직렬화 과정에 대한 내용은 추후에 다시 설명하기로 한다.

NSUserDefaults에서 사용하는 Property List의 경로는 아래와 같습니다.

/Users/사용자명/Library/Application Support/iPhone Simulator/4.3.2/Applications/15046BBC-D985-4097-BF7D-2B8BA0121EB4/Library/Preferences/appID.plist





Load


Save



위 코드는 Thread Safe한 코드를 구현해 두었는데 굳이 그럴 필요는 없다 간단히
NSUserDefaults *userDefaults = [NSUserDefaults standardUserDefaults];
인스턴스를 받아서 NSDictionary와 동일하게 사용하면 된다.
저장이 필요할 경우 [userDefaults synchronize] 만 호출하면 된다.


참고 예제 : http://mobile.tutsplus.com/tutorials/iphone/nsuserdefaults_iphone-sdk/

저작자 표시 비영리 변경 금지
신고
1. UIView Transition 관련 Method 소개
 

 1.1 [UIView transitionFromView:toView:duration:options:completion:]

duration 동안  
FromView에서 toView로 장면 전환을 하며 options에서 적용한대로 트랜지션애니메이션이 불리며 끝난 후 completion 블록이 호출된다.
또한 fromView는 removeFromSuperview가 호출되고 toView는 addSubview가 알아서 호출된다.

[UIView transitionFromView:self.view1Controller.view 
                    toView:self.view2Controller.view duration:0.7 
                    options:UIViewAnimationOptionTransitionCurlUp 
                completion:^(BOOL finished){    
                    }];


 1.2 [UIView transitionWithView:duration:options:animations:completion:]


duration동안 transition이 일어날 containerView는  options에서 적용한 트랜지션애니메이션이 불리며 불리는 동안 block-based animation을 수행하고 completion 블록이 호출된다. 

 


[UIView transitionWithView:containerView
           duration:0.2
           options:UIViewAnimationOptionTransitionFlipFromLeft
           animations:^{ [fromView removeFromSuperview]; [containerView addSubview:toView]; }
           completion:^(BOOL finished){ // do something}];


 

 1.3 둘 간의 차이점.
    + transitionWithView의 경우는 AddSubview를 쓰든 view.hidden = YES를 주던 CAAnimation을 추가하던 block-based animation에서 다양한 상황을 제어/추가 할 수 있다.  

    + transitionFromView는 option을 주는 것외에는 화면 전환 애니메이션이 끝날 때까지는 다른 행동을 추가 하지 못한다.

 

1.4 트랜지션 옵션 (UIViewAnimationOptions)

UIViewAnimationOptionTransitionNone
No transition is specified.
Available in iOS 4.0 and later.
Declared in UIView.h.
 
UIViewAnimationOptionTransitionFlipFromLeft
A transition that flips a view around its vertical axis from left to right. The left side of the view moves toward the front and right side toward the back.
Available in iOS 4.0 and later.
Declared in UIView.h.

UIViewAnimationOptionTransitionFlipFromRight
A transition that flips a view around its vertical axis from right to left. The right side of the view moves toward the front and left side toward the back.
Available in iOS 4.0 and later.
Declared in UIView.h.

UIViewAnimationOptionTransitionCurlUp
A transition that curls a view up from the bottom.
Available in iOS 4.0 and later.
Declared in UIView.h.

UIViewAnimationOptionTransitionCurlDown
A transition that curls a view down from the top.
Available in iOS 4.0 and later.
Declared in UIView.h.

-------------------------- iOS5 and later only

UIViewAnimationOptionTransitionCrossDissolve
A transition that dissolves from one view to the next.
Available in iOS 5.0 and later.
Declared in UIView.h.
UIViewAnimationOptionTransitionFlipFromTop
A transition that flips a view around its horizontal axis from top to bottom. The top side of the view moves toward the front and the bottom side toward the back.
Available in iOS 5.0 and later.
Declared in UIView.h.
UIViewAnimationOptionTransitionFlipFromBottom
A transition that flips a view around its horizontal axis from bottom to top. The bottom side of the view moves toward the front and the top side toward the back.
Available in iOS 5.0 and later.
Declared in UIView.h.

2. iOS 4.x 에서 CrossFade 화면 전환은 어떻게 해야 할까? 
   
UIViewAnimationOptionTransitionCrossDissolve는 iOS 5.0 이상에서만 지원된다. 따라서 CAAnimation을 이용해야 한다.

 1.우선 CAAnimation 사용을 위해 QuartzCore.framework을 BuildPhases -> Link Binary With Libraries에 추가한다.
 2. CATransition 코드를 사용하기 위하여 헤더를 임포트 한다 #import <QuartzCore/CAAnimation.h>
 
<예제 1> 아래 예제는 TopView위에 curController.view가 올라가 있는 상황에서 TopView로 화면을 전환하는 상황이다.
 

     [UIView animateWithDuration:0.7 delay:0 options: UIViewAnimationOptionCurveEaseInOut  animations:^{ 
        
            CATransition *animation = [CATransition animation];
            [animation setDuration:0.7];
            [animation setType:kCATransitionFade];
            [topViewController.view.layer addAnimation:animation forKey:nil];            
            
        } completion:^(BOOL finished) {
            [curController.view removeFromSuperview];
            [curController release];
            menuController = nil;
        }];


<예제 2>  아래 예제는 TopView에 curController.view를 넣는 CrossFade 상황이다. 

[UIView animateWithDuration:1.0 delay:0 options: UIViewAnimationOptionCurveEaseInOut  animations:^{ 
        
    CATransition *animation = [CATransition animation];
    [animation setDuration:1.0];
    [animation setType:kCATransitionFade];
    [self.viewController.view.layer addAnimation:animation forKey:nil];                 
    } completion:^(BOOL finished) {
        [topViewController.view addSubview:curController.view];
}];


3. 예제  


위내용들을 포함한 예제를 공개합니다.

ViewController ___ view1stController
                    |___ view2ndController

위 구조에서 화면 전환 효과를 보여줍니다.
 
** 참고

iOS 4.xx의 경우는 nested ViewController를 지원 하지 않기 때문에
viewDidApper / viewDidDisappear 등이 호출 되지 않습니다.
 

다음 2/2에서는 UINavigationController에서 transition animation을 적용하는 법을 설명하겠습니다. 
저작자 표시 비영리 변경 금지
신고

1. Simulator 편

  1.1 Simulator에 이미지 넣기

  (1)  필요한 이미지를 Simulator에 Drag&Drop 한다


(2) Safari가 뜨면 해당 이미지를 마우스로 길게 누른다. (Long Press)


(3) Save Image를 눌르면 Photo album에 들어가 있다.

 

1.2 Simulator에 동영상 넣기

  (1)  Single View Application 프로젝트 만들기


(2) 집어넣으려는 동영상을 번들 리소스에 추가하기


(3) 아래 코드를 삽입하기


(4) 해당 어플리케이션을 시뮬레이터에서 실행

신고


티스토리 툴바