今回はカスタマイズ可能なプログレスを表示できる「GradientCircularProgress」を試していきたいと思います。ライセンスはMITです。
GitHub - keygx/GradientCircularProgress: Customizable progress indicator library in Swift
Customizable progress indicator library in Swift. Contribute to keygx/GradientCircularProgress development by creating an account on GitHub.
github.com
では、いきましょう
手順
１．まずはプロジェクトを作成して、podで該当ライブラリをインストール＆xcworkspaceを起動します。
pod 'GradientCircularProgress', :git => 'https://github.com/keygx/GradientCircularProgress'
２．サンプルのスタイルを利用することもできるのですが、今回はカスタマイズした（といってもサンプルの数値をちょこっといじっただけ）スタイルを作成します。
「CustomProgressStyle.swift」という名前で下記内容のファイルを作成しました。
import UIKit
import GradientCircularProgress
public struct CustomProgressStyle: StyleProperty {
// Progress Size
public var progressSize: CGFloat = 260
// Gradient Circular
public var arcLineWidth: CGFloat = 20.0
public var startArcColor: UIColor = ColorUtil.toUIColor(r: 0.0, g: 122.0, b: 255.0, a: 1.0)
public var endArcColor: UIColor = UIColor.cyan
// Base Circular
public var baseLineWidth: CGFloat? = 5.0
public var baseArcColor: UIColor? = UIColor(red:0.0, green: 0.0, blue: 0.0, alpha: 0.2)
// Ratio
public var ratioLabelFont: UIFont? = UIFont(name: "Verdana-Bold", size: 30.0)
public var ratioLabelFontColor: UIColor? = UIColor.white
// Message
public var messageLabelFont: UIFont? = UIFont.systemFont(ofSize: 30.0)
public var messageLabelFontColor: UIColor? = UIColor.white
// Background
public var backgroundStyle: BackgroundStyles = .dark
// Dismiss
public var dismissTimeInterval: Double? = nil // 'nil' for default setting.
public init() {}
}３．ViewController.swiftで表示します。ボタンを押したら表示されるようにしてみました。
import UIKit
import GradientCircularProgress
class ViewController: UIViewController {
var gcp = GradientCircularProgress()
override func viewDidLoad() {
super.viewDidLoad()
}
@IBAction func start(_ sender: Any) {
self.gcp.show(message: "Loading", style: CustomProgressStyle())
}
}４．実行結果です（動いてなくてすみません。。。実際はクルクルしています）
以上で完了です。
いい感じに表示できました。今回は「進捗率なし」のパターンでしたが、「進捗率あり」パターンも簡単に実装できそうなので、そのうち試してみたいと思います。
コメント