Last updated: Sep-12-2024
On this page:
Overview
Learn how to install and configure the Cloudinary Flutter SDK in your Flutter environment.
Video tutorial
View the code
You can find the code from this tutorial in GitHub.Tutorial contents
This tutorial presents the following topics. Click a timestamp to jump to that part of the video.
The Cloudinary Flutter SDK
0:00 | The Cloudinary Flutter SDK provides image and video transformation, optimization, and delivery capabilities that you can implement using code that integrates seamlessly with your existing Flutter application. |
Install the Flutter SDK
0:11 | To install the Flutter SDK and add them as dependencies in your pubspec.yaml file, in a terminal run: |
Import Cloudinary into your project
0:22 | To import Cloudinary into your project use: |
Configure Cloudinary
0:33 | To configure the SDK for your product environment, replace ddjmx10sp in this example with your cloud name which can be found in your Cloudinary Dashboard: |
Add an image
0:52 | Add an image in the body of your main widget using the CldImageWidget . Replace the public ID in the example code with the public ID of one of the images in your product environment, which you can find in the Media Explorer: |
Keep learning
Related topics
- Watch more Dev Hints videos on the Cloudinary YouTube channel.
- Follow the Flutter SDK quick start to get up and running in five minutes.
- Learn how to transform your images and videos using the Flutter SDK.
- Learn how to transform and optimize your assets.
- Delve into some more advanced transformation features, such as adding complex transformations and the Zoompan effect.
If you like this, you might also like...
Optimization Tips
Tips for delivering optimized imagesNamed Transformations
Simplify & standardize complex delivery URLsTransformation Basics
Learn the basics of a transformation URL
Check out the Cloudinary Academy for free self-paced Cloudinary courses on a variety of developer or DAM topics, or register for formal instructor-led courses, either virtual or on-site.
✖️