相机视图隐藏 TabView

Question

我实现了一个简单的相机视图：

import SwiftUI
import AVFoundation

struct CameraView: View {
    @StateObject var model = CameraModel()
    var body: some View {
        CameraPreview(camera: model).ignoresSafeArea().onAppear() {
            model.check()
        }
    }
}

struct CameraPreview: UIViewRepresentable {
    @ObservedObject var camera: CameraModel
    
    func makeUIView(context: Context) -> some UIView {
        let view = UIView(frame: UIScreen.main.bounds)
        camera.preview = AVCaptureVideoPreviewLayer(session: camera.session)
        camera.preview.frame = view.frame
        camera.preview.videoGravity = AVLayerVideoGravity.resizeAspectFill
        view.layer.addSublayer(camera.preview)
        camera.session.startRunning()
        return view
    }
    
    func updateUIView(_ uiView: UIViewType, context: Context) {
    }
}

struct CameraView_Previews: PreviewProvider {
    static var previews: some View {
        CameraView()
    }
}

class CameraModel: ObservableObject {
    @Published var session = AVCaptureSession()
    @Published var alert = false
    @Published var preview: AVCaptureVideoPreviewLayer!
    
    func check() {
        switch AVCaptureDevice.authorizationStatus(for: .video) {
        case .authorized:
            setUp()
            break
        case .notDetermined:
            AVCaptureDevice.requestAccess(for: .video) { (status) in
                if status {
                    self.setUp()
                }
            }
            break
        case .denied:
            self.alert.toggle()
            break
        default:
            break
        }
    }
    
    func setUp() {
        do {
            self.session.beginConfiguration()
            let device = AVCaptureDevice.default(.builtInDualCamera, for: .video, position: .back)
            let input = try AVCaptureDeviceInput(device: device!)
            
            if self.session.canAddInput(input) {
                self.session.addInput(input)
            }
            
            self.session.commitConfiguration()
        }
        catch {
            print(error.localizedDescription)
        }
    }
}

并在TabView（根层）中显示为选项卡：

import SwiftUI

struct ContentView: View {
    var body: some View {
        TabView {
            HomeView()
                 .tabItem {
                     Image("HomeIcon").renderingMode(.template)
                    Text("Home")
                 }
            CameraView()
                 .tabItem {
                    Image("MapMarkerRadiusIcon").renderingMode(.template)
                    Text("Camera")
                  }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

不幸的是，CameraView() 覆盖了底部标签栏：

看起来还好吗？不幸的是，没有...当我制作屏幕截图或要隐藏应用程序时，它会显示未选择的图标。当应用程序刚刚启动并打开 Camera 选项卡时，它看起来如下：

如何修复这个错误？我需要标签栏始终位于顶部（如第一个屏幕截图）

Answer 1

如果您想在相机视图上查看所有选项卡，只有一个解决方法，但它与您在第一个屏幕截图中显示的内容不匹配。

要查看所有选项卡，只需在 CameraPreview(camera: model) 正下方添加 safeAreaInset(edge:alignment:spacing:_:) 修饰符并将 ignoresSafeArea 设置为 .top。

完整的示例代码如下：

CameraPreview(camera: model)
    .safeAreaInset(edge: .bottom, alignment: .center, spacing: 0) {
        Color.clear
            .frame(height: 0)
            .background(Material.bar)
    }
    .ignoresSafeArea(.all, edges: .top)

结果：

希望它能拯救你。

相机视图隐藏 TabView

Camera view hides TabView

ios

swift

swiftui

ios-camera