Three20

5,445 views

Published on

three20

Published in: Technology
  • Be the first to comment

Three20

  1. 1. Three20 (@cngump) cngump@gmail.com http://www.cngump.com http://www.techparty.org 2012.0211 2 27
  2. 2. What’s Three20? • Three20 iPhone 320×480 • Three20 Facebook Joe Hewitt iOS Lib11 2 27
  3. 3. Three20 Feature • Router URL • CSS • UI • (pull to refresh,photoviewer) • • (json,xml)11 2 27
  4. 4. Three20 Hierarchy Three20 Launcher UI UINavigator Style UICommon Network Core11 2 27
  5. 5. Let’s Begin git source: git clone git://github.com/facebook/three20.git git checkout v1.111 2 27
  6. 6. Template Xcode Template >./InstallTemplates3.2.5.Command Xcode Three20 > python three20/src/scripts/ttmodule.py -p path/to/ myProject.xcodeproj Three2011 2 27
  7. 7. URL-Based Navigation11 2 27
  8. 8. TTNavigator* navigator = [TTNavigator navigator]; // TTNavigator navigator.supportsShakeToReload = YES; // navigator.persistenceMode = TTNavigatorPersistenceModeNone; ! // ! // TTNavigatorPersistenceModeNone ! // TTNavigatorPersistenceModeTop ! ! // TTNavigatorPersistenceModeAll TTURLMap* map = navigator.URLMap;! [map from:@"*" toViewController:[TTWebController class]]; ! // Controller [map from:@"tt://root" toViewController:NSClassFromString(@"RootViewController")]; ! // [map from:@"tt://nib/(loadFromNib:)" toSharedViewController:self]; ! // nib [map from:@"tt://nib/(loadFromNib:)/(withClass:)" toSharedViewController:self]; ! //nib class [map from:@"tt://viewController/(loadFromVC:)" toSharedViewController:self]; ! // [map from:@"tt://modal/(loadFromNib:)" toModalViewController:self]; ! // nib view! if (![navigator restoreViewControllers]) { ! [navigator openURLAction:[TTURLAction actionWithURLPath:@"tt://root"]]; ! // URL }11 2 27
  9. 9. Use URL - (void)createModel { self.dataSource = [TTSectionedDataSource dataSourceWithObjects: @" ",! ! ! ! ! [TTTableTextItem itemWithText:@" " URL:@"tt://nib/DemoTableViewController"], [TTTableTextItem itemWithText:@"Twitter" URL:@"tt://nib/DemoTableViewController"],! [TTTableTextItem itemWithText:@"QQ " URL:@"tt://nib/DemoTableViewController"], nil]; } @end11 2 27
  10. 10. Style11 2 27
  11. 11. //MyStyleSheet.h @interface StyleSheet : TTDefaultStyleSheet { } @end //MyStyleSheet.m #import "StyleSheet.h" @implementation MyStyleSheet - (UIFont*)font { return [UIFont fontWithName:@"Georgia" size:11]; } - (UIFont*)tableFont { return [UIFont fontWithName:@"Georgia" size:12]; } - (UIFont*)tableHeaderPlainFont { return [UIFont fontWithName:@"Georgia-Bold" size:13]; } @end //AppDelegate.m [TTStyleSheet setGlobalStyleSheet:[[[StyleSheet alloc] init] autorelease]];11 2 27
  12. 12. Controllers TTViewController TTTableViewController TTWebController TTPhotoViewController TTThumbsViewController TTPostController TTMessageController TTLauncherViewController11 2 27
  13. 13. UI11 2 27
  14. 14. PhotoView @interface PhotoTest1Controller : TTPhotoViewController @end @implementation PhotoTest1Controller - (void)viewDidLoad { self.photoSource = [[[MockPhotoSource alloc] initWithType:MockPhotoSourceNormal title:@"Flickr Photos" photos:[NSArray arrayWithObjects: [[[MockPhoto alloc] initWithURL:@"http://farm4.static.flickr.com/ 3099/3164979221_6c0e583f7d.jpg?v=0" smallURL:@"http://farm4.static.flickr.com/ 3099/3164979221_6c0e583f7d_t.jpg" size:CGSizeMake(320, 480)] autorelease], [[[MockPhoto alloc] initWithURL:@"http://farm4.static.flickr.com/ 3444/3223645618_13fe36887a_o.jpg" smallURL:@"http://farm4.static.flickr.com/ 3444/3223645618_f5e2fa7fea_t.jpg" size:CGSizeMake(320, 480) caption:@"This is a caption."] autorelease], ! nil] ! ! ! ! ! photos2:nil ] autorelease]; } @end11 2 27
  15. 15. TTThumbsView @interface PhotoTest1Controller : TTThumbsViewController @end @implementation PhotoTest1Controller - (void)viewDidLoad { self.photoSource = [[[MockPhotoSource alloc] initWithType:MockPhotoSourceNormal title:@"Flickr Photos" photos:[NSArray arrayWithObjects: [[[MockPhoto alloc] initWithURL:@"http://farm4.static.flickr.com/ 3099/3164979221_6c0e583f7d.jpg?v=0" smallURL:@"http://farm4.static.flickr.com/ 3099/3164979221_6c0e583f7d_t.jpg" size:CGSizeMake(320, 480)] autorelease], [[[MockPhoto alloc] initWithURL:@"http://farm4.static.flickr.com/ 3444/3223645618_13fe36887a_o.jpg" smallURL:@"http://farm4.static.flickr.com/ 3444/3223645618_f5e2fa7fea_t.jpg" size:CGSizeMake(320, 480) caption:@"This is a caption."] autorelease], ! nil] ! ! ! ! ! photos2:nil ] autorelease]; } @end11 2 27
  16. 16. TTTableViewDragRefreshDelegate // in TTTableViewController‘s sub class - (id<UITableViewDelegate>)createDelegate { ! return [[[TTTableViewDragRefreshDelegate alloc] initWithController:self] autorelease]; }11 2 27
  17. 17. Launcher Added in Three20 1.1 version //BasicLauncherViewController.h #import <Three20Launcher/Three20Launcher.h> @interface BasicLauncherViewController : TTLauncherViewController { } @end //BasicLauncherViewController.m #import "BasicLauncherViewController.h" @implementation BasicLauncherViewController - (void)viewDidLoad { ! [super viewDidLoad];! ! TTLauncherItem* item = [[TTLauncherItem alloc] initWithTitle: @"Item title" image: @"bundle://Icon.png" URL: nil]; ! [self.launcherView addItem:item animated:NO]; ! TT_RELEASE_SAFELY(item); } @end11 2 27
  18. 18. More UI in Three20’s samples11 2 27
  19. 19. Demo Project MultiWeibo11 2 27
  20. 20. 11 2 27
  21. 21. Question?11 2 27

×