Programmable Media

Android quick start

Last updated: Nov-25-2024

This quick start lets you get an end-to-end implementation up and running using the Android SDK in 10 minutes or less.

1. Set up and configure

You need to complete some initial project set up and configuration. The quick start assumes you're using Android Studio as your IDE.

Create a new Empty Views Activity project

Create a new app project and select Empty Views Activity from the list of templates. Give your app a name, update the package name to com.cloudinary.cloudinaryquickstart, and select Java as your language.

Add the Cloudinary Android SDK and other modules

Add the dependencies for the Cloudinary SDK, Glide modules, and navigation dependencies to your build.gradle.kts file in the app directory. You also need to set viewBinding to true.

In the dependencies section of your file, add the following:

build.gradle.kts
implementation("com.cloudinary:cloudinary-android:3.0.2")
implementation("com.github.bumptech.glide:glide:4.16.0")
implementation("androidx.constraintlayout:constraintlayout:2.1.4")
implementation("androidx.navigation:navigation-fragment:2.7.7")
implementation("androidx.navigation:navigation-ui:2.7.7")

In the Android section of your file, add the following:

build.gradle.kts
buildFeatures {
    viewBinding = true
}

Import the dependencies

In your MainActivity class, add the import statements for the Cloudinary SDK and other modules:

MainActivity.java
Android
package com.cloudinary.cloudinaryquickstart;

import android.net.Uri;
import android.os.Bundle;

import com.bumptech.glide.Glide;
import com.cloudinary.Transformation;
import com.cloudinary.android.MediaManager;
import com.cloudinary.android.callback.ErrorInfo;
import com.cloudinary.android.callback.UploadCallback;

import androidx.appcompat.app.AppCompatActivity;

import android.util.Log;

import com.cloudinary.cloudinaryquickstart.databinding.ActivityMainBinding;

import java.util.HashMap;
import java.util.Map;

Configure Cloudinary

Update your MainActivity class, defining your cloud name, creating an initCloudinary method and initializing it in the onCreate method.

MainActivity.java
Android

public class MainActivity extends AppCompatActivity {

    private String cloudName = "<your_cloud_name>";

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

    private void initCloudinary() {
        Map config = new HashMap();
        config.put("cloud_name", cloudName);
        MediaManager.init(this, config);
    }
}

Update layout views and manifest

In your resource directory, under layouts, open the activity_main.xml view in code view. Copy and paste the following code, replacing the existing contents of the file:

activity_main.xml
Xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".MainActivity">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true">

        <com.google.android.material.appbar.MaterialToolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize" />

    </com.google.android.material.appbar.AppBarLayout>

    <include
        android:id="@+id/main_content"
        layout="@layout/content_main" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

In the same directory, create a new file called content_main.xml and add the following XML code:

content_main.xml
Xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/generated_imageview"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@id/uploaded_imageview"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintDimensionRatio="W,1:1" />

    <ImageView
        android:id="@+id/uploaded_imageview"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintTop_toBottomOf="@id/generated_imageview"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintDimensionRatio="W,1:1" />

</androidx.constraintlayout.widget.ConstraintLayout>

The above layouts define where to render the uploaded and transformed images in the view.

In AndroidManifest.xml, copy and paste the following code:

AndroidManifest.xml
Xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <uses-permission android:name="android.permission.INTERNET" />

    <application
        android:allowBackup="true"
        android:dataExtractionRules="@xml/data_extraction_rules"
        android:fullBackupContent="@xml/backup_rules"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.CloudinaryQuickStart"
        tools:targetApi="31">
        <activity
            android:name=".MainActivity"
            android:exported="true"
            android:label="@string/app_name"
            android:theme="@style/Theme.CloudinaryQuickStart">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

2. Upload an image

Before adding your upload code:

  1. Download the following image and add it to the drawable resource folder.
  2. Create an unsigned upload preset (you can use the default settings) or use an existing unsigned preset. See the upload presets guide for more information.

Now copy and paste the code below which:

  • Creates a variable for your unsigned upload preset (update this to the name of your newly created preset).
  • Defines and inflates view binding for the activity.
  • Creates an uploadImage method.

Update MainActivity.java making sure to replace any variable placeholders:

MainActivity.java
Android

public class MainActivity extends AppCompatActivity {

    private String cloudName = "<your_cloud_name>";

    private String uploadPreset = "<your_upload_preset>"; //NEW - Name of unsigned upload preset";

    private ActivityMainBinding binding; //New - Activity binding

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        binding = ActivityMainBinding.inflate(getLayoutInflater()); // New - inflate view binding
        initCloudinary();
        uploadImage(); // New - call upload image method
    }

    private void initCloudinary() {
        Map config = new HashMap();
        config.put("cloud_name", cloudName);
        MediaManager.init(this, config);
    }
    // New - upload image function
    private void uploadImage() {
        Uri uri = Uri.parse("android.resource://com.cloudinary.cloudinaryquickstart/drawable/cloudinary_logo");
        MediaManager.get().upload(uri).unsigned(uploadPreset).callback(new UploadCallback() {
            @Override
            public void onStart(String requestId) {
                Log.d("Cloudinary Quickstart", "Upload start");
            }

            @Override
            public void onProgress(String requestId, long bytes, long totalBytes) {
                Log.d("Cloudinary Quickstart", "Upload progress");
            }

            @Override
            public void onSuccess(String requestId, Map resultData) {
                Log.d("Cloudinary Quickstart", "Upload success");
                String url = (String) resultData.get("secure_url");
                Glide.with(getApplicationContext()).load(url).into(binding.mainContent.uploadedImageview);
            }

            @Override
            public void onError(String requestId, ErrorInfo error) {
                Log.d("Cloudinary Quickstart", "Upload failed");
            }

            @Override
            public void onReschedule(String requestId, ErrorInfo error) {

            }
        }).dispatch();
    }

}

3. Transform an image

Copy and paste the following code, which:

  • Additionally defines a public ID of an image to transform (you can use a sample from your account, such as cld-sample-5)
  • Adds a variable for your URL.
  • Adds a method for generating a Cloudinary URL and setting the image view.
  • Sets up the content view and toolbar.

Update MainActivity.java making sure to replace any variable placeholders:

MainActivity.java
Android
package com.cloudinary.cloudinaryquickstart;

import android.net.Uri;
import android.os.Bundle;

import com.bumptech.glide.Glide;
import com.cloudinary.Transformation;
import com.cloudinary.android.MediaManager;
import com.cloudinary.android.callback.ErrorInfo;
import com.cloudinary.android.callback.UploadCallback;

import androidx.appcompat.app.AppCompatActivity;

import android.util.Log;

import com.cloudinary.cloudinaryquickstart.databinding.ActivityMainBinding;

import java.util.HashMap;
import java.util.Map;

public class MainActivity extends AppCompatActivity {

    private String cloudName = "<your_cloud_name>";
    private String uploadPreset = "<your_upload_preset>";
    private String url; // New - variable for URL
    private String publicId = "<your_public_id>"; // New - Public Id for image to transform
    private ActivityMainBinding binding;

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

        binding = ActivityMainBinding.inflate(getLayoutInflater());
        // New - setting up content view and toolbar
        setContentView(binding.getRoot());
        binding.toolbar.setTitle("Cloudinary Quickstart");
        setSupportActionBar(binding.toolbar);

        initCloudinary();
        uploadImage();
        generateUrl(); // New - call method to generate URL
    }

    private void initCloudinary() {
        Map config = new HashMap();
        config.put("cloud_name", cloudName);
        MediaManager.init(this, config);
    }

    private void uploadImage() {
        Uri uri = Uri.parse("android.resource://com.cloudinary.cloudinaryquickstart/drawable/cloudinary_logo");
        MediaManager.get().upload(uri).unsigned(uploadPreset).callback(new UploadCallback() {
            @Override
            public void onStart(String requestId) {
                Log.d("Cloudinary Quickstart", "Upload start");
            }

            @Override
            public void onProgress(String requestId, long bytes, long totalBytes) {
                Log.d("Cloudinary Quickstart", "Upload progress");
            }

            @Override
            public void onSuccess(String requestId, Map resultData) {
                Log.d("Cloudinary Quickstart", "Upload success");
                String url = (String) resultData.get("secure_url");
                Glide.with(getApplicationContext()).load(url).into(binding.mainContent.uploadedImageview);
            }

            @Override
            public void onError(String requestId, ErrorInfo error) {
                Log.d("Cloudinary Quickstart", "Upload failed");
            }

            @Override
            public void onReschedule(String requestId, ErrorInfo error) {

            }
        }).dispatch();
    }

    //New - method for generating Cloudinary URL for given Public Id
    private void generateUrl() {
        url = MediaManager.get().url().transformation(new Transformation().effect("sepia")).generate(publicId);
        Glide.with(this).load(url).into(binding.mainContent.generatedImageview);
    }

}

4. Run your code

Run your app. You should see your two images, one being the Cloudinary logo that you uploaded and the other a transformed image for the public ID that you set.

Android quickstart main view

View the completed code

You can find the full code example for this on GitHub.

Next steps

  • Learn more about the Android SDK by visiting the other pages in this SDK guide.
  • Get comprehensive details about Cloudinary features and capabilities:

Take a look at the Android sample project for a more comprehensive example using the Cloudinary Android SDK.

✔️ Feedback sent!