PhoneGap Plugin Roundup

Posted on Tuesday, September 20th, 2016 by Ash Ryan
Categories: Android, iOS, Web
Tags: Client Auth, Image Editor UI, PhoneGap, Send To Desktop API, User Auth UI

PhoneGap Logo

We’ve had a lot of PhoneGap news recently, with the release of our first 4 PhoneGap plugins and 2 PhoneGap templates.

PhoneGap makes it possible for Web developers to build apps for iOS and Android using the languages they know and love: HTML, CSS, and JavaScript. Our PhoneGap plugins are also compatible with Cordova and Ionic.

Creative SDK Image Editor PhoneGap template

Image Editor UI PhoneGap plugin

Creative SDK Send To Desktop API PhoneGap plugin

Send To Desktop API PhoneGap plugin

Learn more

For an overview of these new offerings, head over to the PhoneGap blog, where they talk about the Image Editor UI plugin, Send To Desktop API plugin, and more!

To see all of the Creative SDK PhoneGap plugins and templates, also be sure to check out the Plugins section of the Creative SDK GitHub page.

If there’s another Creative SDK PhoneGap plugin you’d like to see, let us know in the comments!

PhoneGap template for the Creative SDK Send To Desktop API

Posted on Wednesday, September 7th, 2016 by Ash Ryan
Categories: Android, iOS, Web
Tags: Client Auth, Image Editor UI, PhoneGap, Send To Desktop API, User Auth UI

PhoneGap Logo

Hi Web developers! We’ve had a lot of PhoneGap + Creative SDK announcements for you recently. We announced our first PhoneGap plugins, a PhoneGap template for the Image Editor, and another batch of PhoneGap plugins.

As a companion to that second batch of plugins, today we are releasing a PhoneGap template for the Creative SDK Send To Desktop API.

A template is a great way to start learning about a PhoneGap plugin. Templates are essentially sample apps that you can download via NPM, build from your command line, and run on your device (these plugins support iOS and Android).

When you try out the Creative SDK Send To Desktop PhoneGap template, without writing any code, you’ll have a sample app for your reference that looks like this:

Creative SDK Send To Desktop API PhoneGap plugin

In the template app, you can:

Try it out

You can get started with the Creative SDK Send To Desktop template for PhoneGap by checking out the repo on GitHub.

The README covers everything you need to get going, including prerequisites, setup steps, and files to check for sample code.

Learn more

After you’ve tried the template and you’re ready to learn more about the plugins that make the template possible, check out these GitHub repos:

The READMEs for the plugin repos on GitHub contain Setup and API guides, as well as sample code, to help you get started quickly.

If there’s another Creative SDK PhoneGap plugin you’d like to see, let us know in the comments!

New PhoneGap plugins: Send To Desktop API and User Auth UI

Posted on Tuesday, August 30th, 2016 by Ash Ryan
Categories: Android, iOS, Web
Tags: Client Auth, Image Editor UI, PhoneGap, Send To Desktop API, User Auth UI

PhoneGap Logo

Hi Web developers! Joining our first two PhoneGap plugins, we’re excited to announce a new batch of plugins that let you use the Creative SDK in your PhoneGap app.

Adobe PhoneGap lets you easily create apps using the web technologies you know and love: HTML, CSS, and JavaScript.

With our growing catalogue of PhoneGap plugins, you can build apps using the Creative SDK native components for iOS and Android without writing a single line of Objective-C, Swift, or Java.

About the plugins

Our newest plugins make available the Creative SDK Send To Desktop API and User Auth UI components.

With the Send To Desktop API plugin, your users can send images from your mobile app and have them open automatically in Photoshop, Illustrator, or InDesign on the desktop.

For the user, this interaction feels like magic; for the developer, it’s a single function call.

Send To Desktop API

Send To Desktop API: Send images from your app to Photoshop, Illustrator, or InDesign

The Send To Desktop workflow makes use of the user’s Adobe Creative Cloud account, which you can access via the User Auth UI plugin.

All of the heavy lifting for User Auth login and logout is handled by the plugin, making the integration quick and simple to set up.

Get the plugins

Check out our PhoneGap plugins on GitHub:

  • Client Auth: The starting point for all Creative SDK integrations
  • Image Editor UI: Powerful photo editing for mobile apps
  • New! User Auth UI: Let users log in to their Adobe Creative Cloud accounts, right from within your app
  • New! Send To Desktop API: Magically send images from mobile to Photoshop, Illustrator, or InDesign

The READMEs for the plugin repos contain Setup and API guides, as well as sample code, to help you get started quickly.

We’ll have more Creative SDK + PhoneGap news for you soon. As always, feel free to reach out if you have any requests related to our PhoneGap plugins.

(Oh, and while you’re digging in, try out our PhoneGap template for the Image Editor!)

We’ve got GitHub repos

Posted on Thursday, March 24th, 2016 by Ash Ryan
Categories: Android, iOS, Web
Tags: Asset Browser UI, Client Auth, GitHub, Image Editor UI, Repo, Send To Desktop API, User Auth UI

Adobe Creative SDK repos on GitHub

When you start your Creative SDK integration, the best place to learn what the SDK can do for your app is to check out our developer guides for your platform. The guides walk you through step-by-step example integrations for each Creative SDK component, complete with code snippets and screenshots.

But sometimes you just want to see top-to-bottom working code.

If that’s the case for you, go have a look at our GitHub repos for iOS, Android, and Web. These Getting Started repos contain multiple apps that accompany the developer guides on our portal.

For example, if you’re looking to integrate the Asset Browser UI component on Android, see the example app in our Android GitHub repo. The code in this app mirrors what is covered in our Asset Browser UI guide.

Our current developer guide and GitHub repo offerings

We offer GitHub repos and companion developer guides for iOS, Android, and Web.

The lineup will naturally change over time. You can check the latest developer guides on our developer portal, and the latest repos on our GitHub org.

We hope the example GitHub repos make it easy for you to get up and running with the Creative SDK.

Head on over to GitHub to fork a repo and try out our Creative SDK example apps.

Checking Network Status on Android

Posted on Wednesday, January 20th, 2016 by Ash Ryan
Category: Android
Tags: Asset Browser UI, User Auth UI

Hi Android developers! The Creative SDK offers a range of components designed to let you offer your users creative tools and connectivity to the Creative Cloud ecosystem.

Because of this deep integration with the Creative Cloud, all Creative SDK components require a network connection for full functionality. In some cases, Creative SDK components require an internet connection to launch successfully.

For example, the User Auth UI and Asset Browser UI components talk directly to the Creative Cloud. If your user isn’t connected to the internet, these components won’t do much other than tell the user that a connection is required.

If you want to save the user a step, you can have your app check for network status before launching a component that requires an internet connection.

Let’s take a quick look at a way to do that on Android.

Contents

An example UI

Let’s say we’re just starting to build an app that will let the user log in to the Creative Cloud, then view their Creative Cloud Assets via the Creative SDK’s Asset Browser UI (see our Asset Browser UI guide if you’re interested in making such an app).

In this fictional example, we’ve just started building the app and we’re working on the Creative Cloud login. The user will click a button to launch the Creative SDK’s User Auth UI component:

Android network status helper method

In this example, when a user clicks this button, we want to:

  1. Check the network status
  2. Show a Toast to users who are not connected
  3. Launch the Creative SDK’s User Auth UI component for users who are connected

A network status helper method

To check network status, we’ll make a helper method called isConnectedToNetwork():

private boolean isConnectedToNetwork() {
    ConnectivityManager connectivityManager = (ConnectivityManager) getSystemService(Context.CONNECTIVITY_SERVICE);
    NetworkInfo networkInfo = connectivityManager.getActiveNetworkInfo();
    return networkInfo != null && networkInfo.isConnected();
}

This method will return true if the device is connected to a network and false if it is not.

The click listener

We’ll handle the logic for when to launch the Creative SDK’s User Auth UI component in a View.OnClickListener:

View.OnClickListener launchAdobeAuthUIListener = new View.OnClickListener() {
    @Override
    public void onClick(View v) {

        if (isConnectedToNetwork()) {
            showAdobeLoginUI(); // An example helper method you would write elsewhere in the Activity class
        }
        else {
            Toast.makeText(MainActivity.this, "Please connect to a network", Toast.LENGTH_SHORT).show();
        }

    }
};
mLaunchAdobeAuthUIButton.setOnClickListener(launchAdobeAuthUIListener);

In the code above, when the button is clicked, onClick() is called. The onClick() method will use our isConnectedToNetwork() helper method in an if statement that:

  • calls showAdobeLoginUI() if the device is connected
  • shows a Toast to the user if the device is not connected

Android network status Toast

Checking the device’s network status this way, we have saved the user a step by letting them know immediately that there is no network connection.

Learn more

Want to learn more about the Creative SDK components mentioned above? Check out our User Auth UI guide and Asset Browser UI guide.

If you want to know more about what the Creative SDK for Android can do for you, visit our developer portal!

New Android Guides for User Auth and Asset Browser

Posted on Friday, December 11th, 2015 by Ash Ryan
Category: Android
Tags: Asset Browser UI, User Auth UI

Hi Android developers! Following our recent refresh of the Getting Started and Image Editor guides, we have two new guides for you on our developer portal!

Contents

An all-new User Auth guide

We’ve got a brand new guide for you that explains the Creative SDK’s User Auth UI Component. Follow the steps in this guide to learn how to:

  • provide for your users the Creative Cloud login UI
  • check for auth status during all parts of the Android Activity Lifecycle
  • allow your users to log out.

The User Auth guide features enough plug-and-play code that you can expect to get up and running in a very short amount of time.

Adobe Creative SDK User Auth UI login screen

A refreshed Asset Browser guide

After you complete the User Auth UI guide, head over to our completely refreshed Asset Browser UI guide. This guide will show you how to offer your users access to their Creative Cloud assets via the Creative SDK’s Asset Browser.

This guide will help you get started with the Asset Browser and even show you the various configuration options so you can customize the Asset Browser experience for users of your app.

Adobe Creative SDK Asset Browser UI screen

Stay tuned

We remain hard at work preparing new Creative SDK guides for Android developers. We’ll have more resources to help you explore the power of the Creative SDK soon!

If you’re looking for more Android-related information, check out our developer portal, or read more about the Creative SDK for Android right here on this blog.

Displaying Basic Creative Cloud User Profiles

Posted on Tuesday, November 17th, 2015 by Ash Ryan
Category: Android
Tag: User Auth UI

Hi Android developers! We previously talked about the User Auth UI component in the Creative SDK. The User Auth UI component is what lets your users log in to the Creative Cloud right from within your app.

We’ve covered logging a user in, but there are other things you can explore within User Auth. Let’s have a quick look at a simple way to display the user’s first name in a Toast popup.

While you may find that you want to expand on the core concept here, it only takes two lines of code to get started!

Note: If you haven’t already, be sure to check out our post on logging a user in. We’ll be building upon the code there.

Content

Where we left off

When we concluded last time, we had made a method called showAuthenticatedUI(), which determines what the user sees after they log in:

private void showAuthenticatedUI() {
    setContentView(R.layout.activity_main);
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);

    Log.i(MainActivity.class.getSimpleName(), "User is logged in!");
}

Currently this method logs “User is logged in!” to the console, which is fine for us. But what about letting the user know that something happened?

We could, for example, use a Toast that displays “You are logged in”, but we can do something a little more dynamic and informative using the Creative SDK.

Getting the User Profile data

Inside of our showAuthenticatedUI() method, let’s use the User Profile from the AdobeUXAuthManager.

Under the Log.i(), add a new line:

String firstName = mUXAuthManager.getUserProfile().getFirstName();

We’ve just assigned the first name from the user’s Adobe ID profile to the firstName variable. Specifically, AdobeUXAuthManager.getUserProfile() returns an AdobeAuthUserProfile, which in turn has the method getFirstName().

As you may expect, there are more methods on AdobeAuthUserProfile than just getFirstName(). Feel free to read the docs and experiment, but for this post, we will stick with the first name only.

Displaying a Toast

The last step here is to simply make a Toast and show it:

Toast.makeText(MainActivity.this, "Logged in to Creative Cloud as " + firstName, Toast.LENGTH_LONG).show();

Now when a user logs in or re-enters the app, they will see something like this:
Creative SDK and Creative Cloud user profiles


This is a fairly simple example, but it’s easy to imagine using this data in other ways as well: displaying User Profile data in the layout, or creating smart default file names.

As a further step for the example above, imagine how you might display the Toast we made only right after the user logs in, but not when the user re-enters the app.

User Auth UI for Android

Posted on Tuesday, November 10th, 2015 by Ash Ryan
Category: Android
Tag: User Auth UI

Hi Android developers! With the Creative SDK, you can allow your users to interact with their assets in the Creative Cloud, like Lightroom Photos, Photoshop Mixes, Sketches, and more.

Before a user can view their Creative Cloud assets, they will need to log in to their Creative Cloud account through your app. The Creative SDK makes this easy by providing the developer with a UI component that is quick to implement and familiar to Creative Cloud users:
The Adobe Creative SDK login screen

Let’s have a quick look at how this works.

Note: Before you continue on, you’ll want to follow our all-new Getting Started guide for Android to include the SDK, configure your Gradle build, and implement Client Auth.

Contents

Configuration

Add the following Creative SDK dependency to your Module build.gradle file:

/* Add the CSDK framework dependency (Make sure the version number is correct) */
compile 'com.adobe.creativesdk.foundation:auth:0.7.329'

Allowing the user to log in

In the example below, user login involves the following flow in the Main Activity.

  1. The AdobeUXAuthManager is initialized with the Client ID and Secret. Note: this must be done before auth operations such as login and logout.
  2. The AdobeAuthSessionHelper retrieves the user’s current auth status with a callback.
  3. If the user is not logged in, they will see the Adobe ID login screen.
  4. If the user is logged in (or if they logged in during the previous step), they will see the Main Activity layout.
  5. Your app continues from there.

These steps are numbered #1-5 in the code comments below:

public class MainActivity extends AppCompatActivity {

    private static int DEFAULT_SIGN_IN_REQUEST_CODE = 202;

    private AdobeAuthSessionHelper mAuthSessionHelper;
    private AdobeUXAuthManager mUXAuthManager;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        /* 1 */
        mUXAuthManager = AdobeUXAuthManager.getSharedAuthManager();

        /* 2 */
        mAuthSessionHelper = new AdobeAuthSessionHelper(mStatusCallback);
        mAuthSessionHelper.onCreate(savedInstanceState);
    }

    private AdobeAuthSessionHelper.IAdobeAuthStatusCallback mStatusCallback;
    {
        mStatusCallback = new AdobeAuthSessionHelper.IAdobeAuthStatusCallback() {
            @Override
            public void call(AdobeAuthSessionHelper.AdobeAuthStatus adobeAuthStatus, AdobeAuthException e) {
                if (AdobeAuthSessionHelper.AdobeAuthStatus.AdobeAuthLoggedIn == adobeAuthStatus) {
                /* 3 */
                    showAuthenticatedUI();
                } else {
                /* 4 */
                    showAdobeLoginUI();
                }
            }
        };
    }

    private void showAdobeLoginUI() {
        mUXAuthManager.login(new AdobeAuthSessionLauncher.Builder()
                        .withActivity(this)
                        .withRequestCode(DEFAULT_SIGN_IN_REQUEST_CODE)
                        .build()
        );
    }

    private void showAuthenticatedUI() {
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

        /* 5 */
        Log.i(MainActivity.class.getSimpleName(), "User is logged in!");
    }

    // ...

Checking user auth status

The Adobe Auth Session Helper contains methods for checking the user’s auth status during all parts of the Activity lifecycle.

Be sure to override the following Activity methods, calling the related AdobeAuthSessionHelper methods within:

    // ...

    @Override
    protected void onResume() {
        super.onResume();
        mAuthSessionHelper.onResume();
    }

    @Override
    protected void onPause() {
        super.onPause();
        mAuthSessionHelper.onPause();
    }

    @Override
    protected void onStart() {
        super.onStart();
        mAuthSessionHelper.onStart();
    }

    @Override
    protected void onStop() {
        super.onStop();
        mAuthSessionHelper.onStop();
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        mAuthSessionHelper.onDestroy();
    }

    @Override
    public void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        mAuthSessionHelper.onActivityResult(requestCode, resultCode, data);
    }

    // ...

Explore

There’s still plenty more you can do with User Auth, like logging a user out, or accessing basic profile information.

Read more about the AdobeAuthSessionHelper and AdobeUXAuthManager classes on the Creative SDK Android developer portal.

Also, be sure to stayed tuned for more info on the Creative SDK’s User Auth UI component and APIs. We’ll have a new guide for you on the developer portal soon!