首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >iOS开发之电子木鱼实现

iOS开发之电子木鱼实现

作者头像
YungFan
发布2022-11-18 15:25:14
发布2022-11-18 15:25:14
7570
举报
文章被收录于专栏:学海无涯学海无涯

最早看到这个电子木鱼是在抖音刀叔的视频中,最近貌似在圈内火了,恰逢课上在讲多媒体编程,简单实现一个。

  • SwiftUI 搭建界面与动画。
代码语言:javascript
复制
import SwiftUI

struct ContentView: View {
    @State private var title = "功德值"
    @State private var total = 0
    @State private var once = 1
    @State private var isTapped = false

    var body: some View {
        NavigationView {
            VStack {
                if isTapped {
                    Text("\(title) + \(once) 👍")
                        .font(.title3)
                }

                Image("muyu")
                    .resizable()
                    .scaledToFit()
                    .frame(width: 200)
                    .scaleEffect(isTapped ? 0.95 : 1.0)
                    .animation(.easeInOut, value: isTapped)
            }
            .frame(maxWidth: .infinity, maxHeight: .infinity)
            .background(Color.black)
            .navigationTitle("\(title): \(total)")
            .preferredColorScheme(.dark)
            .onTapGesture {
                total += once
                withAnimation {
                    isTapped.toggle()
                    DispatchQueue.main.asyncAfter(deadline: .now() + 0.3) {
                        self.isTapped.toggle()
                    }
                }
                AudioTools.shared.playSound()
            }
        }
    }
}
  • 播放音效。
代码语言:javascript
复制
import AVFoundation

class AudioTools {
    static let shared = AudioTools()

    private init() {
    }

    func playSound() {
        var soundID: SystemSoundID = 0
        let soundURL = Bundle.main.url(forResource: "muyu.mp3", withExtension: nil)
        if let soundURL = soundURL {
            AudioServicesCreateSystemSoundID(soundURL as CFURL, &soundID)
            AudioServicesPlaySystemSound(soundID)
        }
    }
}
  • 效果。

电子木鱼效果.gif

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-11-11,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档