是否有显示模态视图指示器的标准方法？

Question

大多数 Apple iOS 应用程序的模态内容顶部都有一个小指示器：

我试着寻找它，但我什至不知道该叫什么。

Answer 1

这是模态视图指示器

import SwiftUI

struct ModalViewIndicator: View {
    var body: some View {
        HStack {
            Spacer()
            Image(systemName: "minus")
                .imageScale(.large)
                .font(Font.title.weight(.heavy))
                .foregroundColor(Color(UIColor.tertiaryLabel))
            Spacer()
        }.padding(4)
    }
}

struct ModalViewIndicator_Previews: PreviewProvider {
    static var previews: some View {
        Text("ModalViewIndicator")
            .sheet(isPresented: .constant(true)) {
                VStack {
                    ModalViewIndicator()
                    GeometryReader { geometry in
                        Image(systemName: "sun.dust.fill")
                            .resizable()
                            .frame(
                                width: geometry.size.width/2,
                                height: geometry.size.width/2,
                                alignment: .center
                        )
                    }
                }
        }
    }
}

Answer 2

也许这里更好的方法是简单地使用矩形：

HStack {
  Spacer()
  RoundedRectangle(cornerRadius: CGFloat(5.0) / 2.0)
    .frame(width: 40, height: 5)
    .foregroundColor(Color(UIColor.tertiaryLabel))
  Spacer()
}.padding(4)

Answer 3

我在 SwiftUI 中看到了几个很好的答案，并且由于这个问题也有一个 UIKit 标签，我想我可能会添加一些想法来为 UIKit 解决这个问题。

首先要考虑的是您的视图层次结构，指示器是否将成为导航栏的一部分，或者您的视图可能没有导航栏 - 因此您可能需要一些代码来找到正确的视图将此指标添加到。

在我的场景中，我需要一个导航栏，因此我的视图控制器位于导航控制器内，但您可以直接在视图控制器内执行相同操作：

1: 子类化导航控制器

这是可选的，但最好将所有这些自定义抽象到导航控制器中。

我检查一下是否显示了 NavigationController。这可能不是最好的检查方法，但由于这不是问题的一部分，请参阅 these answers 检查视图控制器是否以模态方式呈现

class CustomNavigationController: UINavigationController {
  override func viewWillAppear(_ animated: Bool) {
    super.viewWillAppear(animated)
    
    // this checks if the ViewController is being presented
    if presentingViewController != nil {
      addModalIndicator()
    }
  }

  private func addModalIndicator() {
    let indicator = UIView()
    indicator.backgroundColor = .tertiaryLabel
    let indicatorSize = CGSize(width: 30, height: 5)
    let indicatorX = (navigationBar.frame.width - indicatorSize.width) / CGFloat(2)
    indicator.frame = CGRect(origin: CGPoint(x: indicatorX, y: 8), size: indicatorSize)
    indicator.layer.cornerRadius = indicatorSize.height / CGFloat(2.0)
    navigationBar.addSubview(indicator)
  }
}

2：呈现自定义导航控制器

let someVC = UIViewController()
let customNavigationController = CustomNavigationController()
customNavigationController.setViewControllers([stationsVC], animated: false)
present(playerNavigationController, animated: true) { }

3：这将产生以下结果

您可能需要根据您的场景/视图控制器层次结构在此处更改一些逻辑，但希望这能给您一些想法。

是否有显示模态视图指示器的标准方法？

Is there a standard way to display a modal view indicator?

uikit

modalviewcontroller

ios