Skip to content

SVGView default sizing #102

@swhitty

Description

@swhitty

It is intended that SVGView should operate as closely as possible to SwiftUI’s Image.

When loading an asset, the default behavior should be to size the view according to the intrinsic content size of the image:

Image("circle.png", bundle: .main)

SVGView("circle.svg", bundle: .main)

Currently, however, SVGView automatically stretches to fill its parent container.
To render at the SVG’s natural size, developers must explicitly add .fixedSize():

SVGView("circle.svg").fixedSize()

This is inconsistent with the Image API and unintuitive for developers expecting the same semantics.

Proposal

Change SVGView’s default behavior so that, like Image, it reports its intrinsic content size and renders at that size unless constrained by its parent.

  • Introduce a .resizable() modifier to opt into flexible sizing.
  • With .resizable(), the view should accept whatever size the parent proposes, allowing developers to compose with .aspectRatio(), .scaledToFit(), or .scaledToFill() just as they would with Image.
// Renders at intrinsic SVG size
SVGView("circle.svg")

// Fills available space, preserving aspect
SVGView("circle.svg")
    .resizable()
    .scaledToFit()

Migration

This change will be a breaking change for existing code that relied on the stretching behavior.

Code like this that currently relies on the default stretching to fill parent:

SVGView("circle.svg")
Image

Will now render at the SVG’s natural size:

Image

To preserve the old behavior, developers should update to:

SVGView("circle.svg")
 .resizable()

Impact

While this change is quite disruptive for users relying on the current behaviour, I am of the opinion that this number will be quite low, most will be using fixed sizes anyway as SVGView has only existed for 5 months.

The fix is very easy, add .resizable().

The benefits of aligning to the behaviour of Image outweighs the impact here so we will be making this change

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions