Available on Github: https://github.com/phildow/TCTweetComposeViewController

Twitter Integration is Great

Easy Twitter integration has been available on the iPhone since the release of iOS 5, when Apple added the Twitter framework to the SDK. The framework includes two classes, TWRequest and TWTweetComposeViewController, and builds on the Accounts framework which was also made available with that release.

The classes are straightforward and effective. They make it simple for developers to connect to the Twitter API without having to manage user credentials themselves. Twitter has provided example code to simply their usage even further.

The User Interface is Awful

Unfortunately, the User Interface for composing a tweet leaves something to be desired. Frankly, it is ugly. Here is the interface in action for composing a tweet and for selecting a Twitter account:

TweetComposer Editing MessageTweetComposer Selecting an Account


I don’t know what the designers were thinking. That tweet view is just awful. It suffers from a number of problems. Foremost, it is inconsistent with much of the rest of the iOS interface. Email composition, for example, available to developers by a built-in API as well, uses a simple, white view that fills the screen, with sections for recipient, subject and message separated by fine lines. Compare:

EmailComposer Write Message


With the Tweet composer we have a black background with the compositional area sort of floating above it. This physically disconnects it from the keyboard, which leaves a slight but disturbing semantic separation between the two interface elements. The black background is also ill-suited to the task. One of the few screens where you regularly encounter a black background like this is when you’re entering secure account information or when you’re presented with an error alert that dims the rest of the screen. The background here is inappropriate.

The compositional view also suffers from the worst excesses of recent trends in design. The writing area uses a gray gradient that adds no meaning to the presentation and does not enhance its aesthetic appeal; the character count and “Add location” text is overly embossed; and the use of the skeuomorphic paperclip to hold the attached photo is just tacky. Even the simple task of displaying an image lacks the kind of attention to detail we can normally expect from Apple. In this case I have attached a PNG to the tweet that uses transparency to round the corners. But the image is rendered on some kind of beveled button that is bordered and has a white background. The transparency is totally lost and the image ends up with a double border and looking grotesque.

We can do better.

Enter TCTweetComposeViewController

TWTweetComposeViewController is a replacement for the TWTweetComposeViewController. It provides nearly identical functionality with a more minimal interface that is in line with MFMailComposeViewController. In fact, the public API is identical, which means our custom class can be used as a drop in replacement with very little change to the original source code. Incorporating it involves changing this:

TWTweetComposeViewController *twitter = [[TWTweetComposeViewController alloc] init];
[twitter addImage:icon];
[twitter addURL:URL];
[twitter setInitialText:text];
twitter.completionHandler = ^(TWTweetComposeViewControllerResult result){
[self dismissModalViewControllerAnimated:YES];
};
[self presentModalViewController:twitter animated:YES];

To this:

TCTweetComposeViewController *twitter = [[TCTweetComposeViewController alloc] init];
[twitter addImage:icon];
[twitter addURL:URL];
[twitter setInitialText:text];
twitter.completionHandler = ^(TCTweetComposeViewControllerResult result){
[self dismissModalViewControllerAnimated:YES];
};
[self presentModalViewController:twitter animated:YES];

All we’ve done here is changed the class we’re using and the result type on the completion handler block. Effectively, this means replacing the TW prefix with TC.

Given that TCTweetComposeViewController is modeled after the email message composer, it looks exactly as you’d expect it to:

TCTweet Tweet ComposerTCTweet Account Picker


The class has the additional benefit of giving you the option to hide and show the image attachment and URLs you are pre-populating the tweet with. The built-in class, on the other hand, is inconsistent in this regard. It always shows the attached image, but it never shows the URLs.

Limitiations

Our replacement class has a couple of limitations:

  1. It is currently available only for the iPhone. Actually it might work on the iPad, but I have not tested it.
  2. It does not include the optional location data.
  3. You can only attach a single image at a time.
  4. It only supports Portrait orientation.

These limitations are temporary. The class fulfills an immediate need as it is, and it constitues a complete product at this point, so a release was appropriate. A bit more work ought to bring it completely up to speed with the class it is meant to replace.

License

TCTweetComposeViewController is available under a BSD style license:

Copyright (C) 2012 Philip Dow / Sprouted. All rights reserved.

Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:

Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.

Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.

Neither the name of the author nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.

THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS “AS IS” AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

Download the Source Code

Available on Github: https://github.com/phildow/TCTweetComposeViewController

Leave a Reply