UI & performance tips.

1. iPhone SDK
http://kishikawakatsumi.com
Twitter
@k_katsumi
24/7 twenty-four seven
http://d.hatena.ne.jp/KishikawaKatsumi/

2. iPhone SDK
http://kishikawakatsumi.com
Twitter
@k_katsumi
24/7 twenty-four seven
http://d.hatena.ne.jp/KishikawaKatsumi/

3. iPhone SDK
• touch • on the WEB
•LDR touch •
• •i-Radio
•LCD Clock •
•Subway Map •
•MyWebClip
• •

4. iPhone SDK
http://github.com/kishikawakatsumi
•hatena-touch •DescriptionBuilder
•ldr-touch •TiledLayerView
•tv-listings •UICCalendarPicker
•MapKit-Route-Directions
•FlipCardNavigationView
•PhotoFlipCardView

5. iPhone SDK
http://github.com/kishikawakatsumi
•UICKeyChainStore
•TiKeyChainStore
•CropImageSample

6. iPhone SDK

7. iPhone SDK

8. iPhone SDK

9. iPhone SDK

10. iPhone SDK

11. iPhone SDK
#import <UIKit/UIKit.h>
extern NSString * const FFNavigationBarSwipedNotification;
@interface FFNavigationBar : UINavigationBar
@end

12. #import "FFNavigationBar.h"
@implementation FFNavigationBar
iPhone SDK
- (void)initCommon {
self.barStyle = UIBarStyleBlack;
}
- (id)init {
self = [super init];
if (self) {
[self initCommon];
}
return self;
}
- (id)initWithFrame:(CGRect)frame {
self = [super initWithFrame:frame];
if (self) {
[self initCommon];
}
return self;
}

13. - (id)initWithCoder:(NSCoder *)coder {
self = [super initWithCoder:coder];
iPhone SDK
if (self) {
[self initCommon];
}
return self;
}
- (void)drawRect:(CGRect)rect {
[background drawAsPatternInRect:rect];
}
@end

14. iPhone SDK

15. iPhone SDK
UITableView

16. iPhone SDK
UITableViewCell

17. iPhone SDK

18. iPhone SDK
iPhone

19. iPhone SDK

20. iPhone SDK

21. iPhone SDK
•UIImageView
•CALayer
•[UIImage drawRect:]

22. iPhone SDK
•UIImageView
•CALayer
•[UIImage drawRect:]

23. iPhone SDK
UIImageView
UIImageView
CALayer
UIImage draw~
UIButton

24. iPhone SDK
UIImage draw~
PNG
http://sonson.jp/?p=745
PNG
=> UI
=>
=>JPEG

25. iPhone SDK
CALayer *backgroundImageLayer = [CALayer layer];
backgroundImageLayer.frame =
CGRectMake(17.0f, 12.0f, 285.0f, 310.0f);
backgroundImageLayer.contents = (id)[[UIImage
imageNamed:@"photo_bg.png"] CGImage];
[self.contentView.layer addSublayer:backgroundImageLayer];
photoImageView = [[UIImageView alloc]
initWithFrame:CGRectMake(30.0f, 18.0f, 260.0f, 260.0f)];
photoImageView.backgroundColor = [UIColor clearColor];
[self.contentView addSubview:photoImageView];
[photoImageView release];

26. iPhone SDK
preloaderBackground =
[[UIImageView alloc]
initWithFrame:CGRectMake(95.0f, 95.0f, 70.0f, 70.0f)];
preloaderBackground.backgroundColor = [UIColor
clearColor];
preloaderBackground.image = [UIImage
imageNamed:@"photo_preloader.png"];
[photoImageView addSubview:preloaderBackground];
[preloaderBackground release];
preloader =
[[FFPreloaderView alloc]
initWithFrame:CGRectMake(5.0f, 1.0f, 60.0f, 20.0f)];
[preloaderBackground addSubview:preloader];
[preloader release];

27. iPhone SDK
CALayer *shadowLayer = [CALayer layer];
shadowLayer.frame =
CGRectMake(30.0f, 18.0f, 260.0f, 260.0f);
shadowLayer.contents = (id)[[UIImage
imageNamed:@"photo_shadow.png"] CGImage];
[cellContentView.layer addSublayer:shadowLayer];
favoriteButton = [[FFFavoriteButton alloc]
initWithFrame:CGRectMake(19.0f, 24.0f, 75.0f, 29.0f)];
favoriteButton.exclusiveTouch = YES;

28. iPhone SDK

29. iPhone SDK
NSCache
NSDictionary

30. @interface FFImageCache : NSObject {
NSFileManager *fileManager;
iPhone SDK
NSString *cacheDirectory;
NSCache *cache;
}
+ (FFImageCache *)sharedInstance;
- (UIImage *)cachedImageWithURL:(NSString *)URL;
- (UIImage *)cachedImageWithURL:(NSString *)URL
defaultImage:(UIImage *)defaultImage;
- (UIImage *)cachedImageWithURL:(NSString *)URL
size:(NSInteger)size;
- (UIImage *)cachedImageWithURL:(NSString *)URL
size:(NSInteger)size
defaultImage:(UIImage *)defaultImage;
- (void)storeImage:(UIImage *)image data:(NSData *)data
URL:(NSString *)URL;
- (void)purgeMemoryCache;
- (void)deleteAllCacheFiles;
@end

31. iPhone SDK
=>

32. - (UIImage *)cachedImageWithURL:(NSString *)URL
defaultImage:(UIImage *)defaultImage {
iPhone SDK
NSString *key = [FFImageCache keyForURL:URL];
UIImage *cachedImage = [cache objectForKey:key];
if (cachedImage) {
return cachedImage;
}
cachedImage = [UIImage imageWithContentsOfFile:[self pathForKey:key]];
if (cachedImage) {
[cache setObject:cachedImage forKey:key];
}
return cachedImage;
}
- (void)storeImage:(UIImage *)image data:(NSData *)data URL:(NSString *)URL
{
NSString *key = [FFImageCache keyForURL:URL];
[cache setObject:image forKey:key];
[data writeToFile:[self pathForKey:key] atomically:NO];
}

33. + (NSString *)keyForURL:(NSString *)URL {
! if ([URL length] == 0) {
! !
! } iPhone SDK
return nil;
! const char *cStr = [URL UTF8String];
! unsigned char result[16];
! CC_MD5(cStr, (CC_LONG)strlen(cStr), result);
! return [NSString stringWithFormat:@"%02X%02X%02X%02X%02X%02X
%02X%02X%02X%02X%02X%02X%02X%02X%02X%02X",
result[0], result[1], result[2], result[3],
result[4], result[5], result[6], result[7],result[8],
result[9], result[10], result[11],result[12], result[13],
result[14], result[15]]; !
}

34. iPhone SDK

35. iPhone SDK

36. - (void)scrollViewWillBeginDragging:(UIScrollView
*)scrollView {
iPhone SDK
if (!scrollView.isDecelerating) {
contentOffsetY = scrollView.contentOffset.y;
}
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView
willDecelerate:(BOOL)decelerate {
shouldSnapScroll =
scrollView.isTracking && scrollView.isDragging && !
scrollView.isDecelerating;
if (!decelerate) {
[self loadImagesForOnscreenRows];
}
}

37. - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
[self loadImagesForOnscreenRows];
iPhone SDK
CGFloat distance =
ABS(distance = contentOffsetY - scrollView.contentOffset.y);
if (distance > timelineView.frame.size.height * 2) {
shouldSnapScroll = YES;
}
if (!shouldSnapScroll) {
return;
}
NSArray *indexPaths = timelineView.indexPathsForVisibleRows;
if ([indexPaths count] == 0) {
return;
}
if (contentOffsetY > scrollView.contentOffset.y) {
scrollDirection = ScrollDirectionUp;
} else {
scrollDirection = ScrollDirectionDown;
}

38. CGFloat delta;
NSIndexPath *indexPath;
if (scrollDirection == ScrollDirectionUp) {
iPhone SDK
indexPath = [indexPaths objectAtIndex:0];
CGRect rect = [timelineView rectForSection:indexPath.section];
delta = scrollView.contentOffset.y - rect.origin.y;
if (delta > 250.0f) {
indexPath = [indexPaths lastObject];
rect = [timelineView rectForSection:indexPath.section];
delta = rect.origin.y - scrollView.contentOffset.y;
if (delta < 0.0f) {
return;
}
}
} else {
indexPath = [indexPaths lastObject];
CGRect rect = [timelineView rectForSection:indexPath.section];
delta = rect.origin.y - scrollView.contentOffset.y;
if (indexPath.section == [timelineManager count] - 1) {
return;
}
if (delta < 0.0f) {
return;
}
if (delta > 200.0f) {
indexPath = [indexPaths objectAtIndex:0];
}
}
if (scrollView.contentInset.top < 60.0f && scrollView.contentOffset.y > 0.0f) {
NSIndexPath *toIndexPath = [NSIndexPath indexPathForRow:0
inSection:indexPath.section];
[timelineView scrollToRowAtIndexPath:toIndexPath
atScrollPosition:UITableViewScrollPositionTop animated:YES];
}
}

39. iPhone SDK

40. iPhone SDK

41. iPhone SDK

42. - (void)animateIcon:(BOOL)flag {
[UIView transitionFromView:flag ? icon : selectedIcon
iPhone SDK
toView:flag ? selectedIcon : icon duration:0.4
options:UIViewAnimationOptionTransitionFlipFromRight |
UIViewAnimationOptionShowHideTransitionViews completion:
^(BOOL finished) {
if (!animaitionFinished) {
[self animateIcon:!flag];
}
}];
}
- (void)setEnabled:(BOOL)enabled {
[super setEnabled:enabled];
if (enabled) {
animaitionFinished = YES;
} else {
animaitionFinished = NO;
shouldStartZoomAnimation = YES;
[self animateIcon:self.selected];
}
}

43. - (void)setSelected:(BOOL)selected {
[super setSelected:selected];
if (selected) {
iPhone SDK
icon.hidden = YES;
selectedIcon.hidden = NO;
animationIcon.image = [UIImage imageNamed:@"button_favorite_icon_selected.png"];
} else {
icon.hidden = NO;
selectedIcon.hidden = YES;
animationIcon.image = [UIImage imageNamed:@"button_favorite_icon.png"];
}
if (shouldStartZoomAnimation) {
shouldStartZoomAnimation = NO;
CABasicAnimation *zoom = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
zoom.toValue = [NSNumber numberWithFloat:8.0f];
CABasicAnimation *fade = [CABasicAnimation animationWithKeyPath:@"opacity"];
fade.toValue = [NSNumber numberWithFloat:0.0f];
CAAnimationGroup *group = [CAAnimationGroup animation];
group.delegate = self;
group.animations = [NSArray arrayWithObjects:zoom, fade, nil];
group.duration = 0.5;
animationIcon.hidden = NO;
[animationIcon.layer addAnimation:group forKey:nil];
}
}
- (void)animationDidStop:(CAAnimation *)theAnimation finished:(BOOL)flag {
animationIcon.hidden = YES;
}

44. iPhone SDK

45. iPhone SDK
UITableView

46. photoScrollView = [[UITableView alloc] initWithFrame:CGRectMake(6.0f,
30.0f, 50.0f, 264.0f)];
iPhone SDK
photoScrollView.delegate = self;
photoScrollView.dataSource = self;
photoScrollView.rowHeight = 44.0f;
photoScrollView.separatorColor = [UIColor clearColor];
photoScrollView.pagingEnabled = YES;
photoScrollView.showsHorizontalScrollIndicator = NO;
photoScrollView.showsVerticalScrollIndicator = NO;
photoScrollView.backgroundColor = [UIColor clearColor];
photoScrollView.transform = CGAffineTransformMakeRotation(M_PI / -2.0f);
photoScrollView.center = CGPointMake(146.0f, 56.0f);
[cellContentView addSubview:photoScrollView];
[photoScrollView release];
pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(12.0f, 72.0f,
264.0f, 36.0f)];
pageControl.clipsToBounds = YES;
pageControl.hidesForSinglePage = YES;
pageControl.userInteractionEnabled = NO;
[cellContentView addSubview:pageControl];
[pageControl release];
UITapGestureRecognizer *tapRecognizer = [[UITapGestureRecognizer alloc]
initWithTarget:self action:@selector(scrollViewTapped:)];
[photoScrollView addGestureRecognizer:tapRecognizer];
[tapRecognizer release];

47. - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
return 1;
iPhone SDK
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:
(NSInteger)section {
NSUInteger count = [photos count];
if (count == 0) {
pageControl.numberOfPages = 0;
} else {
pageControl.numberOfPages = MIN(count / 6 + 1, 17) ;
}
pageControl.currentPage = 0;
return count;
}

48. - (UITableViewCell *)tableView:(UITableView *)tableView
cellForRowAtIndexPath:(NSIndexPath *)indexPath {
iPhone SDK
NSUInteger count = [photos count];
NSUInteger numPages = count / 6 + 1;
photoScrollView.contentSize = CGSizeMake(50.0f, 264.0f *
numPages);
static NSString *cellIdentifier = @"Cell";
FFMyPhotoImageCell *cell = (FFMyPhotoImageCell *)[tableView
dequeueReusableCellWithIdentifier:cellIdentifier];
if (cell == nil) {
cell = [[[FFMyPhotoImageCell alloc]
initWithStyle:UITableViewCellStyleDefault
reuseIdentifier:cellIdentifier]autorelease];
cell.selectionStyle = UITableViewCellSelectionStyleNone;
}
cell.URL = [[photos objectAtIndex:indexPath.row]
objectForKey:FFURLKey];
return cell;
}

49. - (void)scrollViewDidScroll:(UIScrollView *)sender {
if (pageControlUsed) {
iPhone SDK
return;
}
CGFloat pageWidth = photoScrollView.bounds.size.height;
int page = floor((photoScrollView.contentOffset.y -
pageWidth / 2) / pageWidth) + 1;
! currentPage = MIN(page, 16);
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
pageControlUsed = NO;
pageControl.currentPage = currentPage;
}
- (void)scrollViewTapped:(UIGestureRecognizer *)gestureRecognizer
{
UITableView *tableView = (UITableView *)self.superview;
[tableView.delegate tableView:tableView
didSelectRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:
0]];
}

50. iPhone SDK

51. CGFloat x = 41.0f;
CGSize size;
iPhone SDK
NSString *username = user.username;
if ([username length] > 0) {
UIFont *commentUsernameFont = [FFConstants commentUsernameFont];
size = [username sizeWithFont:commentUsernameFont forWidth:253.0f - x
lineBreakMode:UILineBreakModeTailTruncation];
[username drawInRect:CGRectMake(x, 6.0f, size.width, 12.0f) withFont:commentUsernameFont
lineBreakMode:UILineBreakModeTailTruncation alignment:UITextAlignmentLeft];
x += size.width;
NSString *action = NSLocalizedString(@" faved.", nil);
UIFont *commentFont = [FFConstants commentFont];
size = [action sizeWithFont:commentFont forWidth:253.0f - x
lineBreakMode:UILineBreakModeClip];
[action drawInRect:CGRectMake(x, 6.0f, size.width, 12.0f) withFont:commentFont
lineBreakMode:UILineBreakModeClip alignment:UITextAlignmentLeft];
NSMutableString *str = [NSMutableString string];
NSUInteger index = 0;
NSUInteger length = [action length];;
for (; index < length; index++) {
[str appendString:[action substringWithRange:NSMakeRange(index, 1)]];
CGSize sz = [str sizeWithFont:commentFont forWidth:253.0f - x
lineBreakMode:UILineBreakModeClip];
if (sz.width >= size.width) {
index++;
break;
}
}
action = [action substringWithRange:NSMakeRange(index, length - index)];
[action drawInRect:CGRectMake(41.0f, 22.0f, 212.0f, 12.0f) withFont:commentFont
lineBreakMode:UILineBreakModeClip alignment:UITextAlignmentLeft];
}

52. iPhone SDK