如何设置 iOS 进度条的恒定高度

2024-03-15 13:14:57

用恒定大小的高度设置 iOS 进度条

进度条是用户界面中常用的组件，用于向用户指示进度或完成状态。在某些情况下，保持进度条在动画期间的高度恒定非常重要。本文将介绍如何通过调整进度条的 intrinsicContentSize 属性来实现这一点。

问题

当在 iOS 中动画化进度条时，默认情况下进度条的高度会随着其长度的增加或减少而变化。这在某些场景中可能不理想，特别是当进度条需要与其他界面元素对齐或保持一致的大小时。

解决方案

要设置恒定高度的进度条，需要调整其 intrinsicContentSize 属性。intrinsicContentSize 定义了控件在没有外部约束的情况下希望占用的最小尺寸。通过设置 intrinsicContentSize 的高度为所需的值，可以强制进度条在动画期间保持该高度。

以下步骤演示了如何实现：

设置 intrinsicContentSize 属性： 在进度条的初始化方法中，设置 intrinsicContentSize 属性为所需的尺寸。例如，要设置进度条的高度为 20 点，可以使用以下代码：
```
override init(frame: CGRect) {
    super.init(frame: frame)
    self.intrinsicContentSize = CGSize(width: self.frame.width, height: 20)
}
```
实现 preferredLayoutAttributesFitting(_:) 方法： 此外，需要实现 preferredLayoutAttributesFitting(_:) 方法。该方法在布局过程中用于计算控件的首选布局属性。通过返回具有正确 intrinsicContentSize 的布局属性，可以强制进度条在动画期间保持该高度。以下代码演示了如何实现：
```
override func preferredLayoutAttributesFitting(_ layoutAttributes: UICollectionViewLayoutAttributes) -> UICollectionViewLayoutAttributes {
    let attributes = super.preferredLayoutAttributesFitting(layoutAttributes)
    attributes.frame.size.height = intrinsicContentSize.height
    return attributes
}
```
设置动画选项： 最后，在设置进度条进度时，使用 UIView.AnimationOptions.beginFromCurrentState 选项。此选项可确保动画从当前状态开始，从而防止进度条在动画过程中调整大小。以下代码演示了如何使用此选项：
```
UIView.animate(withDuration: 1, delay: 0, options: .beginFromCurrentState) {
    self.progressView.setProgress(progress, animated: true)
}
```

通过遵循这些步骤，可以创建一个在动画期间保持恒定高度的进度条。

完整代码示例

以下是一个完整的代码示例，演示了如何在 Swift 中实现恒定高度的进度条：

import UIKit

class CustomProgressView: UIProgressView {

    override init(frame: CGRect) {
        super.init(frame: frame)
        self.intrinsicContentSize = CGSize(width: self.frame.width, height: 20)
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func preferredLayoutAttributesFitting(_ layoutAttributes: UICollectionViewLayoutAttributes) -> UICollectionViewLayoutAttributes {
        let attributes = super.preferredLayoutAttributesFitting(layoutAttributes)
        attributes.frame.size.height = intrinsicContentSize.height
        return attributes
    }
}

// ...

// Set the progress bar with animation
UIView.animate(withDuration: 1, delay: 0, options: .beginFromCurrentState) {
    self.progressView.setProgress(progress, animated: true)
}

结论

通过调整进度条的 intrinsicContentSize 属性，可以设置一个在动画期间保持恒定高度的进度条。此方法对于需要保持进度条与其他界面元素对齐或保持一致大小的场景非常有用。

常见问题解答

1. 为什么需要设置 intrinsicContentSize 属性？

intrinsicContentSize 属性定义了控件在没有外部约束的情况下希望占用的最小尺寸。通过设置 intrinsicContentSize 的高度为所需的值，可以强制进度条在动画期间保持该高度。

2. 什么是 preferredLayoutAttributesFitting(_:) 方法？

preferredLayoutAttributesFitting(_:) 方法在布局过程中用于计算控件的首选布局属性。通过返回具有正确 intrinsicContentSize 的布局属性，可以强制进度条在动画期间保持该高度。

3. 什么时候使用 UIView.AnimationOptions.beginFromCurrentState 选项？

使用 UIView.AnimationOptions.beginFromCurrentState 选项可以确保动画从当前状态开始。这可防止进度条在动画过程中调整大小。

4. 如何在 Objective-C 中设置恒定高度的进度条？

在 Objective-C 中，可以使用以下代码设置恒定高度的进度条：

- (instancetype)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
        self.intrinsicContentSize = CGSizeMake(self.frame.size.width, 20.0);
    }
    return self;
}

- (CGSize)intrinsicContentSize {
    CGSize size = [super intrinsicContentSize];
    size.height = 20.0;
    return size;
}