Skip to content

SwiftUI: Scale Effect

The scale effect is used to make a content either larger or smaller. You will be able to find so much more you can do with scale effect and you will just be as amazed as I am when I found out what it can do.

Scales this view’s rendered output by the given amount in both the horizontal and vertical directions, relative to an anchor point.

Apple Documentation

In this tutorial, you’ll learn what is Scale Effect in SwiftUI. You’ll learn:

  • How to use Scale Effect.

Prerequisites

To follow along this tutorial, you’ll need some basic knowledge in:

  • A basic familiarity with Swift.
  • At least Xcode 11

Scale Effect

You can choose to either scale a Text or even Image but here you will scale an image with the following code.

The first image is an example of scale effect of 1.0 and the second image is an example of scale effect of 3.0

To take things further, you can even scale using x and y axis. With this, you can either tweak one side or both side.

Scaling on both x and y.

Scaling only y.

Scaling only x.

By using negative number, you will be able to flip it either vertically or horizontally.

This would flip it horizontally.

This would flip it vertically.

Scaling usually takes place on the center point but you can tweak it to either take place in different point such by using anchor.

By scaling the effect and setting it at bottom right, the image should appear at the bottom right.

Where to go From Here

If you feel like you are ready to take on more challenges, feel free to check out some other tutorials that we have created:

Published inSwiftUI

Be First to Comment

Leave a Reply

Your email address will not be published. Required fields are marked *

Copyright © DaddyCoding 2017-2020