SwiftUIのCAEmitterLayerでアニメーションを作成するにはどうすればよいですか?

Ufuk Kosker

このコードをに変換するにはどうすればよいですかSwiftUI雪の効果です。CAEmitterLayerを使用しましたが、SwfitUIでの使用方法がわかりません。SwiftUIにはaddSublayerはありません。UIHostingControllerを使用せずにこのコードを実行することは可能ですか?

let size = CGSize(width: 824.0, height: 1112.0)
let host = UIView(frame: CGRect(x: 0.0, y: 0.0, width: size.width, height: size.height))
self.view.addSubview(host)

let particlesLayer = CAEmitterLayer()
particlesLayer.frame = CGRect(x: 0.0, y: 0.0, width: size.width, height: size.height)

host.layer.addSublayer(particlesLayer)
host.layer.masksToBounds = true

particlesLayer.backgroundColor = UIColor(red: 0.0/255.0, green: 0.0/255.0, blue: 0.0/255.0, alpha: 1.0).cgColor
particlesLayer.emitterShape = .circle
particlesLayer.emitterPosition = CGPoint(x: 509.4, y: 707.7)
particlesLayer.emitterSize = CGSize(width: 1648.0, height: 1112.0)
particlesLayer.emitterMode = .surface
particlesLayer.renderMode = .oldestLast



                let image1 = UIImage(named: "logo")?.cgImage

                let cell1 = CAEmitterCell()
                cell1.contents = image1
                cell1.name = "Snow"
                cell1.birthRate = 92.0
                cell1.lifetime = 20.0
                cell1.velocity = 59.0
                cell1.velocityRange = -15.0
                cell1.xAcceleration = 5.0
                cell1.yAcceleration = 40.0
                cell1.emissionRange = 180.0 * (.pi / 180.0)
                cell1.spin = -28.6 * (.pi / 180.0)
                cell1.spinRange = 57.2 * (.pi / 180.0)
                cell1.scale = 0.06
                cell1.scaleRange = 0.3
                cell1.color = UIColor(red: 255.0/255.0, green: 255.0/255.0, blue: 255.0/255.0, alpha: 1.0).cgColor

                particlesLayer.emitterCells = [cell1]
彼の気性

これが解決策です。Xcode 11.4 / iOS13.4でテスト済み

デモ

struct EmitterView: UIViewRepresentable {
    func makeUIView(context: Context) -> UIView {
        let size = CGSize(width: 824.0, height: 1112.0)
        let host = UIView(frame: CGRect(x: 0.0, y: 0.0, width: size.width, height: size.height))

        let particlesLayer = CAEmitterLayer()
        particlesLayer.frame = CGRect(x: 0.0, y: 0.0, width: size.width, height: size.height)

        host.layer.addSublayer(particlesLayer)
        host.layer.masksToBounds = true

        particlesLayer.backgroundColor = UIColor(red: 0.0/255.0, green: 0.0/255.0, blue: 0.0/255.0, alpha: 1.0).cgColor
        particlesLayer.emitterShape = .circle
        particlesLayer.emitterPosition = CGPoint(x: 509.4, y: 707.7)
        particlesLayer.emitterSize = CGSize(width: 1648.0, height: 1112.0)
        particlesLayer.emitterMode = .surface
        particlesLayer.renderMode = .oldestLast



        let image1 = UIImage(named: "logo")?.cgImage

        let cell1 = CAEmitterCell()
        cell1.contents = image1
        cell1.name = "Snow"
        cell1.birthRate = 92.0
        cell1.lifetime = 20.0
        cell1.velocity = 59.0
        cell1.velocityRange = -15.0
        cell1.xAcceleration = 5.0
        cell1.yAcceleration = 40.0
        cell1.emissionRange = 180.0 * (.pi / 180.0)
        cell1.spin = -28.6 * (.pi / 180.0)
        cell1.spinRange = 57.2 * (.pi / 180.0)
        cell1.scale = 0.06
        cell1.scaleRange = 0.3
        cell1.color = UIColor(red: 255.0/255.0, green: 255.0/255.0, blue: 255.0/255.0, alpha: 1.0).cgColor

        particlesLayer.emitterCells = [cell1]
        return host
    }

    func updateUIView(_ uiView: UIView, context: Context) {
    }

    typealias UIViewType = UIView
}

struct TestEmitterLayer: View {
    var body: some View {
        EmitterView()        // << usage !!
    }
}

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

SwiftUIのCAEmitterLayerでアニメーションを作成するにはどうすればよいですか?

分類Dev

SwiftUIでアニメーションを一時停止するにはどうすればよいですか?

分類Dev

ターニングアニメーションを作成するにはどうすればよいですか?

分類Dev

iOS 10でiMessageのアニメーションとしてアニメーションを作成するにはどうすればよいですか?

分類Dev

SwiftUIの次と後ろのアニメーションを作成するにはどうすればよいですか?

分類Dev

点滅する画像アニメーションを作成するにはどうすればよいですか?

分類Dev

複数のアニメーション関数を使用してmatplotlibアニメーションを作成するにはどうすればよいですか

分類Dev

MPAndroidChartでアニメーションを作成するにはどうすればよいですか?

分類Dev

Jetpack Composeでアニメーションを作成するにはどうすればよいですか?

分類Dev

pygameで弾丸アニメーションを作成するにはどうすればよいですか?

分類Dev

SwiftでアニメーションshadowOffsetを作成するにはどうすればよいですか?

分類Dev

CSSで消去アニメーションを作成するにはどうすればよいですか?

分類Dev

アニメーション化されたToggleButtonを作成するにはどうすればよいですか?

分類Dev

UIViewバウンスアニメーションを作成するにはどうすればよいですか?

分類Dev

toRightOf / toLeftOfアニメーションを作成するにはどうすればよいですか?

分類Dev

アニメーションslide_upを作成するにはどうすればよいですか?

分類Dev

固定CSSアニメーションを作成するにはどうすればよいですか

分類Dev

UIViewPropertyAnimatorで繰り返しアニメーション化するアニメーションを作成するにはどうすればよいですか?

分類Dev

このようなアニメーションのSVGグラデーションを作成するにはどうすればよいですか?

分類Dev

別のすごいアニメーションを使用するにはどうすればよいですか

分類Dev

UITableViewの幅をアニメーションで変更するにはどうすればよいですか?

分類Dev

Rでアニメーションの速度を設定するにはどうすればよいですか?

分類Dev

ハンバーガーメニューのアニメーションを作成するにはどうすればよいですか?

分類Dev

アニメーション化されたグラデーションの内側の影を作成するにはどうすればよいですか?

分類Dev

Flutter:カスタムアニメーションのドロップダウンメニューを作成するにはどうすればよいですか?

分類Dev

滑らかなグラデーションの背景アニメーションを作成するにはどうすればよいですか?

分類Dev

FlutterでこのGIFのようなアニメーションヘッダーを作成するにはどうすればよいですか?

分類Dev

アニメーションの線形グラデーションボタンを作成するにはどうすればよいですか?

分類Dev

PopScreenアニメーションの期間を変更するにはどうすればよいですか?

Related 関連記事

  1. 1

    SwiftUIのCAEmitterLayerでアニメーションを作成するにはどうすればよいですか?

  2. 2

    SwiftUIでアニメーションを一時停止するにはどうすればよいですか?

  3. 3

    ターニングアニメーションを作成するにはどうすればよいですか?

  4. 4

    iOS 10でiMessageのアニメーションとしてアニメーションを作成するにはどうすればよいですか?

  5. 5

    SwiftUIの次と後ろのアニメーションを作成するにはどうすればよいですか?

  6. 6

    点滅する画像アニメーションを作成するにはどうすればよいですか?

  7. 7

    複数のアニメーション関数を使用してmatplotlibアニメーションを作成するにはどうすればよいですか

  8. 8

    MPAndroidChartでアニメーションを作成するにはどうすればよいですか?

  9. 9

    Jetpack Composeでアニメーションを作成するにはどうすればよいですか?

  10. 10

    pygameで弾丸アニメーションを作成するにはどうすればよいですか?

  11. 11

    SwiftでアニメーションshadowOffsetを作成するにはどうすればよいですか?

  12. 12

    CSSで消去アニメーションを作成するにはどうすればよいですか?

  13. 13

    アニメーション化されたToggleButtonを作成するにはどうすればよいですか?

  14. 14

    UIViewバウンスアニメーションを作成するにはどうすればよいですか?

  15. 15

    toRightOf / toLeftOfアニメーションを作成するにはどうすればよいですか?

  16. 16

    アニメーションslide_upを作成するにはどうすればよいですか?

  17. 17

    固定CSSアニメーションを作成するにはどうすればよいですか

  18. 18

    UIViewPropertyAnimatorで繰り返しアニメーション化するアニメーションを作成するにはどうすればよいですか?

  19. 19

    このようなアニメーションのSVGグラデーションを作成するにはどうすればよいですか?

  20. 20

    別のすごいアニメーションを使用するにはどうすればよいですか

  21. 21

    UITableViewの幅をアニメーションで変更するにはどうすればよいですか?

  22. 22

    Rでアニメーションの速度を設定するにはどうすればよいですか?

  23. 23

    ハンバーガーメニューのアニメーションを作成するにはどうすればよいですか?

  24. 24

    アニメーション化されたグラデーションの内側の影を作成するにはどうすればよいですか?

  25. 25

    Flutter:カスタムアニメーションのドロップダウンメニューを作成するにはどうすればよいですか?

  26. 26

    滑らかなグラデーションの背景アニメーションを作成するにはどうすればよいですか?

  27. 27

    FlutterでこのGIFのようなアニメーションヘッダーを作成するにはどうすればよいですか?

  28. 28

    アニメーションの線形グラデーションボタンを作成するにはどうすればよいですか?

  29. 29

    PopScreenアニメーションの期間を変更するにはどうすればよいですか?

ホットタグ

アーカイブ