Tuesday, August 13, 2013

Images in MFMailComposer (Watermark Email Messages)

I needed to watermark the emails sent from our app with the company logo. To do this you first need to make an opaque version of the logo you are going to use in Photoshop. Using Base64 encoding you then put it in your html message with <img> tags.  Then position it behind your body html using css and z indexes. Because most all email clients no longer support Base64 you need to load the html you created into a hidden webview.  Create a UIimage from the webview. Turn the UIimage into an NSdata object using PNGRepresentation. Then write the PNG file to a temporary documents folder. Finally you need to add the file as an attachment to the email. I am going to walk you through the process step by step.

Base64 Encoding
  • Download Matt Gallagher's Library that allows Base64 encoding. Download from this http://projectswithlove.com/projects/NSData_Base64.zip
  • The only files you need in your project are the NSData+Base64.m and .h files.
  • Make sure you import the NSData+Base64.h file into the .m file where your email option is.

    #import "NSData+Base64.h"
  • Add this function to your .m
- (NSString *)stringBase64EncodedImage:(UIImage *)image {
    
    NSData *imgData = UIImagePNGRepresentation(image);
    
    NSString *dataString = [imgData base64EncodedString];
    
    return dataString;
    
}

  • This is the code to encode your picture in Base64. Add this into the ViewDidLoad.

UIImage *img = [UIImage imageNamed:@"yourpicture.png"];
NSString *dataString = [self stringBase64EncodedImage:img];
        

No comments:

Post a Comment