How to make an escape game using swiftUI part 4

About animation

swiftUI has a rich mechanism for expressing animation.
Imagine when you need to animate. In this section, we will create an animated expression with two different impressions to be used when switching screens. First, we said that skeltonUI is a file for opening and ending. Since no other View is called in this file, it supports full animation. You should make an effort to explain the player's situation and how it happened with animations to help them understand your game's world.
You can use the VIewModify mechanism to add or remove animations at any time. Modify can be customized and separated into modules. You can customize the modifiers and separate them into modules, which will improve the visibility of your code.
In this example, we will animate the following two sample images.

import SwiftUI

struct AnimeView: View {
    @State private var flag = false
    var body: some View {
        VStack {
            if flag {
                Image("littelgirl")
                    .resizable()
                    .aspectRatio(contentMode: .fill)
                    .edgesIgnoringSafeArea(.all)
                    .transition(.PopMan)  // add custom Modifier
            }

            Button("people event") {
                withAnimation {
                    self.flag.toggle()
                }
            }
        }
    }
}


struct SlowAnimeView: View {
    @State private var flag = false
    var body: some View {
        VStack {
            if flag {
                Image("woman")
                    .resizable()
                    .aspectRatio(contentMode: .fill)
                    .edgesIgnoringSafeArea(.all)

            }

            Button("people event") {
                withAnimation(.linear(duration: 3.0)) {
                    self.flag.toggle()
                }
            }
        }
    }
}



// Custom Modifier
struct PopManModifier: ViewModifier {
    let size: CGFloat
    let degrees: Double
    func body(content: Content) -> some View {
        content
            .scaleEffect(size)
            .rotationEffect(.degrees(degrees))
    }
}

// extension AnyTransition
extension AnyTransition {
    static var PopMan: AnyTransition {
        AnyTransition.modifier(
            active: PopManModifier(size: 0, degrees: -360),
            identity: PopManModifier(size: 1, degrees: 0)
        )
    }
}

We will compare them without and with this. Comparing the two images, the latter gives the impression that the person is more important than the former. The envelope held by the woman with the bobbed hair doesn't contain much, while the basket held by the girl is presumably hiding an important item. Animation expression is a deep topic, not only in games, so any further effort will be put into individual efforts.

What is debug mode?

In order to make it easier to see, each part has been colored lightly. This is called debug mode. If you remove this, it make the layer transparent, game can turn to be in production mode. It would be cool if we could put all this together in a Utility, and when the time came to switch modes, just by changing a single toggle variable, Bool.

The final product

By coding up to this point, we think we have acquired the minimum methodology required to create an escape game. From here on, it is time to demonstrate your individual ideas.
For your reference, here is a game I made.
However, you may need to be a little more creative to release it to the App Store.

Finally

All this articles was a very quick explanation. There is a lot of code that I haven't written yet. Also, I think the coding was a bit exaggerated for future enhancements. For example, the model types are too large and could be made more concise. In terms of data binding, there are a few areas that need to be reconsidered. There are also some trivial views that should be lumped together. If any of the readers of this article have already developed an escape game individually, please give me your opinion. Also, if you are genuinely skilled in swiftUI, please give me your opinion. I'm trying to figure out the story and puzzle of the game myself.

Also, in terms of functionality, the game should be able to be saved for stage data persistence to avoid irritating the player. This could be done using IOS technology features such as core data. I don't have the time to do that right now.

For my personal taste, the game is entirely in black and white. In fact, all images were created using macdraw pro from the mac9 era. The sample images are all from the old mac era. If you have a mac that can run the classic environment, you can go to the Macintosh Repository and download many of the privately developed games, including the ones shown here. Don't forget to donate when you do so.

Again, the most important thing in an escape game is not the features or the efficient code, but the puzzle solving. This is where the personality of the actual game is reflected. There is no such thing as a design pattern here. Design patterns are only for maintainability of the code, but if most of the development is done by individuals, they are not so important. This genre is not for the up-and-coming data scientist who joins Google, but for the detective novel-addicted coding geek.
If you're reading this, join me in escaping the boredom of the room by heading to this post-Covid19 world.

https://github.com/UD46/HyperEscape/tree/main/dsgame