Appcelerator Blog

The Leading Resource for All Things Mobile

Cross-Platform Social Network Sharing

19 Flares 19 Flares ×

Update : This module is also available as an Alloy Widget

One of the coolest things of building mobile apps is the capability of sharing text and images with social networks. Allowing your users to share status updates to Twitter and Facebook (among other) can increase your user engagement because not only said status updates could carry your app’s name, but you’re allowing your user to do it without leaving your app.

In my book Build native cross-platform apps with Appcelerator I guide you through the process of building an app that I call PhotoMEME.

This app is somewhat simple, as compared to the conference app, but I think it’s kind of fun, plus it was really fun to write. In a nutshell, you can take a photo, then add some text to it and create a meme, which you can then share with your friends, primarily over Facebook and Twitter. The most challenging part of this app was that iOS and Android work very differently when it comes to sharing content with other apps.

Android is easy because it has a built-in mechanism called share intent, to which you can send some data, and Android will automatically give you a list of apps that can handle that type of data.

For iOS, the user experience is similar, but the implementation is much more different and complex. Luckily Appcelerator Titan Mads Møller created a native module called TiSocial.Framework that implements the native iOS code required to expose this feature, at least for Twitter and Facebook.

But even after having these two capabilities exposed to you, the implementations, as far as cross-platform is concerned, are very different at the JavaScript level. For this reason I created the SocialShare CommonJS module, which normalizes these two different methods into one simple function call.

The code is very simple:

    status                  : 'This is the status to share',
    image                   : fileToShare.nativePath,
    androidDialogTitle      : 'Sharing is caring!!!'

As simple as that: one function call, send the text you’d like to share, the image you’d like to share (if any), and the title for the Android dialog. This module will take care of the cross-platform differences for you, and will offer your user a native sharing dialog they already know how to use.

To learn more about this and other cool cross-platform tips, tricks, techniques and full apps, make sure you checkout my book Build native cross-platform apps with Appcelerator.

19 Flares Twitter 0 Facebook 0 Google+ 0 LinkedIn 19 Email -- 19 Flares ×


  1. Dear Ricardo,

    I am getting your book for sure! In addition, I would like to ask you if
    you know any book about building social message apps with chating and calling options like whatsapp or viber.

    Thanks a lot!

  2. Nice, thanks for sharing Ricardo!

    This commonjs module would be even more useful / reusable if you built it as an alloy widget (it would referenced and instalable through, etc.). We would just have a problem with the native modules, which should be installed separately, but this is not a great matter and a README could help

    • Ricardo Alcocer

      Hi Xavier.

      That’s a good idea, and very easy to do. I’ll post an update soon.

      Thanks for the suggestion.

      • Ricardo Alcocer

        I added the lib as an Alloy Widget to the Repo along with example.

  3. Srikanht

    my application is written in Ti native. How can I use this module? Thanks,

    • Ricardo Alcocer

      The module you can use, the widget is Alloy-only.

  4. wickstar

    This throws ‘NSGenericException’ on iPad devices.
    () should nave a non-nil sourceView or barButtonItem set before the presentation occurs

    Is there an update or workaround for this?

Comments are closed.

Sign up for updates!

Become a mobile leader. Take the first step to scale mobile innovation throughout your enterprise.
Get in touch
computer and tablet showing Appcelerator software
Start free, grow from there.
19 Flares Twitter 0 Facebook 0 Google+ 0 LinkedIn 19 Email -- 19 Flares ×