CircleGraph 0.0.1

CircleGraph 0.0.1

×

由Paul Geurts维护。

CircleGraph 0.0.1

  • 由
  • Paul Geurts

CircleGraph

circleGraphsAnimated

目录

  1. 简介
  2. 如何安装CircleGraph
  3. 如何使用CircleGraph
  4. 如何自定义CircleGraph
  1. 任何问题

简介

如果您正在寻找可自定义的圆形图以添加到项目中，您已经来对地方了。此CircleGraph pods提供了易于实现的参数，例如线宽、大小、颜色、多个弧线和不同的动画（见上面的示例）。

circleGraphExplained

如何安装CircleGraph

通过CocoaPods

如果您之前没有使用过CocoaPods，请先安装它。

$ gem install cocoapods
$ pod setup

如果您的项目中还没有名为 Podfile 的文件，请在项目文件夹中创建一个文件，并将以下行添加到 Podfile 中。

pod 'CircleGraph', :git => 'https://github.com/pmgeurts/CircleGraph.git'

然后，执行以下命令。🎉

$ pod install

手动

将此文件拖拽到您的项目中。

CircleGrapph/CircleGraph.swift 我们可以在这里使用 CircleGraph。🎉

如何使用 CircleGraph

编程方式

如果您只是希望通过代码来创建 Circle Graph，请使用该方法。

//Instantiate graph:
let doubleArcGraph = CircleGraph(frame: CGRect(x: 0, y: 0, width: 120, height: 120), strokeWidth: 15, passiveColor: UIColor.purple, activeColor: UIColor.magenta, inBetweenColor: UIColor.red)

//Add Subview:
let doubleArcGraph = CircleGraph(frame: CGRect(x: 0, y: 0, width: 120, height: 120), strokeWidth: 15, passiveColor: UIColor.purple, activeColor: UIColor.magenta, inBetweenColor: UIColor.red)

//Set anchors:
NSLayoutConstraint.activate([ ... ])

//Call the graph method:
doubleArcGraph.drawTwoLayerArc(from: 0, to: 0.5, animationDuration: 0.5, animationType: .linear)

界面构建器

如果您在 XIB / Storyboard 中定义了 Circle Graph 容器视图，请使用此方法。

//Setup your container view in your view file

//Create an outlet:
@IBOutlet weak var: circleGRaphContainr: UIView!

//Create graph object:
- var threeArcGraph: CircleGraph!

//Setup circle graph (the frame is taken from the container bounds):
threeArcGraph = CircleGraph(frame: circleGraphContainer.bounds, strokeWidth: 20, passiveColor: UIColor.lightGray, activeColor: UIColor.red, inBetweenColor: UIColor.orange)

//Add Subview:
- circleGraphContainer.addSubview(threeArcGraph)

//Call the graph method:
- threeArcGraph.drawThreeLayerArc(from: 0.75, to: 0.5, inBetween: 0.4, animationDuration: 1.5, animationType: .easeInEaseOut)

如何自定义 CircleGraph

颜色

背景颜色：背景圆环 激活颜色：第一个动态圆环 第二个激活颜色：在背景颜色和激活颜色之间的圆环

方向

根据输入值自动确定

  • 从小于的值到大于的值：顺时针
  • 从大于的值到小于的值：逆时针

动画

动画持续时间可以在绘图函数中指定

有任何问题吗？

欢迎联系我们！ [email protected]