Android: Easy Asset Management

As a Mobile Developer for Cloudinary, I hold, maintain, and build SDKs for new mobile frameworks (Flutter, React Native, etc.). I recently built a new sample app complementary to the SDK package that you can use and play with the Cloudinary SDK and solution.

An overview of what you can find in my sample app to better manage your assets:

• Optimizations.
• Transformations.
• Use cases such as localization, branding, and background normalization.
• Uploading, including uploading large files and fetch upload.
• Upload widget and image widget implementations.
• Video, including the video player widget and video feeds.

I also released a guide for my Cloudinary iOS sample app.

When the app starts, enter your cloud name, which you can find on the Cloudinary platform.

Once you have your cloud name, put it into the EditText on screen. The code will initialize our MediaManager class, which holds the Cloudinary configuration. We’ll use this class to perform URL generation, uploads, and more.

The Delivery tab shows you various things you can do with the Cloudinary SDK.

This screen allows you to see how optimization through Cloudinary will reduce the asset size and the amount of bandwidth the app will consume.

url = MediaManager.get().url().transformation(new Transformation().crop("scale").width(800).fetchFormat("avif").quality("auto").dpr("auto")).generate(publicId);Code language: JavaScript (javascript)

We’ll use our MediaManager object to create our URL, and then we’ll set a new Transformation().

1. Use crop mode scale to keep the current asset aspect ratio.
2. Reduce the width to 800px.
3. Use AVIF as the image format. This will reduce the asset size. (Note: AVIF is supported for Android 12+.)
4. Set the quality to auto, which will allow Cloudinary to optimize the image quality.
5. Set the DPR to auto.
6. At the end of the line, we’ll call generate and give it the asset name (publicId).
7. After completing these steps, we’ll get a much lighter, optimized asset.

In the Transform tab, you can find various transformations that Cloudinary can help you with, from changing the asset size and aspect ratio to background removal, overlays, and recoloring different objects in an asset.

In the Use Cases section, you can find a few use cases that Cloudinary users leverage in their apps. Take different size images and set them in a size that works for you.

You can also brand your images easily.

In the Upload tab, you can:

• Upload. Upload an asset from your phone to your cloud with one line of code.

MediaManager.get().upload(imageUri).unsigned(Utils.UPLOAD_PRESET).dispatch();Code language: CSS (css)

As you can see in the snippet above, we need to give the upload function the asset URI. We’ll make an unsigned upload, give it the UPLOAD_PRESET, and dispatch the request.

Note: To learn more about upload presets, go here.

• Pre-process. By pre-processing, you can reduce the size of an image before uploading it to your Cloudinary cloud:

MediaManager.get().upload(imageUri)

                .unsigned(Utils.UPLOAD_PRESET)

                .preprocess(new ImagePreprocessChain()

                        .loadWith(new BitmapDecoder(1000, 1000))

                        .addStep(new Limit(1000, 1000))

                        .addStep(new DimensionsValidator(10,10,1000,1000))

                        .saveWith(new BitmapEncoder(BitmapEncoder.Format.JPEG, 80)))Code language: CSS (css)

• Fetch upload. Upload assets from a remote URL to your cloud.

url = MediaManager.get().url().type("fetch").transformation(new Transformation().crop("scale").width(800).fetchFormat("avif").quality("auto").dpr("auto")).generate(publicId);Code language: JavaScript (javascript)

The only change we make here from a URL that we generated before, is to set the .type() to fetch. Cloudinary will generate a new URL for you and upload the asset from the remote URL to your cloud.

As part of the SDK, we offer different widgets.

The Image widget allows quick and easy integration of the Cloudinary SDK with Glide, Picasso, and Fresco.

MediaManager.get().setDownloadRequestBuilderFactory(new GlideDownloadRequestBuilderFactory());

MediaManager.get().download(requireActivity()).load("https://res.cloudinary.com/mobiledemoapp/image/upload/v1/Demo%20app%20content/Frame_871_ao5o4r?_a=DAFAMiAiAiA0").into(imageView);Code language: JavaScript (javascript)

By setting the Factory to glide within the MediaManager, we’re telling it to use glide to download images, and then we can easily call download to download any image we want.

The Upload widget allows you to quickly and easily open the phone gallery and allow your users to upload to your Cloudinary cloud.

To open the widget, we’ll use the following code:

UploadWidget.startActivity(getActivity(), UPLOAD_WIDGET_REQUEST_CODE);Code language: CSS (css)

Give it the UPLOAD_WIDGET_REQUEST_CODE so we can catch the callback.

After choosing an asset, catch it at:

@Override

    protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) {Code language: CSS (css)

These are the results picked from the Upload widget:

List<UploadWidget.Result> results = data.getParcelableArrayListExtra(UploadWidget.RESULT_EXTRA);
Video
Code language: HTML, XML (xml)

As part of the Cloudinary Android SDK, we also offer our own easy-to-use native video player (based on ExoPlayer).

Our player allows easy integration with Cloudinary features such as transformations and more.

Our Cloudinary video player with controls is displayed.

CldVideoPlayer player = new CldVideoPlayer(this.getContext(), "https://res.cloudinary.com/mobiledemoapp/video/upload/v1706627936/Demo%20app%20content/sport-1_tjwumh.mp4");

player.getPlayer().setRepeatMode(Player.REPEAT_MODE_ALL);

binding.videoPlayerPlayerview.setPlayer(player.getPlayer());

player.play();Code language: JavaScript (javascript)

In the snippet, we’ll create the CLDVideoPlayer object, give it the context and URL we want to play, then add it to our view and use .play() to play it.

The lower part of the screen shows a demonstration of a video feed and how easily it can be achieved with our video player.

If you’re an Android developer looking for an easy solution to handle and optimize your assets, check out our Android SDK. The range of widgets and transformations to simplify your code and boost your application’s performance.

The Android SDK can be found here, a​​nd to learn more about Cloudinary, contact us today.