iosthree20ttstyledtextlabel

Opening TTStyledLabel images in ImageViewer


Is there any way for me to make it so when a user clicks on an image that is in a TTStyledLabel it opens up in three20's image viewer?


Solution

  • Basically yes. Since TTStyledText can contain html tags you can harness the three20 navigation to you your advantage, all you have to do is wrap the img tag with a tag and set your own mapping for a controller that derives from three20's photo viewer.

    NSString* kText = @"This is a test of styled labels. <a href=\"yourapp://photo/http%3A%2F%2Fsomeserver.com%2Fsmiley.png\"><img src=\"http://someserver.com/smiley.png\"/</a>";
    TTStyledTextLabel* label1 = [[[TTStyledTextLabel alloc] init] autorelease];
    label1.text = [TTStyledText textFromXHTML:kText lineBreaks:YES URLs:YES];
    

    in your app delegate have a mapping for your controller like this:

    TTNavigator* navigator = [TTNavigator navigator];
    TTURLMap* map = navigator.URLMap;
    [map from:@"yourapp://photoViewer/(initWithPhotoUrl:)" toViewController:[TTWebController class]];
    

    the the photo view controller should have this init method:

    -(id)initWithPhotoUrl:(NSString*)photoURL {
        self = [self initWithNibName:nil bundle:nil];
        if (self) {
            NSString *unencodedURL = [photoURL gtm_stringByUnescapingFromURLArgument];//this is where you decode the string (notice we encode it in the html). Google toolbox has a nice category for Strings to encode and decode urls see: http://code.google.com/p/google-toolbox-for-mac/source/browse/trunk/Foundation/GTMNSString%2BURLArguments.h?r=373
        }
        return self;
    }
    

    Inside that initWithPhotoUrl: you need to create a photosource - please refer to the TTCatalog sample for a sample on how to create a MockPhotoSource.