coiai Logo
Featured

【SwiftUI】カメラのフロントとバックの切り替え

SwiftUIを使ったカメラの実装で、フロントカメラとバックカメラの切り替えについての記事です。

他サイトにもいろんな方法は乗っていると思いますが。自分のメモように残しておこうと思います。

トグルボタンの設定

カメラのアイコンのついたボタンです。これを押すとカメラが切り替わるようにしたいと思います。

Button(action: {
    camera.switchCamera()
}) {
    Image(systemName: "arrow.triangle.2.circlepath.camera")
        .font(.largeTitle)
        .padding()
}
.background(Color.white.opacity(0.7))
.clipShape(Circle())

機能

前回の記事に以下コードを追記すればOKです。

func switchCamera() {
        currentCameraPosition = currentCameraPosition == .front ? .back : .front
        updateCameraPosition()
    }

全コード

特に出し惜しみする必要もないので、ここまでのコードを下に全て載せます。

コピペしてこれが動かなかったら、この記事がもう古くなったことでしょう。

import SwiftUI
import AVFoundation

struct CameraView: View {
    @StateObject var camera = CameraViewModel()

    var body: some View {
        ZStack {
            CameraControll(camera: camera)
                .edgesIgnoringSafeArea(.all)
            VStack {
                Spacer()
                Button(action: {
                    camera.switchCamera()
                }) {
                    Image(systemName: "arrow.triangle.2.circlepath.camera")
                        .font(.largeTitle)
                        .padding()
                }
                .background(Color.white.opacity(0.7))
                .clipShape(Circle())
            }
        }
    }
}

struct CameraControll: UIViewRepresentable {
    @ObservedObject var camera: CameraViewModel

    func makeUIView(context: Context) -> UIView { camera }
    func updateUIView(_ uiView: UIViewType, context: Context) {}
}

class CameraViewModel: UIView, ObservableObject {
    var previewLayer: AVCaptureVideoPreviewLayer?
    var currentCameraPosition: AVCaptureDevice.Position = .front
    var session = AVCaptureSession()

    override func layoutSubviews() {
        super.layoutSubviews()
        _ = initCaptureSession
        previewLayer?.frame = bounds
        fixCameraOrientation()
    }

    lazy var initCaptureSession: Void = {
        updateCameraPosition()
    }()

    private func updateCameraPosition() {
        session.inputs.forEach { session.removeInput($0) }

        guard let device = AVCaptureDevice.DiscoverySession(deviceTypes: [.builtInWideAngleCamera],
                                                            mediaType: .video,
                                                            position: .unspecified)
                .devices.first(where: { $0.position == currentCameraPosition }),
              let input = try? AVCaptureDeviceInput(device: device) else { return }

        session.addInput(input)

        if previewLayer == nil {
            let previewLayer = AVCaptureVideoPreviewLayer(session: session)
            layer.insertSublayer(previewLayer, at: 0)
            self.previewLayer = previewLayer
        }

        session.startRunning()
    }

    func switchCamera() {
        currentCameraPosition = currentCameraPosition == .front ? .back : .front
        updateCameraPosition()
    }

    private func fixCameraOrientation() {
        let rotation: CGFloat = CGFloat(getDeviceOrientation().rawValue) * 90
        previewLayer?.transform = CATransform3DMakeRotation(rotation / 180 * CGFloat.pi, 0, 0, 1)
    }

    private func getDeviceOrientation() -> Orientation {
        guard let interfaceOrientation = UIApplication.shared.windows.first(where: { $0.isKeyWindow })?.windowScene?.interfaceOrientation else {
            return .right
        }
        switch interfaceOrientation {
        case .landscapeLeft:
            return .left
        case .landscapeRight:
            return .right
        case .portrait:
            return .down
        case .portraitUpsideDown:
            return .up
        default:
            return .right
        }
    }
}

enum Orientation: Int {
    case right = -1, down = 0, left = 1, up = 2
}

#Preview {
    CameraView()
}
投稿日: 2023年12月24日
カテゴリ: 未分類
タグ:
coiai

coiai

この記事もおすすめ

ポッドキャストを取った後Auditionですべきこと

ポッドキャストを取った後Auditionですべきこと

この記事はポッドキャストなどの音声コンテンツを取った後にAuditionで編集する方法について解説しています。 環境 やること 基本的に以下の4つの工程をすると、かなりクオリティアップにつながります! ノイズリダクション 無音部分を選択します。開始地点をi, 終わりをo キーを押すと選択できます。選択できたらエフェクト→ノイズリダクション/リストア→ノイズプリントをキャプチャを押します。 続いて、全体を選択します。cmd, a で全選択になります。エフェクト→ノイズリダクション/リストア→ノイズリダクションを選択します。 以下のようなパネルが表示されうので、ノイズのみをきたりして、削減ちを調整して、良い感じになったら適応ボタンを押します。 シングルバンドコンプレッサ 左のパネルのエフェクトトラックから▶️ボタンを押し、振幅と圧縮→シングルバンドコンプレッッサを選択します。 選択すると下記のようなパネルが開きます。それぞれ、 といった意味があります。設定値は下記画像のようにしています。 設定がめんどくさい場合はプリセットからラジオレベラーを選択してください。 EQ(声をクリアにする) パラメトリックイコライザーを使用します。エフェクト→フィルターとイコライザ→パラメトリックイコライザーを選択します。 私の場合は下記のように設定しています。 無音カット エフェクト→診断→無音をカットをすると左パネルに診断が表示されます。 効果を無音を削除、プリセットをポッドキャストにするとちょうどよくなると思います。設定したら、スキャンボタンを教えて、全て削除で無音がカットされます。 かなりカットされてしまうので、短いCM等に使うのはありかなという感じです。 参考 Adobe 無音カット https://helpx.adobe.com/jp/audition/using/strip-silence.html

MetaStore コンテンツ型のアプリ内課金を実装する

MetaStore コンテンツ型のアプリ内課金を実装する

MetaStoreのコンテンツ型のアプリ内課金を実装する方法についてです。 コンテンツを追加する 右上のアドオンを作成ボタンを押す。 アドオンタイプ 一度購入したら、それ以降は購入しない設定は耐久型を選びます。アプリ内のコインや石など、消耗品は消耗品を選びます。 価格設定 価格設定タブに進むとコンテンツの価格を設定できます。有料のコンテンツをまだ登録したことない場合は支払い情報の設定が住んでいないはずなので、支払い情報の設定が先に必要になります。 DUC データユーズチェックアップ 左メニューの必要条件の中のデータ使用状況の確認を開きます。 例えばIAPでユーザー認識が必要な場合は User ID, ユーザー名が必要な場合は User Profile の追加ボタンを押します。 何に使うかの用途と説明が求められるのでそこに使用用途を記述してください。 ここまで出来たらリクエストを送信ボタンを押します。 このようにデータの取り扱いについて質問されるので答えてください。英語で書いてあるので、なんとなく何が書いてあるか順番にさらっと説明します。 データの使用状況の確認 左サイドバーから必要条件⇒データ使用状況の確認をクリックします。 これが設定されていないと以下の文言のポップアップが表示されます。 読んでくださった方へ 株式会社coiaiでは、Quest向け、PCVR、Vision OS向けの開発も得意としています。新規開発ももちろん、開発途中でメンバーが必要といった場合でも請け負えますので、ご相談ください!

この記事を書いた会社

株式会社coiaiは、「想像できることを美しく実現」を掲げ、XR・Web・アプリ・システム開発およびDX支援を行う会社です。 創業2022年、東京都練馬区に本社を置き、要件のヒアリングからPoC(概念実証)、本番運用まで一貫して伴走します。 まずはお気軽にご相談ください。

商号株式会社 coiai創業2022年1月設立2025年1月23日資本金1,500,000円(設立時点)本社所在地東京都練馬区関町北 3-6-9代表者代表取締役 竹村 啓佑 / 代表取締役 服部 陽良

主なご相談内容

会社概要・役員紹介を見る

詳しい会社情報は会社概要ページでご覧いただけます。

資料請求・無料相談

導入要件のヒアリングからPoC、本番運用まで伴走します。まずはお気軽にご相談ください。

お問い合わせの前に 個人情報保護方針 をご確認ください。