如何使用 UiActivityIndi​​cator 正确设置自定义背景视图

Question

我的应用正在使用 WKWebView 加载我的网站。我需要一个带有自定义深灰色背景视图的 UiActivityIndi​​cator，因为当 UIActivityIndi​​cator 与我的网站内容混合时可能难以发现。之前，我跟随https://coderwall.com/p/su1t1a/ios-customized-activity-indicator-with-swift 以编程方式创建指标。但是，本教程使用默认白色，而我的是大白色和自定义橙色。我只需要一个在backgroundView 内带有指示器的backgroundView。它以某种方式工作，直到我注意到指示器不在那个中心并且它向左上角跑了一点。请看这张图片，

这在我的 iPhone 5 等上非常明显。所以，我使用了另一种使用自动布局的方法。背景视图仍然无法正常工作。这是我的自动布局设置

这是我的编程部分。

    loadingView.frame = CGRect(x: 0, y: 0, width: 60, height: 60)
    loadingView.center = self.view.center
    loadingView.backgroundColor = UIColor(red:211/255,green:211/255,blue:211/255, alpha: 1)
    loadingView.clipsToBounds = true
    loadingView.layer.cornerRadius = 10

    loadingIndicator.frame = CGRect(x: 0, y: 0, width: 30, height: 30)
    loadingIndicator.isOpaque = false
    loadingIndicator.center = CGPoint(x: loadingView.frame.size.width / 2.0, y: loadingView.frame.size.height / 2.0)
    loadingIndicator.backgroundColor = UIColor.gray
    loadingIndicator.activityIndicatorViewStyle = UIActivityIndicatorViewStyle.whiteLarge
    loadingIndicator.color = UIColor(red:232/255,green:126/255,blue:4/255,alpha:1.0)
    loadingIndicator.hidesWhenStopped = true
    loadingView.addSubview(loadingIndicator)
    self.view.addSubview(loadingView)

我更喜欢使用自动布局。

Answer 1

您的自动布局设置和您尝试的代码都没有问题。
在 UIActivityIndicatorView 上设置自定义颜色时，偏离中心的问题实际上似乎是 iOS 错误。

你可以自己看看。

• 拖一个基本的UIActivityIndicatorView
• 设置背景颜色

• 将其样式设置为“大白”
  

• 现在设置颜色
  

当样式为White 或Gray 时不会发生这种情况

---

在 Xcode 9.3 Storyboard 以及带调试的模拟器中对其进行了测试 > 颜色混合图层 - 开启

Answer 2

尝试更改此代码

let loadingView = UIView()
        let loadingIndicator = UIActivityIndicatorView()
        loadingView.frame = CGRect(x: 0, y: 0, width: 60, height: 60)
        loadingView.center = self.view.center
        loadingView.backgroundColor = UIColor(red:211/255,green:211/255,blue:211/255, alpha: 1)
        loadingView.clipsToBounds = true
        loadingView.layer.cornerRadius = 10

        loadingIndicator.frame = CGRect(x: 0, y: 0, width: 37, height: 37)
                loadingIndicator.isOpaque = false
        loadingIndicator.center = CGPoint(x: loadingView.bounds.size.width / 2, y: loadingView.bounds.size.height / 2)
                loadingIndicator.backgroundColor = UIColor.gray
        loadingIndicator.activityIndicatorViewStyle = UIActivityIndicatorViewStyle.whiteLarge
            loadingIndicator.color = UIColor(red:232/255,green:126/255,blue:4/255,alpha:1.0)
        loadingIndicator.hidesWhenStopped = true
        loadingView.addSubview(loadingIndicator)

        loadingIndicator.tag = 500
        for subView in loadingView.subviews{
            if subView.tag == 500{
                print(subView.frame)
                print("Bounds", subView.bounds)
            }
        }
        loadingIndicator.startAnimating()
        self.view.addSubview(loadingView)

由于指标视图的样式是whiteLarge，默认为37，所以更改并检查。

对于自动布局：

1. 以 60*60 的宽度和高度拖动 UIView。（为您的超级视图指定宽度、高度、水平中心、垂直中心。）
2. 将指示器视图拖到您的 UIView 中。（为您的视图设置水平中心，垂直中心。）
3. 选择指示器视图设置样式为白色大并检查其框架。（默认为 37，其他样式为 20）。
4. 如下图所示设置约束。