swift Image from assets和from bundle之间的不同动画行为

tp5buhyn  于 12个月前  发布在  Swift
关注(0)|答案(1)|浏览(111)

我想要一个气球永远从底部飞到顶部。每飞X开始和duratoin是不同的。在第一个版本中,气球图像在项目下的文件夹中。我确保负载是好的('图像(ui图像:uiImage“),因为我已经检查了图像渲染良好。然而,使用withAnimation只会导致淡入/淡出,但不会移动。然后我在图像中添加了边框,有趣的是,图像本身仍然淡入/淡出,但寄宿生正在飞行.在第二个版本中,气球图像从资产加载,一切工作正常。下面是代码

struct BalloonView: View {
    @State private var balloonX: CGFloat = UIScreen.main.bounds.width / 2
    @State private var balloonY: CGFloat = 0

    private let timer = Timer.publish(every: 1, on: .main, in: .common).autoconnect()
    
    var body: some View {
        Image("ballon-blue-muti") // works well
//        BalloonView.loadAirBalloons()[0]  // Image are fade in/out, but board works
            .resizable()
            .scaledToFit()
            .frame(width: 50)
            .border(.black)
            .position(x: balloonX, y: balloonY)
            .onAppear {
                startBalloonAnimation(screenHeight: UIScreen.main.bounds.height)
            }
            .onReceive(timer) { _ in
                print("balloonX: \(balloonX), balloonY: \(balloonY)")
            }
    }

    private func startBalloonAnimation(screenHeight: CGFloat) {
        let screenWidth = UIScreen.main.bounds.width

        balloonX = CGFloat.random(in: 0...screenWidth)
        balloonY = screenHeight

        let duration = Double.random(in: 5...10)
        let endX = CGFloat.random(in: 0...screenWidth)

        withAnimation(Animation.linear(duration: duration)) {
            balloonY = screenHeight / 2
            balloonX = endX
        }

        DispatchQueue.main.asyncAfter(deadline: .now() + duration) {
            balloonY = screenHeight
            startBalloonAnimation(screenHeight: screenHeight)
        }
    }

    static private func loadAirBalloons() -> [Image] {
        if let path = Bundle.main.resourcePath {
            let imageFolder = path.appending("/images/balloons")
            do {
                let fileNames = try FileManager.default.contentsOfDirectory(atPath: imageFolder)
                return fileNames.compactMap { fileName in
                    if let uiImage = UIImage(contentsOfFile: "\(imageFolder)/\(fileName)") {
                        return Image(uiImage: uiImage)
                    }
                    return nil
                }
            } catch {
                print(error)
            }
        }
        return []
    }
}

struct Background: View {
    var body: some View {
        ZStack {
            BalloonView()
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .background(Color.pink)
    }
}

字符串
我使用文件夹,因为我不想添加新的代码时,我添加新的图像.似乎只有捆绑工程这一点。所以,如果仍然使用图像(uiImage:uiImage)的方法,如何修复它?为什么有不同?
正如我所写的,我从资产而不是Image(uiImage: uiImage)加载图像

t2a7ltrp

t2a7ltrp1#

若要解决使用Image(uiImage:uiImage)从项目下的文件夹加载图像时的问题,可以使用Image视图的resizable()和scaledToFit()修改器,并确保图像正确定位。此外,可以使用withAnimation块来设置图像移动的动画。

struct BalloonView: View {
    // ... (other properties and methods remain the same)

    var body: some View {
        Image(uiImage: UIImage(named: "balloon-blue-muti")!) // Load image from bundle
            .resizable()
            .scaledToFit()
            .frame(width: 50)
            .position(x: balloonX, y: balloonY)
            .onAppear {
                startBalloonAnimation(screenHeight: UIScreen.main.bounds.height)
            }
            .onReceive(timer) { _ in
                print("balloonX: \(balloonX), balloonY: \(balloonY)")
            }
    }

    // ... (other methods remain the same)
}

字符串

相关问题