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.

Screenshot 2020-12-23 221725
Available Scale Types


Screenshots

Obviously It is a really simple ui anyone can make.

blocks

In the above screen you can see that I have used “CENTER_CROP” scale type. It makes sure that image expands to fill but it does not change images ratio. It just expands from center and cuts off extra image keeping its aspect ratio. Moreover Center Crop block is the only reason I mage this extension. But different scale types are useful for different scenarios.


component_set_get
You might say that there is already a block present for this. But it has only two scale types i.e 0 and 1.
0 will keep aspect ratio but if the defined size is larger than image size it wont scale up.
1 will expand or shrink the image to fit any size but it will compromise aspect ratio and ultimately distort image.


AIX File
com.dreamers.ImageScale.aix (5.5 KB)


Hope you guys give it a try and find it useful. Looking forward for suggestions because currently it has only this block. So if you have any suggestions then please let me know. Thanks and Happy Koding :kodular:

30 Likes

thank you for your contribution and thank you for following the naming conventions…

I know that Android usually uses the ALL_CAPS_WITH_UNDERSCORES naming convention for constants, however in the App Inventor world we also use the naming convention UpperCamelStyle, i.e. rather than CENTER_CROP you should write CenterCrop, etc.
it would be great, if you could adjust this accordingly…

btw. currently in MIT App Inventor the new dropdowns are currently in test, which will help to make things easier soon… for more infomation see here Testing the next release of MIT App Inventor (nb187) - News/Announcements - MIT App Inventor Community

Taifun

5 Likes

Thanks @Taifun I will surely change them.

1 Like

Congratz Great Extension…

1 Like

Super​:+1::+1::+1::+1::+1:

1 Like

This looks amazing. I might need it for my next game.

1 Like

Great Work

Great!, could you do this for Arrangement?

1 Like

Thank you soo much for this extension.
(ur just made a perfect extension for me rn :stuck_out_tongue_winking_eye:)

beautiful work :heart:

how can i crop screen background image using this extension

Thanks​:ok_hand::+1::heart::heart:

does it work with any arrangement background images.

Please, support to Vertical/Horizontal arrangements

3 Likes

Is this component Work at recycler?

Yes it will work on recycler.