Scribd
Upload
2 views4 pages

Scaled Shape

The document provides an overview of creating and manipulating shapes in SwiftUI, specifically using the ScaledShape structure to scale shapes like circles and rectangles. It explains how to define scale factors and anchor points, and illustrates the usage of scenes in SwiftUI applications, including primitive and custom scenes. Additionally, it discusses modifiers and how to access scene status using the EnvironmentValues/scenePhase property.

Uploaded by

jon.moses2000
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
2 views4 pages

Scaled Shape

The document provides an overview of creating and manipulating shapes in SwiftUI, specifically using the ScaledShape structure to scale shapes like circles and rectangles. It explains how to define scale factors and anchor points, and illustrates the usage of scenes in SwiftUI applications, including primitive and custom scenes. Additionally, it discusses modifiers and how to access scene status using the EnvironmentValues/scenePhase property.

Uploaded by

jon.moses2000
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 4

The original shape, before the scale.

```
struct DiskView: View {
var body: some View {
let scale = CGSize(width: 0.5, height: 0.5)
let scaledShape = ScaledShape(shape: Circle(), scale: scale)

return ZStack {
scaledShape
.shape.fill(Color.red)
scaledShape
.opacity(0.7)
}
}
}
```

![A screenshot displaying a large red circle in the center of the screen
with a smaller darker circle overlaid. The smaller circle is a scaled down
version of the larger one, rendered by the scaledShape initializer. By
calling on the shape property of the scaledShape, the original sized circle is
accessible in the ZStack.](scaledshape-2.png)
The scale factor.

```
struct ContentView: View {
var body: some View {
let scale = CGSize(width: 0.5, height: 0.5)
let scaledShape = ScaledShape(shape: Circle(), scale: scale)

return VStack {
Text("↔️scaled by \(scaledShape.scale.width)")
Text("↕️scaled by \(scaledShape.scale.height)")
scaledShape
}
}
}
```

![A screenshot displaying a black filled circle in the center of the


screen with text at the top of the screen that describes the scale
factors in both dimensions. The scale factors are retrieved by the
scale property of the scaledShape object.](scaledshape-scale.png)
The unit point to scale the view from.

```
struct ContentView: View {
var body: some View {
let scale = CGSize(width: 0.5, height: 0.5)
let scaledShape = ScaledShape(shape: Circle(), scale: scale)
let anchor = scaledShape.anchor

return VStack {
Text("Anchored at (\(anchor.x), \(anchor.y)) ⚓️")
scaledShape
}
}
}
```

![A screenshot displaying a black filled circle in the center of the


screen with text at the top of the screen that describes the location of
anchor in both dimensions. The anchor location is retrieved by the
anchor property of the scaledShape object. In this case the anchor is
located at the center of the screen, so the reading is (0.500000,0.500000).]
(scaledshape-anchor.png)

Creates a scaled shape from an original shape, a scale factor, and an anchor
point.

```
struct HugeShapeView: View {
var body: some View {
ScaledShape(shape: Rectangle(),
scale: CGSize(width: 0.5, height: 0.5),
anchor: .center)
.border(Color.orange)
.padding()
}
}
```

![A screenshot displaying an orange rectangular border near the edges of


the screen. Inset within this border is a black filled rectangle that is
scaled down to half the size of its surrounding border by applying a 0.5 scale
in the scaledShape initializer. The anchor is also specified by the
initializer
to ensure the shape is scaled from the center of the screen.](scaledshape-
init.png)

- Parameters:
- shape: The shape to be scaled.
- scale: The factor to scale the shape.
- anchor: The unit point to scale the shape from. Defaults to the center.
Describes this shape as a path within a rectangular frame of reference.

- Parameter rect: The frame of reference for describing this shape.

- Returns: A path that describes this shape.


The type defining the data to animate.
The data to animate.
The type of view representing the body of this view.

When you create a custom view, Swift infers this type from your
implementation of the required `body` property.
This protocol is used to create different content areas on the screen.

On-screen ``Scene``s are the building blocks of any app built entirely in SwiftUI.
They can look
different depending on the platform the app is running on. For example, in iOS,
the screen usually
only displays one scene at a time. In macOS, every window in an app might be a
different scene.

Scenes can either be custom, or one of the primitives like ``WindowGroup`` or


``DocumentGroup``.
### Creating a Scene

#### Using primitive Scenes

Primitive scenes like `WindowGroup` can go directly in the body of your ``App``.

@main
struct SuperSimpleApp: App {
var body: some Scene {
WindowGroup {
Text("This is an entire app! 🙌")
}
}
}

![A white view that displays the text ""This is an entire app!
🙌""](https://bananadocs-documentation-assets.s3-us-west-2.amazonaws.com/Scene-
example-1.png)

#### Using custom Scenes

Just like how custom ``View``s are made out of a `var body` of smaller ``View``s,
custom ``Scene``s are made out of a `var body` of smaller ``Scene``s.

@main
struct MacCompatibleApp: App {
var body: some Scene {
CustomScene()
}

struct CustomScene: Scene {


var body: some Scene {
WindowGroup {
Text("This is a mac-compatible app! 💻")
}

#if os(macOS)
Settings {
SettingsView()
}
#endif
}
}

![A white view that displays the text "This is a mac-compatible app!
💻"](https://bananadocs-documentation-assets.s3-us-west-2.amazonaws.com/Scene-
example-2.png)

### Modifiers

Just like how ``View``s have a bunch of custom modifiers that work right out of
the box,
``Scene`` provides default implementations of many useful modifiers. These can be
used to do things
like adding macOS commands, changing the toolbar, and adding support for app
storage.
[scene-phase ->]
### Getting Scene Status
The ``EnvironmentValues/scenePhase`` environment value can easily be read in a
scene
to respond to whether the scene is active or in another state. It returns an
enumeration of type
``ScenePhase``.

struct StateAdaptingScene: Scene {


@Environment(\.scenePhase) private var scenePhase
var body: some Scene {
WindowGroup {
Text(scenePhase == .active ? "Active!" : "Inactive")
}
}
}

[<-]

You might also like