iOSインタラクションデザイン
Download as KEY, PDF2 likes1,204 views
The document discusses iOS animation and the UIView class. It provides examples of using UIView methods like beginAnimations and commitAnimations to animate view property changes like center, bounds, transform, backgroundColor and alpha. It also demonstrates how to set animation duration, delay, curve and define animation completion callbacks using delegation. The document compares iOS animation to Android and mentions additional iOS animation topics like loops and the UIKit framework.
![[UIView beginAnimations:nil context:NULL];
// ...
[UIView commitAnimations];](https://image.slidesharecdn.com/ios-110715065242-phpapp01/85/iOS-8-320.jpg)
![[UIView beginAnimations:nil context:NULL];
//
view.center = CGPointMake( 250, 350 );
[UIView commitAnimations];](https://image.slidesharecdn.com/ios-110715065242-phpapp01/85/iOS-10-320.jpg)
![[UIView beginAnimations:nil context:NULL];
//
view.bounds = CGRectMake( 0, 0, 200, 300 );
[UIView commitAnimations];](https://image.slidesharecdn.com/ios-110715065242-phpapp01/85/iOS-11-320.jpg)
![[UIView beginAnimations:nil context:NULL];
//
view.transform = CGAffineTransformRotate(
view.transform,
3.14 / 2 );
[UIView commitAnimations];](https://image.slidesharecdn.com/ios-110715065242-phpapp01/85/iOS-12-320.jpg)
![[UIView beginAnimations:nil context:NULL];
//
view.backgroundColor = [UIColor redColor];
[UIView commitAnimations];](https://image.slidesharecdn.com/ios-110715065242-phpapp01/85/iOS-13-320.jpg)
![[UIView beginAnimations:nil context:NULL];
//
view.alpha = 0;
[UIView commitAnimations];](https://image.slidesharecdn.com/ios-110715065242-phpapp01/85/iOS-14-320.jpg)
![[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:2];
view.center = CGPointMake( 160, 100 );
[UIView commitAnimations];](https://image.slidesharecdn.com/ios-110715065242-phpapp01/85/iOS-16-320.jpg)
![[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDelay:1];
view.center = CGPointMake( 160, 100 );
[UIView commitAnimations];](https://image.slidesharecdn.com/ios-110715065242-phpapp01/85/iOS-18-320.jpg)
![[UIView beginAnimations:nil context:NULL];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
view.center = CGPointMake( 160, 100 );
[UIView commitAnimations];
Linear Ease in Ease out Ease in out](https://image.slidesharecdn.com/ios-110715065242-phpapp01/85/iOS-19-320.jpg)
![[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:@selector(end)];
view.center = CGPointMake( 160, 100 );
[UIView commitAnimations];](https://image.slidesharecdn.com/ios-110715065242-phpapp01/85/iOS-22-320.jpg)
![[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:@selector(end)];
view.center = CGPointMake( 160, 100 );
[UIView commitAnimations];](https://image.slidesharecdn.com/ios-110715065242-phpapp01/85/iOS-23-320.jpg)
iOSインタラクションデザイン
- 1. iOS 2011-7-15
- 2. • twitter : @hIDDEN_xv • ignote iPad • ... i cornering force!
- 3. • twitter : @hIDDEN_xv • ignote iPad • ... i cornering force!
- 5. iOS
- 6. UIView • • •
- 8. [UIView beginAnimations:nil context:NULL]; // ... [UIView commitAnimations];
- 9. beginAnimations commitAnimations
- 10. [UIView beginAnimations:nil context:NULL]; // view.center = CGPointMake( 250, 350 ); [UIView commitAnimations];
- 11. [UIView beginAnimations:nil context:NULL]; // view.bounds = CGRectMake( 0, 0, 200, 300 ); [UIView commitAnimations];
- 12. [UIView beginAnimations:nil context:NULL]; // view.transform = CGAffineTransformRotate( view.transform, 3.14 / 2 ); [UIView commitAnimations];
- 13. [UIView beginAnimations:nil context:NULL]; // view.backgroundColor = [UIColor redColor]; [UIView commitAnimations];
- 14. [UIView beginAnimations:nil context:NULL]; // view.alpha = 0; [UIView commitAnimations];
- 16. [UIView beginAnimations:nil context:NULL]; [UIView setAnimationDuration:2]; view.center = CGPointMake( 160, 100 ); [UIView commitAnimations];
- 17. 0.8 0.3
- 18. [UIView beginAnimations:nil context:NULL]; [UIView setAnimationDelay:1]; view.center = CGPointMake( 160, 100 ); [UIView commitAnimations];
- 19. [UIView beginAnimations:nil context:NULL]; [UIView setAnimationCurve:UIViewAnimationCurveEaseIn]; view.center = CGPointMake( 160, 100 ); [UIView commitAnimations]; Linear Ease in Ease out Ease in out
- 20. Android
- 21. Android
- 22. [UIView beginAnimations:nil context:NULL]; [UIView setAnimationDelegate:self]; [UIView setAnimationDidStopSelector:@selector(end)]; view.center = CGPointMake( 160, 100 ); [UIView commitAnimations];
- 23. [UIView beginAnimations:nil context:NULL]; [UIView setAnimationDelegate:self]; [UIView setAnimationDidStopSelector:@selector(end)]; view.center = CGPointMake( 160, 100 ); [UIView commitAnimations];
- 24. •
- 26. LOOP BOMBER( )
- 27. LOOP BOMBER( )
- 28. LOOP BOMBER( )
- 29. LOOP BOMBER( )
- 30. LOOP BOMBER( ) + + + + + + +
- 31. LOOP BOMBER( ) + + + + + + + + + + +
- 32. LOOP BOMBER( ) + + + + + + + + + + +
- 35. ...
- 37. iPhone iPhone UIKit
Editor's Notes
- #2: \n
- #3: \n
- #4: \n
- #5: \n
- #6: \n
- #7: \n
- #8: \n
- #9: \n
- #10: \n
- #11: \n
- #12: \n
- #13: \n
- #14: \n
- #15: \n
- #16: \n
- #17: \n
- #18: \n
- #19: \n
- #20: \n
- #21: \n
- #22: \n
- #23: \n
- #24: \n
- #25: \n
- #26: \n
- #27: \n
- #28: \n
- #29: \n
- #30: \n
- #31: \n
- #32: \n
- #33: \n
- #34: \n
- #35: \n
- #36: \n
- #37: \n
- #38: \n
- #39: \n
- #40: \n
- #41: \n
- #42: \n
- #43: \n
- #44: \n
- #45: \n
- #46: \n
- #47: \n
- #48: \n
- #49: \n
- #50: \n
- #51: \n
- #52: \n
- #53: \n
- #54: \n
- #55: \n
- #56: \n
- #57: \n
- #58: \n
- #59: \n