Matt's Portfolio

Three20 TTTableItem Tutorial

MattV — Sun, 23 Aug 2009 00:50:24 +0000

Say Hello to Three20 TTTableItemCells

Over the last couple of months I’ve shown you how to use Joe Hewitt’s Three20 iPhone library to create css-like stylesheets for your iPhone Apps, as well as custom table cells for your iPhone Apps.

But a while ago Joe changed up the way we make custom table cells. Instead of using TTTableField and TTTableFieldCell we now use TTTableItem and TTTableItemCell to accomplish custom table cells.

So today I am going to show you how to create an iPhone App using Three20’s TTTableItem and TTTableItemCell.

Enough talk! Lets start the show

This is the game plan for creating our custom table cells:

First we’re going to decide on, and then design the custom cell we want for our App
Then we’re going to setup our App, create some necessary files, etc
And we’re going to make our own TableItems by subclassing TTTableItem
We’re going to make our own TableItemCells by subclassing TTTableItemCell
We’re going instantiate our new TableItems in our DataSource
We’re going to make the App render the correct TableItemCell for each TableItem we just made
And then finally when we’ve done all the other stuff ^, we’ll have a sexy new app with sexy custom table cells

1. Designing our Custom Cell

Due to several questions and requests about putting images in custom cells, I think I’ll show you how to put some images, as well as text into our cell

Our App will look something like this:

2. Setup the App

I think the easiest way to learn this shiznit, is to follow along step by step with this tutorial (i’ve created a three20 App template that works great for this)

Download or Clone my Three20 Tutorial repository from github
When my repo is downloaded or cloned open it and copy and past the basic-navigation-app-template somewhere else on your computer (if you want)
The three20-iPhone-tutorials folder should now look like this:
Rename basic-navigation-app-template copy folder to something like tableitem-tutorial-working
Open the Xcode Project file inside of your new folder (again we’re using a template App that I created)
Now we need to create some new classes inside of XCode:
1. We need a new class that will subclass TTTableItem. Go File >> New File >> Objective-C Class >> Name it BNTableItem (following Joe’s naming conventions). Make sure “Also create BNTableItem.h” is checked.
2. We also need a new class where we will sublclass TTTableItemCell. Go File >> New File >> Objective-C Class >> Name it BNTableItemCell (following Joe’s naming conventions). Make sure “Also create BNTableItemCell.h” is checked.

Now that our all of our files are created let’s give our App a title. Go into RootViewController.m and change the line

self.title = @”Tutorial Title”;

self.title = @”TableItem Tutorial”;.

RootViewController.m should now look like this:

#import "RootViewController.h"  

#pragma mark import dataSource
#import "RootViewDataSource.h"  

# pragma mark import table cells  

@implementation RootViewController  

///////////////////////////////////////////////////////////////////////////////////////////////////
// UIViewController  

- (void)loadView {
    [super loadView];  

    self.tableView = [[[UITableView alloc] initWithFrame:self.view.bounds
                                                   style:UITableViewStyleGrouped] autorelease];
    self.tableView.autoresizingMask = UIViewAutoresizingFlexibleWidth
    | UIViewAutoresizingFlexibleHeight;
    self.variableHeightRows = YES;
    self.title = @"TableItem Tutorial";
    [self.view addSubview:self.tableView];
}  

//////////////////////////////////////////////////////////////////////////////////////////////////
// TTTableViewController  

- (id)createDataSource {
    return [RootViewDataSource rootViewDataSource];
}  

@end

Make sure that you have selected Device 3.0 or Simulator 3.0 to run the app
Open the App and see what happens. Click Build and Go (or Build >> Build and Go (Run)).
The App should look like this (nothing special yet, but just you wait):

3. Subclass TTTableItem

Now we need to make our TableItem. To do this we are going to subclass TTTableCaptionedItem.

TableItems hold the data, TableItemCells actually display the data.

Sink that into your head, it’s important:

TableItems = Holds the data, TableItemCells = Displays the data held in it’s TableItem

Do the following steps, once they are done I will explain what was accomplished.

Go into BNTableItem.h and DELETE EVERYTHING
Go into BNTableItem.m and DELETE EVERYTHING
We should now have NOTHING in either BNTableItem.h or BNTableItem.m

Now we need to subclass TTTableCaptionedItem because it’s quite similar to what we are trying to accomplish, but needs some enhancements. Copy and paste this code into the empty BNTableItem.h file:

#import "Three20/Three20.h"  

///////////////////////////////////////////////////////////////////////////////////////////////////  

////////////////////////////////////////////////////////
//////   BNTableCaptionedItemWithThreeImagesBelow  /////
////////////////////////////////////////////////////////

@interface BNTableCaptionedItemWithThreeImagesBelow : TTTableCaptionedItem { 

}  

@end

Now copy and paste this code into BNTableItem.m:

#import "BNTableItem.h"

///////////////////////////////////////////////////////////////////////////////////////////////////  

////////////////////////////////////////////////////////
//////   BNTableCaptionedItemWithThreeImagesBelow  /////
////////////////////////////////////////////////////////

@implementation BNTableCaptionedItemWithThreeImagesBelow

@end

We just created a subclass of TTTableCaptionedItem which we named BNTableCaptionedItemWithThreeImagesBelow.

But we haven’t changed anything in our class yet, let’s do that now:

Go back to BNTableItem.h and modify it so the file looks exactly like this:

#import "Three20/Three20.h"  

///////////////////////////////////////////////////////////////////////////////////////////////////  

////////////////////////////////////////////////////////
//////   BNTableCaptionedItemWithThreeImagesBelow  /////
////////////////////////////////////////////////////////

@interface BNTableCaptionedItemWithThreeImagesBelow : TTTableCaptionedItem {
	NSString* _image1;
	NSString* _image2;
	NSString* _image3;
	TTStyle* _imageStyle;
}

@property(nonatomic,copy) NSString* image1;
@property(nonatomic,copy) NSString* image2;
@property(nonatomic,copy) NSString* image3;
@property(nonatomic,retain) TTStyle* imageStyle;

+ (id)itemWithText:(NSString*)text caption:(NSString*)caption image1:(NSString*)image1 image2:(NSString*)image2 image3:(NSString*)image3;

@end

Go to back to BNTableItem.m and modify it so the file looks exactly like this:

#import "BNTableItem.h"

///////////////////////////////////////////////////////////////////////////////////////////////////  

////////////////////////////////////////////////////////
//////   BNTableCaptionedItemWithThreeImagesBelow  /////
////////////////////////////////////////////////////////

@implementation BNTableCaptionedItemWithThreeImagesBelow
@synthesize image1 = _image1, image2 = _image2, image3 = _image3, imageStyle = _imageStyle;

///////////////////////////////////////////////////////////////////////////////////////////////////
// class public

+ (id)itemWithText:(NSString*)text caption:(NSString*)caption image1:(NSString*)image1 image2:(NSString*)image2 image3:(NSString*)image3 {
		BNTableCaptionedItemWithThreeImagesBelow* item = [[[self alloc] init] autorelease];
		item.text = text;
		item.caption = caption;
		item.image1 = image1;
		item.image2 = image2;
		item.image3 = image3;
		return item;
	}

///////////////////////////////////////////////////////////////////////////////////////////////////
// NSObject

- (id)init {
	if (self = [super init]) {
		_image1 = nil;
		_image2 = nil;
		_image3 = nil;
		_imageStyle = nil;
	}
	return self;
}

- (void)dealloc {
	TT_RELEASE_MEMBER(_image1);
	TT_RELEASE_MEMBER(_image2);
	TT_RELEASE_MEMBER(_image3);
	TT_RELEASE_MEMBER(_imageStyle);
	[super dealloc];
}

///////////////////////////////////////////////////////////////////////////////////////////////////
// NSCoding

- (id)initWithCoder:(NSCoder*)decoder {
	if (self = [super initWithCoder:decoder]) {
		self.image1 = [decoder decodeObjectForKey:@"image1"];
		self.image2 = [decoder decodeObjectForKey:@"image2"];
		self.image3 = [decoder decodeObjectForKey:@"image3"];
	}
	return self;
}

- (void)encodeWithCoder:(NSCoder*)encoder {
	[super encodeWithCoder:encoder];
	if (self.image1) {
		[encoder encodeObject:self.image1 forKey:@"image1"];
	}
	if (self.image2) {
		[encoder encodeObject:self.image2 forKey:@"image2"];
	}
	if (self.image3) {
		[encoder encodeObject:self.image3 forKey:@"image3"];
	}
}

@end

Finished that? Good. I am not going to explain everything that we did there, but I will give an overview.

We added 3 new properties to our class (one for each image)
We made a method called + (id)itemWithText:(NSString*)text caption:(NSString*)caption image1:(NSString*)image1 image2:(NSString*)image2 image3:) which accepts the addresses for each of the 3 images as well as our text content
We added the 3 image properties to the init method, the initWithCoder method, and encodeWithCoder method.

The BNTableItem part of this tutorial is now finished.

The next part of our tutorial deals with displaying the data from our TableItem (the labels, images, etc), lets get started

4. Subclass TTTableItemCell

Subclassing TTTableCaptionedItemCell (itself a subclass of TTTableItemCell) will be similar to the subclassing we just did of TTTableCaptionedItem.

Go into BNTableItemCell.h and DELETE EVERYTHING
Go into BNTableItemCell.m and DELETE EVERYTHING
We should now have NOTHING in either BNTableItemCell.h or BNTableItemCell.m

Now subclass TTTableCaptionedItemCell. Go into and BNTableItemCell.h and make it look like this:

#import "Three20/Three20.h"

///////////////////////////////////////////////////////////////////////////////////////////////////

////////////////////////////////////////////////////////////
//////   BNTableCaptionedItemWithThreeImagesBelowCell     //
////////////////////////////////////////////////////////////

@interface BNTableCaptionedItemWithThreeImagesBelowCell : TTTableCaptionedItemCell {
  TTImageView* _imageView1;
  TTImageView* _imageView2;
  TTImageView* _imageView3;
}

@end

Then go into BNTableItemCell.m and make it look like this:

#import "BNTableItemCell.h"
#import "BNTableItem.h"
#import "BNDefaultStylesheet.h"

///////////////////////////////////////////////////////////////////////////////////////////////////

static CGFloat kHPadding = 10;
static CGFloat kVPadding = 15;
static CGFloat kImageWidth = 80;
static CGFloat kImageHeight = 80;

///////////////////////////////////////////////////////////////////////////////////////////////////

//////////////////////////////////////////////////////////////
//////   BNTableCaptionedItemWithThreeImagesBelowCell     ////
//////////////////////////////////////////////////////////////

@implementation BNTableCaptionedItemWithThreeImagesBelowCell

+ (CGFloat)tableView:(UITableView*)tableView rowHeightForItem:(id)item {
	BNTableCaptionedItemWithThreeImagesBelow* captionedItem = item;

	CGFloat maxWidth = tableView.width - kHPadding*2;

	CGSize textSize = [captionedItem.text sizeWithFont:TTSTYLEVAR(myHeadingFont)
					   constrainedToSize:CGSizeMake(maxWidth, CGFLOAT_MAX)
					   lineBreakMode:UILineBreakModeWordWrap];
	CGSize subtextSize = [captionedItem.caption sizeWithFont:TTSTYLEVAR(mySubtextFont)
						  constrainedToSize:CGSizeMake(maxWidth, CGFLOAT_MAX) lineBreakMode:UILineBreakModeWordWrap];

	return kVPadding*2 + textSize.height + subtextSize.height + kImageHeight + kVPadding;
}

///////////////////////////////////////////////////////////////////////////////////////////////////

- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString*)identifier {
	if (self = [super initWithStyle:UITableViewCellStyleValue2 reuseIdentifier:identifier]) {
		_item = nil;

		_imageView1 = [[TTImageView alloc] initWithFrame:CGRectZero];
		[self.contentView addSubview:_imageView1];

		_imageView2 = [[TTImageView alloc] initWithFrame:CGRectZero];
		[self.contentView addSubview:_imageView2];

		_imageView3 = [[TTImageView alloc] initWithFrame:CGRectZero];
		[self.contentView addSubview:_imageView3];

	}
	return self;
}

- (void)dealloc {
	TT_RELEASE_MEMBER(_imageView1);
	TT_RELEASE_MEMBER(_imageView2);
	TT_RELEASE_MEMBER(_imageView3);
	[super dealloc];
}
///////////////////////////////////////////////////////////////////////////////////////////////////
// UIView

- (void)layoutSubviews {
	[super layoutSubviews];

	[self.detailTextLabel sizeToFit];
	self.detailTextLabel.top = kVPadding;

	self.textLabel.height = self.detailTextLabel.height;

	_imageView1.frame = CGRectMake(20, self.detailTextLabel.bottom + kVPadding, kImageWidth, kImageHeight);
	_imageView2.frame = CGRectMake(_imageView1.right + kHPadding, self.detailTextLabel.bottom + kVPadding, kImageWidth, kImageHeight);
	_imageView3.frame = CGRectMake(_imageView2.right + kHPadding, self.detailTextLabel.bottom + kVPadding, kImageWidth, kImageHeight);

}

///////////////////////////////////////////////////////////////////////////////////////////////////
// TTTableViewCell

- (id)object {
	return _item;
}

- (void)setObject:(id)object {
	if (_item != object) {
		[super setObject:object];

		BNTableCaptionedItemWithThreeImagesBelow* item = object;

		self.textLabel.textColor = TTSTYLEVAR(myHeadingColor);
		self.textLabel.font = TTSTYLEVAR(myHeadingFont);
		self.textLabel.textAlignment = UITextAlignmentRight;
		self.textLabel.contentMode = UIViewContentModeCenter;
		self.textLabel.lineBreakMode = UILineBreakModeWordWrap;
		self.textLabel.numberOfLines = 0;

		self.detailTextLabel.textColor = TTSTYLEVAR(mySubtextColor);
		self.detailTextLabel.font = TTSTYLEVAR(mySubtextFont);
		self.detailTextLabel.textAlignment = UITextAlignmentLeft;
		self.detailTextLabel.contentMode = UIViewContentModeTop;
		self.detailTextLabel.lineBreakMode = UILineBreakModeWordWrap;

		_imageView1.URL = item.image1;
		_imageView1.style = item.imageStyle;

		_imageView2.URL = item.image2;
		_imageView2.style = item.imageStyle;

		_imageView3.URL = item.image3;
		_imageView3.style = item.imageStyle;

    }
}

@end

Woooo we’re on a roll, we just subclassed TTTableCaptionedItemCell, then modified it so that it has 3 image views underneath the heading and caption.

In the rowHeightForItem method we made our cell adjust it’s size to the text content AND our new images.
In the initWithStyle method we allocated 3 TTImageViews (to hold our images) and added the TTImageViews as subviews of our main view.
in the layoutSubviews method we made the textLabel (the heading label) and the detailTextLabel (the subtext label) fit together nicely, as well as sizing all three images and making them fit nice and centered underneath the text.
Finally in the setObject method we set the textColor, the font, and a few other important properties of our textLabel, and detailTextLabel, and we gave each of our 3 TTImageViews the URL of the image their supposed to display (the URL of each TTImageView should match the corresponding URL given for each address we are fed to our TTTableItem).

Now we need to put our feed our TableItems to our TableView datasource

5. Add Our TableItems to the DataSource

Now what we’re going to do is instantiate and feed BNTableCaptionedItemWithThreeImagesBelow into our DataSource a few times while feeding it some text content and image addresses.

To instantiate and feed our Tableitem into our datasource (twice), make RootViewDataSource.m look exactly like this:

#import "RootViewDataSource.h"
#import "BNTableItem.h"
#import "BNTableItemCell.h"

@implementation RootViewDataSource

///////////////////////////////////////////////////////////////////////////////////////////////////
// public

+ (RootViewDataSource*)rootViewDataSource {
	RootViewDataSource* dataSource =  [[[RootViewDataSource alloc] initWithItems:
										[NSMutableArray arrayWithObjects: [BNTableCaptionedItemWithThreeImagesBelow itemWithText:@"These are some pictures of me (Matt) doing different stuff"
																									caption:@"Matt"
																									image1:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/boating.jpg"
																									image2:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/cooking.jpg"
																									image3:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/surfing.jpg"],
																		 [BNTableCaptionedItemWithThreeImagesBelow itemWithText:@"These are some pictures of Vancouver, BC"
																									caption:@"VanCity"
																									image1:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/Vancouver_Aerial.jpg"
																									image2:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/Coast-Mountains-BC.jpg"
																									image3:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/Vancouver_Aerial_2.jpg"],
																		 nil]] autorelease];
	return dataSource;
}

///////////////////////////////////////////////////////////////////////////////////////////////////

- (void)dealloc {
	[super dealloc];
}

///////////////////////////////////////////////////////////////////////////////////////////////////
// TTTableViewDataSource

- (Class)tableView:(UITableView*)tableView cellClassForObject:(id) object { 

	if ([object isKindOfClass:[BNTableCaptionedItemWithThreeImagesBelow class]]) {
		return [BNTableCaptionedItemWithThreeImagesBelowCell class];
	} else {
		return [super tableView:tableView cellClassForObject:object];
	}
}

- (void)tableView:(UITableView*)tableView prepareCell:(UITableViewCell*)cell
forRowAtIndexPath:(NSIndexPath*)indexPath {
	cell.accessoryType = UITableViewCellAccessoryNone;
}

@end

Now try launching the App again.

Looks kinda weird doesn’t it? That’s because we need to do one last thing which is to tell our App which kind of TableItemCell to render for our TableItems.

Right now the App is just rendering the closest matching TableItemCell it could find, but not the one that we want (which is the one we just created).

6. Render the correct TableItemCell for our TableItems

This part is very simple, and I probably could have combined it with the last step, but it is something that is quite vital and I think deserves its own step.

Add the following code to RootViewDataSource.m, underneath the rootViewDataSource, and dealloc methods:

///////////////////////////////////////////////////////////////////////////////////////////////////
// TTTableViewDataSource

- (Class)tableView:(UITableView*)tableView cellClassForObject:(id) object { 

	if ([object isKindOfClass:[BNTableCaptionedItemWithThreeImagesBelow class]]) {
		return [BNTableCaptionedItemWithThreeImagesBelowCell class];
	} else {
		return [super tableView:tableView cellClassForObject:object];
	}
}

Now RootViewDataSource.m should look exactly like this:

#import "RootViewDataSource.h"
#import "BNTableItem.h"
#import "BNTableItemCell.h"

@implementation RootViewDataSource

///////////////////////////////////////////////////////////////////////////////////////////////////
// public

+ (RootViewDataSource*)rootViewDataSource {
	RootViewDataSource* dataSource =  [[[RootViewDataSource alloc] initWithItems:
										[NSMutableArray arrayWithObjects: [[BNTableCaptionedItemWithThreeImagesBelow itemWithText:@"These are some pictures of me (Matt) doing different stuff"
																									caption:@"Matt"
																									image1:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/boating.jpg"
																									image2:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/cooking.jpg"
																									image3:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/surfing.jpg"] autorelease],
																		 [[BNTableCaptionedItemWithThreeImagesBelow itemWithText:@"These are some pictures of Vancouver, BC"
																									caption:@"VanCity"
																									image1:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/Vancouver_Aerial.jpg"
																									image2:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/Coast-Mountains-BC.jpg"
																									image3:@"http://mattvague.com/wordpress/wp-content/uploads/2009/08/Vancouver_Aerial_2.jpg"] autorelease]
																			,nil]] autorelease];
	return dataSource;
}

///////////////////////////////////////////////////////////////////////////////////////////////////

- (void)dealloc {
	[super dealloc];
}

///////////////////////////////////////////////////////////////////////////////////////////////////
// TTTableViewDataSource

- (Class)tableView:(UITableView*)tableView cellClassForObject:(id) object { 

	if ([object isKindOfClass:[BNTableCaptionedItemWithThreeImagesBelow class]]) {
		return [BNTableCaptionedItemWithThreeImagesBelowCell class];
	} else {
		return [super tableView:tableView cellClassForObject:object];
	}
}

- (void)tableView:(UITableView*)tableView prepareCell:(UITableViewCell*)cell
forRowAtIndexPath:(NSIndexPath*)indexPath {
	cell.accessoryType = UITableViewCellAccessoryNone;
}

@end

Done yet? Hope so, cause that’s the last step!

7. Run the App

Run our App by clicking on “Build and Go”

It should look like this:

Wrap Up / Download the working version

If you are still having trouble or just want to checkout the source code, the final working version of my tutorial is availbile on github as part of my three20 tutorial repository. Download or clone my repo and then open the tableitem-tutorial folder and open its Xcode Project.

If you have any questions please ask. The best way is to leave a comment below.

Thanks!

AppleTV Sucks, but doesn’t have to

MattV — Fri, 21 Aug 2009 07:50:18 +0000

Dear Steve:

People still like instant gratification, that’s why Apple TV sucks.

AppleTV SUCKS because it lacks live broadcast TV.

Broadcast TV provides instant gratification. We turn it on, and get entertained NOW

iTunes (as-is) doesn’t always provide instant gratification. Looking for a show, deciding whether to pay for it, then waiting for it download takes tiiime. We turn it on, and get entertained THEN (as in the future)

It’s simple. When we want to zone out, when we wanna flick on the boob-tube and stop thinking we watch TV because it’s dumb and instant. We (the people) are happy when we’re dumb and gratified.

If Apple thought that people would switch totally to downloading TV shows and movies all the time from iTunes instead of watching Cable or Satellite TV they underestimated how lazy we are. But I think Apple may now have gotten their heads out of their asses in this respect.

I believe Apple now realizes that they could probably put a kick ass new spin on current broadcast TV. Providing the ability to watch and record live TV, watch your already downloaded TV shows and movies, AND download and rent even more from one single system just makes sense.

If these rumours are true, than AppleTV gets the Matt Stamp of Approval. YEEEEEE HAW. http://www.macrumors.com/2009/08/20/apple-tv-set-by-2011/

The great divide: marketers & designers

admin — Sun, 19 Jul 2009 00:49:15 +0000

In the words of my old boss “marketers and designers speak a different language”

This never really made sense to me until I took on a recent contract.

I developed a site for a company and when the site was reviewed by the marketing people every single comment made was that THEIR logo was to small, that THEIR brand should be promoted more, that the point of the site was to increase THEIR brand awareness.

On the other hand, when designers reviewed the site I heard things like “that font is unreadable”, “that wording might confuse PEOPLE”, and “PEOPLE wont notice that button”.

My point is: We all want to make money and get our names out there. The difference being that a marketer’s strategy is to sell their product because everyone has heard of their product (whether it’s good or bad), while a designer’s strategy is to sell their product because the product is actually appealing, and is actually useful, which should lead all the happy customers to tell their friends about your product so that you don’t have to.

A Marketer’s bottom line is: CONVINCE THEM.

A Designer’s bottom line is MAKE IT APPEALING, MAKE IT USEFUL.

Obviously myself being a designer, I am in favor of that latter approach to making the ching-ching, the $$$, the scrilla, the moolah.

Luckily I think we’re already in a paradigm shift towards more people adopting the latter way of thinking. This will lead to better products, that people are ACTUALLY HAPPY WITH.

Woot. Enough said.

Summer Sessions with Sarah McLachlan, Neil Young, and Sheryl Crow in West Vancouver

admin — Wed, 15 Jul 2009 17:37:39 +0000

UPDATE: Tickets are sold out for Summer Sessions 2009 but I will make sure to write a new post if any more tickets become available, check back for updates!

I think the names say it all, this is going to be one WICKED conert. Sarah McLachlan, Neil Young, and Sheryl Crow are coming to rock out Summer Sessions at West Vancouver’s Ambleside Park on September 12th 2009.

If you’re interested in learning about the concert check out summersessions.ca for more information.

Anyways hope I see ya’ll at the concert, keep on rockin’!

Stop putting up with Data Abuse!

admin — Fri, 10 Jul 2009 00:17:59 +0000

“iPhone Carriers charge outrageous amounts for iPhone data plans, then tell us how we can and can’t use the data we paid for. We call this Data Abuse. Stop putting up with the it and take action on dataabuse.com!”

My friend / associate Erico and I finally got fed up with the way we (and everyone else) are treated by iPhone carriers and we decided to do something about it. We built a site dealing with “Data Abuse” which explains what Data Abuse is, some real life examples of it, and what people can do about it.

Sarah Palin: Social Media Wanker

admin — Sun, 05 Jul 2009 02:35:23 +0000

Sarah Palin is now using social media EXCLUSIVLY to reach her followers. She’s cutting the mainstream media out. – http://mashable.com/2009/07/04/sarah -palin -facebook /

I can come to only one conclusion:

Sarah Palin is a Social Media Wanker.

She thinks we’re gonna take it easy on her. She thinks that we’re not going to be on her ass every time she makes a mockery of herself and the United States political system with her idiocy, ignorance, and hypocrisy.

Folks, we’ve been given the opportunity to deliver the knockout blow to Sarah Palin: the politician, that time and again has shown that can’t speak for herself let alone speak for the most powerful country on earth. Let’s use the Social Media to bring her out into the open and show her a real town hall meeting where real questions are asked, with real followup questions.

And maybe I am just crazy, but I also question the political wisdom of cutting out the regular media outlets (Palin being who she is).

This is of course pure opinion, but I’m preeetty sure that the vast majority of people who would consider voting for Sarah Palin’s don’t use Facebook let alone Twitter.

Nope if I were her I’d stick with the Fox News world where apparently “Sarah Palin Outsmarts the Left“.

I for one can’t wait to see how this all plays out.

An iPhone App for making iPhone Apps

admin — Sun, 05 Jul 2009 00:11:06 +0000

Cool! This hombre named klazuka built an iPhone App for creating an iPhone App. Now THIS GUY is forward thinking.

Basically klazuka’s TTStyleBuilder lets you interactively create styles for your Three20 based iPhone Apps.

Haven’t had time to play around with it yet, due to writing tutorials on this very subject (Three20), but I hope to be able to check it out ASAP.

Check back soon to hear about my experience with it and maaaaybe even a short tutorial (if needs be).

Anyways here’s a video that shows TTStylebuilder in action:

TTStyleBuilder from Keith Lazuka on Vimeo.

Favorite Feeds: Week of June 26th

admin — Wed, 01 Jul 2009 07:51:02 +0000

Some favorites for the week of June 26st:

(no particular order)

The Young Turks: The Young Turks YouTube Channel
Dwight (from the TV Show The Office): Dwight’s Blog
The Huffington Post: Most Popular Entries
ReadWriteWeb: ReadWriteWeb Feed
ScrnShots.com: Recent Screenshots

Three20 Custom Cells iPhone Tutorial

admin — Thu, 25 Jun 2009 05:26:25 +0000

*Note* This tutorial is now deprecated, please refer to my new TableItem tutorial for future learnin’s

Introduction to custom three20 cells

In my last tutorial I showed you how to use CSS-like stylesheets in your iPhone Apps. Although I did make a custom cell I didn’t really show how this is done, and I’ve decided to go into a bit more detail.

In this tutorial I am going to show you how to make custom table cells in your iPhone Apps using Joe Hewitt’s Three20 library.

Custom cells are very useful, they let you do things like this:

But it’s worth mentioning that i’m not going show you how to make a complete iPhone App, nor install the Three20 library in your Apps (there is already a guide on how to do this on the three20 github page).

I am going to assume that you either cloned my three20 tutorial repository from github and are following along in my Three20 stylesheets tutorial, or that you already have an app using three20 with a working tableview and datasource similar to mine (there are several ways to do this, but I am going to assume you’re using my way).

By the way, all my Three20 tutorials are available on gitHub.

So lets get started:

First things first, There are cells, and there are fields.

Cells control the labels, images, interface elements, etc that are actually displayed when a table cell is rendered.
Fields control the actual data that is fed into each label, image, interface element, etc when the table cell is rendered.

But although they usually go together, you don’t always HAVE to make a new field type for every new cell type. As long as all the data that the new cell needs is provided by an existing field, you need not make another.

For cells like the one below with a title and subtext, the data is fed by a field which holds 2 strings: one for the title and one for the subtext.

The code that styles the above cell (BNSubtextTableFieldCell) looks like this:

And the field that feeds that cell looks like this (in the Three20 source code):

JUST changing a cell’s appearance.

To change the colors, font sizes, etc in a particular cell, all you need to do is subclass that cell (in this case BNSubtextTableFieldCell), and change it’s label’s properties.

To subclass BNSubtextTableFieldCell, make BNCell.h looks like this:

#import "Three20/Three20.h"

///////////////////////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////
//////   BNSubtextTableFieldCell     ////
/////////////////////////////////////////

@interface BNSubtextTableFieldCell : TTSubtextTableFieldCell {

}

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////////////////
//////   BNSubtextWithRedTitleTableFieldCell     ////
/////////////////////////////////////////////////////

@interface BNSubtextWithRedTitleTableFieldCell : BNSubtextTableFieldCell {

}

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

Then make BNCell.m look like this:

#import "BNCell.h"
#import "BNDefaultStylesheet.h"

///////////////////////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////
//////   BNSubtextTableFieldCell     ////
/////////////////////////////////////////

@implementation BNSubtextTableFieldCell

///////////////////////////////////////////////////////////////////////////////////////////////////

- (void)setObject:(id)object {
	if (_field != object) {
		[super setObject:object];

		TTSubtextTableField* field = object;

		_label.text = field.text;
		_label.font = TTSTYLEVAR(myFirstFont);
		_label.textColor = TTSTYLEVAR(myFirstColor);
		_label.adjustsFontSizeToFitWidth = YES;

		_subtextLabel.text = field.subtext;
		_subtextLabel.font = TTSTYLEVAR(mySecondFont);
		_subtextLabel.textColor = TTSTYLEVAR(mySecondColor);
	}
}

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////////////////
//////   BNSubtextWithRedTitleTableFieldCell     ////
/////////////////////////////////////////////////////

@implementation BNSubtextWithRedTitleTableFieldCell

///////////////////////////////////////////////////////////////////////////////////////////////////

- (void)setObject:(id)object {
	if (_field != object) {
		[super setObject:object];

		_label.textColor = [UIColor redColor];
	}
}

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

All we did there was change the textColor property of the cell’s _label to an ugly ass red color.

Next we change the cellForClassObject method in RootViewDataSource.m to point to your new BNSubtextWithRedTitleTableFieldCell cell type.

Make the RootViewDataSource.m look like this:

#import "RootViewDataSource.h"
#import "BNCell.h"

@implementation RootViewDataSource

///////////////////////////////////////////////////////////////////////////////////////////////////
// public

+ (RootViewDataSource*)rootViewDataSource {
	RootViewDataSource* dataSource =  [[[RootViewDataSource alloc] initWithItems:
									 [NSMutableArray arrayWithObjects:
									 [[[TTSubtextTableField alloc] initWithText:@"Video" subtext:@"Now you can shoot video, edit it, and share it — all on your iPhone 3G S."] autorelease],
									 [[[TTSubtextTableField alloc] initWithText:@"3-Megapixel Camera" subtext:@"The new 3-megapixel camera takes great still photos, too, thanks to built-in autofocus."] autorelease],
									 [[[TTSubtextTableField alloc] initWithText:@"Search" subtext:@"Find what you’re looking for across your iPhone, all from one convenient place."] autorelease],
									 [[[TTSubtextTableField alloc] initWithText:@"Compass" subtext:@"With a built-in digital compass, iPhone 3G S can point the way."] autorelease],
									 [[[TTSubtextTableField alloc] initWithText:@"Cut, Copy & Paste" subtext:@"Cut, copy, and paste words and photos, even between applications."] autorelease],
									 nil]] autorelease];

	return dataSource;
}

///////////////////////////////////////////////////////////////////////////////////////////////////

- (void)dealloc {
	[super dealloc];
}

///////////////////////////////////////////////////////////////////////////////////////////////////
// TTTableViewDataSource

- (Class)tableView:(UITableView*)tableView cellClassForObject:(id) object { 

	if ([object isKindOfClass:[TTSubtextTableField class]]) {
		return [BNSubtextWithRedTitleTableFieldCell class];
	} else {
		return [super tableView:tableView cellClassForObject:object];
	}
}

- (void)tableView:(UITableView*)tableView prepareCell:(UITableViewCell*)cell
forRowAtIndexPath:(NSIndexPath*)indexPath {
	cell.accessoryType = UITableViewCellAccessoryNone;
}

@end

You should end up with something like this when you run your app:

Changing a cell’s appearance AND data.

What if we want to add another piece of data to the cell like a URL? Right now the cell can only be fed a title, and subtext because that is all that the cell’s field contains (2 NSStrings).

What we have to do is subclass Three20’s existing TTSubtextTableField (which currently feeds both BNSubtextTableFieldCell and BNSubtextWithRedTitleTableFieldCell) to make a new field which will hold a new piece of data (a NSString for the URL we will add).

But before we make a new field, let’s make a new cell that subclasses our last cell with the addition of a new UILabel for the URL.

To make a new sub-classed cell, change BNCell.h to look like this:

#import "Three20/Three20.h"

///////////////////////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////
//////   BNSubtextTableFieldCell     ////
/////////////////////////////////////////
we
@interface BNSubtextTableFieldCell : TTSubtextTableFieldCell {

}

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////////////////
//////   BNSubtextWithRedTitleTableFieldCell     ////
/////////////////////////////////////////////////////

@interface BNSubtextWithRedTitleTableFieldCell : BNSubtextTableFieldCell {

}

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

///////////////////////////////////////////////////////////
//////   BNSubtextWithRedTitleAndURLTableFieldCell     ////
///////////////////////////////////////////////////////////

@interface BNSubtextWithRedTitleAndURLTableFieldCell : BNSubtextWithRedTitleTableFieldCell {
  UILabel* _featureURLLabel;
}

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

And change BNCell.m to look like this:

#import "BNCell.h"
#import "BNField.h"
#import "BNDefaultStylesheet.h"

///////////////////////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////
//////   BNSubtextTableFieldCell     ////
/////////////////////////////////////////

@implementation BNSubtextTableFieldCell

///////////////////////////////////////////////////////////////////////////////////////////////////

- (void)setObject:(id)object {
	if (_field != object) {
		[super setObject:object];

		TTSubtextTableField* field = object;

		_label.text = field.text;
		_label.font = TTSTYLEVAR(myFirstFont);
		_label.textColor = TTSTYLEVAR(myFirstColor);
		_label.adjustsFontSizeToFitWidth = YES;

		_subtextLabel.text = field.subtext;
		_subtextLabel.font = TTSTYLEVAR(mySecondFont);
		_subtextLabel.textColor = TTSTYLEVAR(mySecondColor);
	}
}

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////////////////
//////   BNSubtextWithRedTitleTableFieldCell     ////
////////////////////////////////////t/////////////////

@implementation BNSubtextWithRedTitleTableFieldCell

///////////////////////////////////////////////////////////////////////////////////////////////////

- (void)setObject:(id)object {
	if (_field != object) {
		[super setObject:object];

		_label.textColor = [UIColor redColor];
	}
}

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

///////////////////////////////////////////////////////////
//////   BNSubtextWithRedTitleAndURLTableFieldCell     ////
////////////////////////////////////t//////////////////////

@implementation BNSubtextWithRedTitleAndURLTableFieldCell

///////////////////////////////////////////////////////////////////////////////////////////////////

+ (CGFloat)tableView:(UITableView*)tableView rowHeightForItem:(id)item {
	CGFloat maxWidth = tableView.width - 20;
	BNSubtextWithRedTitleAndURLTableField* field = item;

	CGSize textSize = [field.text sizeWithFont:TTSTYLEVAR(tableSmallFont)
					   constrainedToSize:CGSizeMake(maxWidth, CGFLOAT_MAX)
					   lineBreakMode:UILineBreakModeWordWrap];
	CGSize subtextSize = [field.subtext sizeWithFont:TTSTYLEVAR(font)
						  constrainedToSize:CGSizeMake(maxWidth, CGFLOAT_MAX) lineBreakMode:UILineBreakModeWordWrap];
	CGSize featureURLSize = [field.featureURL sizeWithFont:[UIFont systemFontOfSize:12]
						  constrainedToSize:CGSizeMake(maxWidth, CGFLOAT_MAX) lineBreakMode:UILineBreakModeWordWrap];

	return 20 + textSize.height + subtextSize.height + featureURLSize.height;
}

///////////////////////////////////////////////////////////////////////////////////////////////////

- (id)initWithFrame:(CGRect)frame reuseIdentifier:(NSString*)identifier {
	if (self = [super initWithFrame:frame reuseIdentifier:identifier]) {
		_featureURLLabel = [[UILabel alloc] initWithFrame:CGRectZero];
		_featureURLLabel.font = [UIFont systemFontOfSize:11];
		_featureURLLabel.textColor = [UIColor grayColor];
		_featureURLLabel.backgroundColor = [UIColor clearColor];
		_featureURLLabel.highlightedTextColor = TTSTYLEVAR(highlightedTextColor);
		_featureURLLabel.textAlignment = UITextAlignmentLeft;
		_featureURLLabel.contentMode = UIViewContentModeTop;
		_featureURLLabel.lineBreakMode = UILineBreakModeWordWrap;
		_featureURLLabel.numberOfLines = 0;
		[self.contentView addSubview:_featureURLLabel];
	}
	return self;
}

- (void)dealloc {
	[_featureURLLabel release];
	[super dealloc];
}

///////////////////////////////////////////////////////////////////////////////////////////////////
// UIView

- (void)layoutSubviews {
	[super layoutSubviews];
	CGFloat maxWidth = self.contentView.width - 20;
	CGSize featureURLSize = [_featureURLLabel.text sizeWithFont:_featureURLLabel.font
						  constrainedToSize:CGSizeMake(maxWidth, CGFLOAT_MAX) lineBreakMode:_featureURLLabel.lineBreakMode];
	_featureURLLabel.frame = CGRectMake(10, _subtextLabel.bottom + 5, featureURLSize.width, featureURLSize.height);
}

///////////////////////////////////////////////////////////////////////////////////////////////////
// TTTableViewCell

- (void)setObject:(id)object {
	if (_field != object) {
		[super setObject:object];

		BNSubtextWithRedTitleAndURLTableField* field = object;

		_featureURLLabel.text = field.featureURL;
	}
}

@end

Then we need to feed data into this new cell by sub-classing TTSubtextTableField.

Make a new file called BNField.m (check YES to “Also create BNField.h”).

Then make your new BNField.h file look like this:

#import "Three20/Three20.h"

///////////////////////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////////////////
//////   BNSubtextWithRedTitleAndURLTableField  /////
/////////////////////////////////////////////////////

@interface BNSubtextWithRedTitleAndURLTableField : TTSubtextTableField {
	NSString *_featureURL;
}
@property(nonatomic, retain) NSString *featureURL;
- (id)initWithText:(NSString*)text subtext:(NSString*)subtext featureURL:(NSString*)featureURL;

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

And make your BNField.m file look like this:

#import "BNField.h"
#import "BNCell.h"

///////////////////////////////////////////////////////////////////////////////////////////////////

////////////////////////////////////////////////////////
//////   BNSubtextWithRedTitleAndURLTableField     /////
////////////////////////////////////////////////////////

@implementation BNSubtextWithRedTitleAndURLTableField

@synthesize featureURL = _featureURL;

- (id)init {
	if (self = [super init]) {
		_featureURL = nil;
	}
	return self;
}

- (id)initWithText:(NSString*)text subtext:(NSString*)subtext featureURL:(NSString*)featureURL {
	if (self = [super initWithText:text subtext:subtext]) {
		self.featureURL = featureURL;
	}
	return self;
}

- (void)dealloc {
	[_featureURL release];
	[super dealloc];
}

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

Then we have to make some changes to RootViewDataSource.m
We will:

Include BNField.h
Change our datasource method calls from TTSubtextTableField to BNSubtextWithRedTitleAndURLTableField and pass a URL to this new field
Change the cellClassForObject method to look for our new cell type (I should note that we have to change the IF statement so that our newest class is on top otherwise it won’t be found).

Make your RootViewDataSource.m look like this:

#import "RootViewDataSource.h"
#import "BNCell.h"
#import "BNField.h"

@implementation RootViewDataSource

///////////////////////////////////////////////////////////////////////////////////////////////////
// public

+ (RootViewDataSource*)rootViewDataSource {
	RootViewDataSource* dataSource =  [[[RootViewDataSource alloc] initWithItems:
									 [NSMutableArray arrayWithObjects:
									 [[[BNSubtextWithRedTitleAndURLTableField alloc] initWithText:@"Video" subtext:@"Now you can shoot video, edit it, and share it — all on your iPhone 3G S." featureURL:@"http://www.apple.com/iphone/iphone-3gs/video-recording.html"] autorelease],
									 [[[BNSubtextWithRedTitleAndURLTableField alloc] initWithText:@"3-Megapixel Camera" subtext:@"The new 3-megapixel camera takes great still photos, too, thanks to built-in autofocus." featureURL:@"http://www.apple.com/iphone/iphone-3gs/photos.html"] autorelease],
									 [[[BNSubtextWithRedTitleAndURLTableField alloc] initWithText:@"Search" subtext:@"Find what you’re looking for across your iPhone, all from one convenient place." featureURL:@"http://www.apple.com/iphone/iphone-3gs/search.html"] autorelease],
									 [[[BNSubtextWithRedTitleAndURLTableField alloc] initWithText:@"Compass" subtext:@"With a built-in digital compass, iPhone 3G S can point the way." featureURL:@"http://www.apple.com/iphone/iphone-3gs/maps-compass.html"] autorelease],
									 [[[BNSubtextWithRedTitleAndURLTableField alloc] initWithText:@"Cut, Copy & Paste" subtext:@"Cut, copy, and paste words and photos, even between applications." featureURL:@"http://www.apple.com/iphone/iphone-3gs/cut-copy-paste.html"] autorelease],
									 nil]] autorelease];

	return dataSource;
}

///////////////////////////////////////////////////////////////////////////////////////////////////

- (void)dealloc {
	[super dealloc];
}

///////////////////////////////////////////////////////////////////////////////////////////////////
// TTTableViewDataSource

- (Class)tableView:(UITableView*)tableView cellClassForObject:(id) object { 

	if ([object isKindOfClass:[BNSubtextWithRedTitleAndURLTableField class]]) {
		return [BNSubtextWithRedTitleAndURLTableFieldCell class];
	} else if ([object isKindOfClass:[TTSubtextTableField class]]) {
		return [BNSubtextWithRedTitleTableFieldCell class];
	} else {
		return [super tableView:tableView cellClassForObject:object];
	}
}

- (void)tableView:(UITableView*)tableView prepareCell:(UITableViewCell*)cell
forRowAtIndexPath:(NSIndexPath*)indexPath {
	cell.accessoryType = UITableViewCellAccessoryNone;
}

@end

Once you’re done changing RootViewDataSource.m……

Boom! Your app should look like this when launched:

The company you keep…

admin — Mon, 22 Jun 2009 22:45:51 +0000

Over the years I have met some damn interesting, and very talented people.

Here are some of their sites

Three20 Stylesheets iPhone Tutorial

admin — Sun, 14 Jun 2009 07:09:34 +0000

*Note* SOME of this tutorial is now deprecated. I will be updating this tutorial soon, but until then please refer to my new TableItem tutorial for Step 4 of this tutorial.

Introduction to Three20 Stylesheets

In this tutorial, I am going to show you how to use CSS like stylesheets in your iPhone Apps.

If (like me) you’re coming to the iPhone platform from a Web Design perspective, you should be very familiar with CSS and external stylesheets. Unfortunately right now, there is no built-in equivalent to CSS for building iPhone apps.

Lucky for us Joe Hewitt has created a way with his Three20 iPhone Library. With Three20, you can easily change something like this:

To something like this:

Using this stylesheet:

Although I am going to show you some cool features of Three20, I’m NOT going to show you how to install Three20 in your Apps, nor build a complete App with Three20. Nope, today I’m only going to show you how to use Three20’s stylesheet capabilities.

I’m assuming a basic knowledge of Three20 and an intermediate knowledge of Cocoa and iPhone Dev. I’m also assuming you already have a UILabel or something to that you want to change the font of.

If you want to get your hands dirty, there is a sample app using this same code on my GitHub Three20 tutorial repository.

Let’s start the show

First things first, create your stylesheet.

Create a new blank file. Do this by going File >> New File, then clicking NSObject Subclass. Name the file “BNDefaultStylesheet” (i like sticking to Three20’s naming conventions by replacing the abbreviation TT with the abbreviation BN for “Basic Navigation”).

Copy the following code into BNDefaultStylesheet.h:

#import "Three20/TTStyleSheet.h"
#import "Three20/TTDefaultStyleSheet.h"

@interface BNDefaultStyleSheet : TTDefaultStyleSheet

@end

Then copy the following into BNDefaultStylesheet.m:

#import "BNDefaultStyleSheet.h"
#import "Three20/TTStyle.h"
#import "Three20/TTShape.h"
#import "Three20/TTURLCache.h"

///////////////////////////////////////////////////////////////////////////////////////////////////

@implementation BNDefaultStyleSheet

@end

Register the new stylesheet into the app delegate.

Do this by making BasicNavigationAppDelegate.m look like this:

#import "BasicNavigationAppAppDelegate.h"
#import "RootViewController.h"
#import "Three20/Three20.h"
#import "BNDefaultStyleSheet.h"

@implementation BasicNavigationAppAppDelegate

@synthesize window;
@synthesize navigationController;

#pragma mark -
#pragma mark Application lifecycle

- (void)applicationDidFinishLaunching:(UIApplication *)application {    

    // Override point for customization after app launch 

	[TTStyleSheet setGlobalStyleSheet:[[[BNDefaultStyleSheet alloc]
										init] autorelease]];

	[window addSubview:[navigationController view]];
    [window makeKeyAndVisible];
}

- (void)applicationWillTerminate:(UIApplication *)application {
	// Save data if appropriate
}

#pragma mark -
#pragma mark Memory management

- (void)dealloc {
	[navigationController release];
	[window release];
	[super dealloc];
}

@end

Make your first font style.

Add a new font style and color by making BNDefaultStylesheet.h look like this:

#import "Three20/TTStyleSheet.h"
#import "Three20/TTDefaultStyleSheet.h"

@interface BNDefaultStyleSheet : TTDefaultStyleSheet

@property(nonatomic,readonly) UIColor* myFirstColor;
@property(nonatomic,readonly) UIFont* myFirstFont;

@end

And making BNDefaultStylesheet.m look like this:

#import "BNDefaultStyleSheet.h"
#import "Three20/TTStyle.h"
#import "Three20/TTShape.h"
#import "Three20/TTURLCache.h"

///////////////////////////////////////////////////////////////////////////////////////////////////

@implementation BNDefaultStyleSheet

///////////////////////////////////////////////////////////////////////////////////////////////////
// styles

///////////////////////////////////////////////////////////////////////////////////////////////////
// public colors

- (UIColor*)myFirstColor {
	return RGBCOLOR(80, 110, 140);
}

- (UIColor*)mySecondColor {
	return [UIColor grayColor];
}

///////////////////////////////////////////////////////////////////////////////////////////////////
// public fonts

- (UIFont*)myFirstFont {
	return [UIFont boldSystemFontOfSize:15];
}

- (UIFont*)mySecondFont {
	return [UIFont systemFontOfSize:14];
}

@end

Use your new style.

Change the font to point to the font style by making BNCell.m look like this:

#import "BNCell.h"
#import "BNDefaultStylesheet.h"

///////////////////////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////
//////   BNSubtextTableFieldCell     ////
/////////////////////////////////////////

@implementation BNSubtextTableFieldCell

///////////////////////////////////////////////////////////////////////////////////////////////////

- (void)setObject:(id)object {
	if (_field != object) {
		[super setObject:object];

		TTSubtextTableField* field = object;
		_label.text = field.text;
		_label.font = TTSTYLEVAR(myFirstFont);
		_label.textColor = TTSTYLEVAR(myFirstColor);
		_label.adjustsFontSizeToFitWidth = YES;

		_subtextLabel.text = field.subtext;
	}
}

@end

///////////////////////////////////////////////////////////////////////////////////////////////////

Voila! You should now have your first App using Three20 Stylesheets. Your App should now have blue labels instead of black ones like so:

I’ll be refining this tutorial in the future, but if you find any glaring omissions please point em out.

AND To people following my tutorials: … DON’T BE SO PROUD. Ask questions if you have em, I’m cool with helping you get this stuff working in your Apps.

iPhone Apps by color

admin — Sun, 07 Jun 2009 22:33:59 +0000

Check it out, I was bored on the bus one day and organized my Apps by color

Favorite Feeds: Week of June 1st

admin — Sat, 06 Jun 2009 04:08:22 +0000

Some favorites for the week of June 1st:

37Signals: Signal vs. Noise Blog
Appletell
Guy Kawasaki’s: How to Change the World Blog
Google: Official Blog
BBC News

Flash is dead!

admin — Sat, 06 Jun 2009 02:39:36 +0000

Is it just me… or is it sooooooo 2006 to use Flash?

This is 2009! Other than for video players, complex interfaces, crazy-complex animations, AND font replacement (thank you Jonathan), It’s possible avoid the pitfalls of Flash on most sites. Flash ain’t very search engine friendly, it’s needlessly complex, it’s slow loading, etc, etc.

You can do practically any kind of animation, effect, or interface element with the kick ass Javascript frameworks that are out there like:

script.aculo.us (http://script.aculo.us/)
Prototype (http://www.prototypejs.org/)
Moo Tools (http://www.mootools.net/)
jQuery (http://jquery.com/)

And even if you’re a Microsoft-nut you can use Silverlight (http://silverlight.net/) to do pretty much anything Flash can do, while keeping your site Googleable. But on the other hand you would have to use .net… ughh… not to mention Silverlight doesnt support H.264 video encoding … super ughh.

Maybe it IS just me… but when I see sites where Flash is used for things that could easily be done with Javascript like animated menus, simple image galleries, carousells, etc I can’t help but think that these folks are behind the times.

So in conclusion: Let go of your Flash happiness, and embrace La Revolution.