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!

Configuring the Asset Browser

Posted on Friday, December 18th, 2015 by Ash Ryan
Category: Android
Tag: Asset Browser UI

Note: this post applies to version 0.7.329 and below. Get the latest info at creativesdk.com.

Hi Android developers! We recently published two new guides for User Auth UI and Asset Browser UI. As you might imagine, User Auth lets your users log in to the Creative Cloud from within your app, and the Asset Browser serves as a file picker, letting your users see the creative assets they have stored in the Creative Cloud.

Your creative users may have a number of asset types stored in the Creative Cloud, ranging from PSDs and image files to Lightroom Photos and mobile creations from Illustrator Draw, Photoshop Mix and more.

But if your app is only intended to work with, say, PSDs, it’s better to focus the Asset Browser experience by only allowing interaction with PSDs.

We can acheive this by configuring the Asset Browser for an experience customized for your app.

As an example, let’s have a look at how to customize the Asset Browser so that it allows interaction only with assets that are both:

  1. stored in the Creative Cloud Files data source
  2. either JPEGs or PNGs

Contents

Getting started

This post will assume you have completed the steps in the following resources:

Also, be sure you have the following Creative SDK dependencies in your Module build.gradle file:

/* Add the CSDK framework dependencies (Make sure these version numbers are correct) */
compile 'com.adobe.creativesdk.foundation:auth:0.7.329'
compile 'com.adobe.creativesdk.foundation:assetux:0.7.329'

If you’ve completed these steps, you’re ready to go!

The default Asset Browser

First, let’s take a quick look at what the default Asset Browser looks like.

We will continue with the launchAssetBrowser() method that we created in our post on Launching the Asset Browser UI component:

private void launchAssetBrowser() {
    AdobeUXAssetBrowser assetBrowser = AdobeUXAssetBrowser.getSharedInstance();

    try {
        assetBrowser.popupFileBrowser(this, LAUNCH_BROWSER_REQUEST_CODE);
    }
    catch (AdobeCSDKException e) {
        Log.e(MainActivity.class.getSimpleName(), "Error: " + e.getMessage());
    }
}

The result will be an Asset Browser like the one in the image below. Note the highlights that are irrelevant for our app’s use case:

  1. Red: All available data sources are listed, but we only want to allow access to Creative Cloud Files.
  2. Blue: All file types are available for interaction, but we only want to allow interaction with JPEGs and PNGs.

The Creative SDK Default Asset Browser

Let’s use filters to focus the Asset Browser experience.

Filtering by data source

We can restrict available data sources by using the dataSourceFilter property of AdobeUXAssetBrowserConfiguration.

Change your launchAssetBrowser() method to match the following:

private void launchAssetBrowser() {
    AdobeUXAssetBrowser assetBrowser = AdobeUXAssetBrowser.getSharedInstance();
    AdobeUXAssetBrowserConfiguration configuration = new AdobeUXAssetBrowserConfiguration();

    /* 1) Set the dataSourceFilter property */
    configuration.dataSourceFilter = AdobeAssetDataSourceFilter.createFromDataSources(
            /* 1.a) Provide a set of source types */
            EnumSet.of(AdobeAssetDataSourceType.AdobeAssetDataSourceFiles),
            /* 1.b) Select the type of filter, INCLUSION or EXCLUSION */
            AdobeAssetDataSourceFilterType.ADOBE_ASSET_DATASOUCE_FILTER_INCLUSION
    );

    try {
        assetBrowser.popupFileBrowser(this, ASSET_BROWSER_REQUEST_CODE, configuration);
    }
    catch (AdobeCSDKException e) {
        Log.e(MainActivity.class.getSimpleName(), "Error: " + e.getMessage());
    }
}

Note that for the Asset Browser’s popupFileBrowser() method, we now pass in 3 arguments instead of 2.

Since we restricted the data sources to a single source, the Asset Browser will no longer display a list of sources at the top of the screen:
The Creative SDK Asset Browser, filtered by data source

Now let’s restrict which assets can be interacted with by mime type.

Filtering by mime type

In this example, we only want our users to interact with JPEGs and PNGs. We can filter by mime type with the mimeTypeFilter property of AdobeUXAssetBrowserConfiguration.

Add the following to your launchAssetBrowser() method:

/* 1) Set the mimeTypeFilter property */
configuration.mimeTypeFilter = AdobeAssetMIMETypeFilter.createFromMimeTypes(
        /* 1.a) Provide a set of mime types */
        EnumSet.of(AdobeAssetMimeTypes.MIMETYPE_JPEG, AdobeAssetMimeTypes.MIMETYPE_PNG),
        /* 1.b) Select the type of filter, INCLUSION or EXCLUSION */
        AdobeAssetMIMETypeFilterType.ADOBE_ASSET_MIMETYPE_FILTERTYPE_INCLUSION
);

The Asset Browser will now look like this:
The Creative SDK Asset Browser, filtered by mime type

Notice how the MOV and SVG are now grayed out. Your users will not be able to pick these files, nor any others that are not JPEGs or PNGs.

Learn more

Customizing the Asset Browser is a powerful way to add focus to the user experience and prevent errors caused by unexpected file types.

In this example, we restricted the data source and mime types that users can interact with. But there are still more options available!

Have a look at our brand-new Asset Browser UI guide for details on further customization and more.

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.

Launching the Asset Browser UI component

Posted on Tuesday, December 1st, 2015 by Ash Ryan
Category: Android
Tag: Asset Browser UI

Note: this post was written for version 0.7.329 and below. Get the latest info at creativesdk.com.

Hi Android developers! If you’re developing for creative users, there’s a good chance that they already have an Adobe Creative Cloud account full of creative assets like Photoshop files, Lightroom photos, and mobile creations made in one of Adobe’s many mobile apps like Photoshop Mix or Illustrator Draw.

The Creative SDK’s Asset Browser UI component is one way for your app to become part of the Creative Cloud ecosystem. With the Asset Browser, you can launch a familiar Creative Cloud UI right within your app, and allow your users to browse and download their Creative Cloud assets for further work inside of your own app.

Let’s have a basic look at the very first step to integrating the Asset Browser: launching the UI component. We will make a quick demo where, when the user taps a button, the Asset Browser UI component launches:
The Creative SDK Asset Browser

Contents

Getting started

This post will assume you have completed the steps in the following resources:

Also, be sure you have the following Creative SDK dependencies in your Module build.gradle file:

/* Add the CSDK framework dependencies (Make sure these version numbers are correct) */
compile 'com.adobe.creativesdk.foundation:auth:0.7.329'
compile 'com.adobe.creativesdk.foundation:assetux:0.7.329'

Make a launch button

Add a button to your activity’s layout:

<Button
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Browse assets"
    android:id="@+id/launchBrowserButton"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true" />

For this demo, this is the only element you will need in your layout.

Make a launch method

Next we need to add the code to our Main Activity that will be used to launch the Asset Browser. Let’s make ourselves a helper method for that purpose:

private void launchAssetBrowser() {
    AdobeUXAssetBrowser assetBrowser = AdobeUXAssetBrowser.getSharedInstance();

    try {
        assetBrowser.popupFileBrowser(this, LAUNCH_BROWSER_REQUEST_CODE);
    }
    catch (AdobeCSDKException e) {
        Log.e(MainActivity.class.getSimpleName(), "Error: " + e.getMessage());
    }
}

Note that at the top of your Main Activity, you’ll need to declare a constant for the second argument for popupFileBrowser():

private static final int LAUNCH_BROWSER_REQUEST_CODE = 301;

Now you just need to call launchAssetBrowser() when the button is clicked.

Add an on-click listener

If you followed along with our post on User Auth, then you will have a method called showAuthenticatedUI(). We will add our button and on-click listener in this method:

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!");


    mLaunchAssetBrowserButton = (Button)findViewById(R.id.launchBrowserButton);

    View.OnClickListener buttonListener = new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            launchAssetBrowser();
        }
    };
    mLaunchAssetBrowserButton.setOnClickListener(buttonListener);
}

Be sure to declare mLaunchAssetBrowserButton at the top of your Main Activity:

private Button mLaunchAssetBrowserButton;

Launch the app and try it out. You’ll need to log into your Creative Cloud account first. Once you do, just click the button we made above and you should see the Creative SDK Asset Browser UI component:
The Creative SDK Asset Browser

Next steps

Of course, allowing the user to browse is just the first step. Next, you’ll likely want to explore the process of downloading user-selected assets for use within your app. This will all happen in the onActivityResult() method of your Main Activity.

If you want to continue exploring, AdobeUXAssetBrowser.ResultProvider is a good place to start.

Be sure to stay tuned for more info on the Creative SDK for Android!