[ios] 내 뷰 컨트롤러의 iOS 7 시차 효과

Objective-C에서 iOS 7 용 앱을 개발 중입니다. 내 앱에는 몇 개의 버튼과 예쁜 배경 이미지가있는 화면이 있습니다. (이 UIButtons위에 있는 간단한 xib입니다 UIImageView.)

이 버튼이 iOS 7 홈 화면과 같은 시차 효과가 있으면 멋질 거라고 생각했는데, 휴대폰을 기울이면 배경이 보입니다.

내 앱에서 그 효과를 어떻게 구현할 수 있습니까?

답변

iOS 7에서 Apple UIMotionEffect은 사용자 기기의 방향과 관련된 모션 효과를 추가하기 위해 도입 되었습니다. 예를 들어, 홈 화면에서 시차 효과를 에뮬레이션하려면 여기 와 여기에 UIInterpolationMotionEffect 설명 된대로 몇 줄의 코드만으로 하위 클래스를 사용할 수 있습니다 .

목표 -C :

// Set vertical effect
UIInterpolatingMotionEffect *verticalMotionEffect = 
  [[UIInterpolatingMotionEffect alloc] 
  initWithKeyPath:@"center.y"
             type:UIInterpolatingMotionEffectTypeTiltAlongVerticalAxis];
verticalMotionEffect.minimumRelativeValue = @(-10);
verticalMotionEffect.maximumRelativeValue = @(10);

// Set horizontal effect 
UIInterpolatingMotionEffect *horizontalMotionEffect = 
  [[UIInterpolatingMotionEffect alloc] 
  initWithKeyPath:@"center.x"     
             type:UIInterpolatingMotionEffectTypeTiltAlongHorizontalAxis];
horizontalMotionEffect.minimumRelativeValue = @(-10);
horizontalMotionEffect.maximumRelativeValue = @(10);

// Create group to combine both
UIMotionEffectGroup *group = [UIMotionEffectGroup new];
group.motionEffects = @[horizontalMotionEffect, verticalMotionEffect];

// Add both effects to your view
[myBackgroundView addMotionEffect:group];

Swift (@Lucas에게 감사드립니다) :

// Set vertical effect
let verticalMotionEffect = UIInterpolatingMotionEffect(keyPath: "center.y",
type: .TiltAlongVerticalAxis)
verticalMotionEffect.minimumRelativeValue = -10
verticalMotionEffect.maximumRelativeValue = 10

// Set horizontal effect
let horizontalMotionEffect = UIInterpolatingMotionEffect(keyPath: "center.x",
    type: .TiltAlongHorizontalAxis)
horizontalMotionEffect.minimumRelativeValue = -10
horizontalMotionEffect.maximumRelativeValue = 10

// Create group to combine both
let group = UIMotionEffectGroup()
group.motionEffects = [horizontalMotionEffect, verticalMotionEffect]

// Add both effects to your view
myBackgroundView.addMotionEffect(group)

또한이 작업을 더 쉽게 수행하거나 이전 iOS 버전에이 기능을 추가 할 수있는 라이브러리를 찾을 수 있습니다.

NGAParallaxMotion ( iOS 7 필요 ).
DVParallaxView ( iOS 5.0 이상 및 ARC 필요 ).
MKParallaxView ( iOS 6.0 에서 테스트되었으며 ARC 필요 ).
UIView-MWParallax ( iOS 6.1 에서 테스트되었으며 ARC 필요 ).

답변

누군가가 게으 르면 신속하게 번역됩니다. 유용하다고 생각되면 @veducm 답변에 투표하십시오.

@IBOutlet var background : UIImageView!

func parallaxEffectOnBackground() {
    let relativeMotionValue = 50
    var verticalMotionEffect : UIInterpolatingMotionEffect = UIInterpolatingMotionEffect(keyPath: "center.y",
        type: .TiltAlongVerticalAxis)
    verticalMotionEffect.minimumRelativeValue = -relativeMotionValue
    verticalMotionEffect.maximumRelativeValue = relativeMotionValue

    var horizontalMotionEffect : UIInterpolatingMotionEffect = UIInterpolatingMotionEffect(keyPath: "center.x",
        type: .TiltAlongHorizontalAxis)
    horizontalMotionEffect.minimumRelativeValue = -relativeMotionValue
    horizontalMotionEffect.maximumRelativeValue = relativeMotionValue

    var group : UIMotionEffectGroup = UIMotionEffectGroup()
    group.motionEffects = [horizontalMotionEffect, verticalMotionEffect]

    self.background.addMotionEffect(group)
}

답변

@veducm의 솔루션은 조금 더 짧을 수 있습니다. x 및 y 축 motionEffect를 별도로 추가하면 x 및 y 모션에 대한 UIMotionEffectGroup은 더 이상 사용되지 않습니다.

UIInterpolatingMotionEffect *motionEffect;
motionEffect = [[UIInterpolatingMotionEffect alloc] initWithKeyPath:@"center.x"
                                                               type:UIInterpolatingMotionEffectTypeTiltAlongHorizontalAxis];
motionEffect.minimumRelativeValue = @(-25);
motionEffect.maximumRelativeValue = @(25);
[bgView addMotionEffect:motionEffect];

motionEffect = [[UIInterpolatingMotionEffect alloc] initWithKeyPath:@"center.y"
                                                               type:UIInterpolatingMotionEffectTypeTiltAlongVerticalAxis];
motionEffect.minimumRelativeValue = @(-25);
motionEffect.maximumRelativeValue = @(25);
[bgView addMotionEffect:motionEffect];

답변

const static CGFloat kCustomIOS7MotionEffectExtent = 10.0;

- (void)applyMotionEffects:(UIView *YOUR_VIEW) {
     if (NSClassFromString(@"UIInterpolatingMotionEffect")) {
         UIInterpolatingMotionEffect *horizontalEffect = [[UIInterpolatingMotionEffect alloc] initWithKeyPath:@"center.x"
                                                                                                        type:UIInterpolatingMotionEffectTypeTiltAlongHorizontalAxis];
         horizontalEffect.minimumRelativeValue = @(-kCustomIOS7MotionEffectExtent);
         horizontalEffect.maximumRelativeValue = @( kCustomIOS7MotionEffectExtent);
         UIInterpolatingMotionEffect *verticalEffect = [[UIInterpolatingMotionEffect alloc] initWithKeyPath:@"center.y"
                                                                                                      type:UIInterpolatingMotionEffectTypeTiltAlongVerticalAxis];
         verticalEffect.minimumRelativeValue = @(-kCustomIOS7MotionEffectExtent);
         verticalEffect.maximumRelativeValue = @( kCustomIOS7MotionEffectExtent);
         UIMotionEffectGroup *motionEffectGroup = [[UIMotionEffectGroup alloc] init];
         motionEffectGroup.motionEffects = @[horizontalEffect, verticalEffect];
         [YOUR_VIEW addMotionEffect:motionEffectGroup];
     }
}

답변

다음은 iOs7 +에 대한 효과를 통합하는 쉬운 범주입니다.

NSString *const centerX = @"center.x";
NSString *const centerY = @"center.y";

//#define IS_OS_7_OR_LATER    ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7.0)

@implementation UIView (TLMotionEffect)

- (void)addCenterMotionEffectsXYWithOffset:(CGFloat)offset {

//    if(!IS_OS_7_OR_LATER) return;
    if(floor(NSFoundationVersionNumber) <= NSFoundationVersionNumber_iOS_6_1) return;

    UIInterpolatingMotionEffect *xAxis;
    UIInterpolatingMotionEffect *yAxis;

    xAxis = [[UIInterpolatingMotionEffect alloc] initWithKeyPath:centerX type:UIInterpolatingMotionEffectTypeTiltAlongHorizontalAxis];
    xAxis.maximumRelativeValue = @(offset);
    xAxis.minimumRelativeValue = @(-offset);

    yAxis = [[UIInterpolatingMotionEffect alloc] initWithKeyPath:centerY type:UIInterpolatingMotionEffectTypeTiltAlongVerticalAxis];
    yAxis.minimumRelativeValue = @(-offset);
    yAxis.maximumRelativeValue = @(offset);

    UIMotionEffectGroup *group = [[UIMotionEffectGroup alloc] init];
    group.motionEffects = @[xAxis, yAxis];

    [self addMotionEffect:group];
}

@end

https://github.com/jvenegas/TLMotionEffect

답변

UIMotionEffect는 iOS 7에서 무료 시차 구현을 제공합니다.

http://www.teehanlax.com/blog/introduction-to-uimotioneffect/

https://github.com/michaeljbishop/NGAParallaxMotion을 사용하면 시차 강도 만 설정할 수 있습니다.

답변

이것은 tableView 또는 collectionView에 대한 시차를 구현하려는 사람을 도울 것입니다.

우선 tableview에 대한 셀을 만들고 이미지보기를 그 안에 넣습니다.

이미지 높이를 셀 높이보다 약간 높게 설정하십시오. 셀 높이 = 160이면 이미지 높이를 200으로 설정합니다 (시차 효과를 만들기 위해 그에 따라 변경할 수 있음).

이 두 변수를 viewController 또는 tableView 대리자가 확장되는 클래스에 넣으십시오.

let imageHeight:CGFloat = 150.0
let OffsetSpeed: CGFloat = 25.0

같은 클래스에 다음 코드를 추가하십시오.

 func scrollViewDidScroll(scrollView: UIScrollView) {
    //  print("inside scroll")

    if let visibleCells = seriesTabelView.visibleCells as? [SeriesTableViewCell] {
        for parallaxCell in visibleCells {
            var yOffset = ((seriesTabelView.contentOffset.y - parallaxCell.frame.origin.y) / imageHeight) * OffsetSpeedTwo
            parallaxCell.offset(CGPointMake(0.0, yOffset))
        }
    }
}

seriesTabelView는 내 UItableview입니다.

이제이 tableView의 셀로 이동하여 다음 코드를 추가합니다.

func offset(offset: CGPoint) {
        posterImage.frame = CGRectOffset(self.posterImage.bounds, offset.x, offset.y)
    }

posterImage는 내 UIImageView입니다.

이것을 collectionView에 구현하려면 tableView vairable을 collectionView 변수로 변경하십시오.

그리고 그게 다야. 이것이 최선의 방법인지 확실하지 않습니다. 그러나 그것은 나를 위해 작동합니다. 그것이 당신에게도 효과가 있기를 바랍니다. 문제가 있으면 알려주세요