How to scale your Images with ImageScale Extension

[zainulhassan]

Image Scale Type | Make Images look the way you want

Image Scale Type It is a simple and but useful extension you can use to change scale type of image. Changing scale type of image specifies how the image should expand or shrink in order to fit into the defined width and height. It may seem simple but it can help to achieve complex designs that depend on images easily. Documentation [Set Scale] Set scale type of image. Provide the image view component that you want to set scale type for and the scale type from properties section. [Screen…

So today we will be taking a look at the power of this simple extension that takes in an image and simply sets its scale type to the provided scale type. BTW this should be available as a built in image property in kodular and other online app builders as it is just two to three lines of code. Just a suggestion. Lets start.

---

First I have created a very very simple layout. I have three images placed one above the other in a vertical scroll arrangement with spacing.

Then in the blocks section we have a data variable that stores reference to image components and their respective image url that we will be loading using Async Image Loader. You can find the link to this extension below. Its a really awesome extension. If you haven’t tried it yet then make sure to give it a try. Thanks to @DevYB for this extenson.

And here is the result that we get. First we will take a look at result without Image Scale extension.

And here is the result with Image Scale extension

The extension works with both Local and Online images. As you can see in the results that we have loaded images from internet.

---

And here you can download Image Loader

[F/OS] Image Loader - Extension for image loading and caching

Image Loader Hi everyone, Today I present a new extension based on Universal Image Loader that allows you to load and cache images. Demo Event OnLoadingStarted: Event when the loading of the image is started. The url returns the URL of the image. [OnLoadingStarted] OnLoadingFailed: Event when the image is failed to load. The url returns the URL of the image. [OnLoadingFailed] OnLoadingComplete: Event when the image is loaded. The url returns the URL of the image. [OnLo…

---

Download Aia file : ScaleImages.aia (221.5 KB)

---

Hope you found this simple tutorial helpful. Enjoy and if you have any extension ideas then let me know. I will try my best. Thanks Happy oding

---

Checkout My YouTube channel here : QuickTips

I will soon be making videos on extension develoement. So don’t miss them out.