ios – 使用watchOS 2在Apple Watch上渲染折线图

前端之家收集整理的这篇文章主要介绍了ios – 使用watchOS 2在Apple Watch上渲染折线图前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在尝试使用watchOS 2在Apple Watch上渲染线条/步骤图.与iOS 9不同,watchOS 2不支持Quartz.它只支持Core Graphics.我尝试编写一些代码绘制折线图但我得到一个错误“CG​​ContextRestoreGState:无效的上下文0x0.这是一个严重的错误.这个应用程序,或它使用的库,正在使用无效的上下文,从而有助于整体系统稳定性和可靠性降低.这个通知是礼貌的:请解决这个问题.在即将到来的更新中它将成为一个致命错误.“

以下是我使用的代码

  1. import WatchKit
  2. import Foundation
  3. import UIKit
  4.  
  5. class InterfaceController: WKInterfaceController{
  6. override func awakeWithContext(context: AnyObject?) {
  7. super.awakeWithContext(context)
  8. let path = UIBezierPath()
  9. let startPoint = CGPointMake(0.0,0.0)
  10. path.moveToPoint(startPoint)
  11. let nextPoint = CGPointMake(20.0,20.0)
  12. path.addLineToPoint(nextPoint)
  13. path.lineWidth = 1.0
  14. UIColor.whiteColor().setStroke()
  15. path.stroke()
  16. }
  17.  
  18. override func willActivate() {
  19. super.willActivate()
  20.  
  21. }
  22.  
  23. override func didDeactivate() {
  24. super.didDeactivate()
  25. }
  26. }

我的最终结果应该像Apple Watch上的Stocks app.每当用户点击特定股票时,他将能够查看/可视化该股票的统计数据.任何人都可以帮助我实现这一目标.

解决方法

我成功地使用以下步骤渲染线条:

>创建基于位图的图形上下文,并使用UIGraphicsBeginImageContext将其设置为当前上下文.
>借鉴上下文.
>从上下文中提取CGImageRef并将其转换为UIImage对象.
>在WKInterfaceGroup或WKInterfaceImage上显示图像.

码:

  1. // Create a graphics context
  2. let size = CGSizeMake(100,100)
  3. UIGraphicsBeginImageContext(size)
  4. let context = UIGraphicsGetCurrentContext()
  5.  
  6. // Setup for the path appearance
  7. CGContextSetStrokeColorWithColor(context,UIColor.whiteColor().CGColor)
  8. CGContextSetLineWidth(context,4.0)
  9.  
  10. // Draw lines
  11. CGContextBeginPath (context);
  12. CGContextMoveToPoint(context,0);
  13. CGContextAddLineToPoint(context,100,100);
  14. CGContextMoveToPoint(context,100);
  15. CGContextAddLineToPoint(context,0);
  16. CGContextStrokePath(context);
  17.  
  18. // Convert to UIImage
  19. let cgimage = CGBitmapContextCreateImage(context);
  20. let uiimage = UIImage(CGImage: cgimage!)
  21.  
  22. // End the graphics context
  23. UIGraphicsEndImageContext()
  24.  
  25. // Show on WKInterfaceImage
  26. image.setImage(uiimage)

image是WKInterfaceImage属性.这个对我有用.

我也可以在watchOS上使用UIBezierPath绘制如下:

  1. // Create a graphics context
  2. let size = CGSizeMake(100,100)
  3. UIGraphicsBeginImageContext(size)
  4. let context = UIGraphicsGetCurrentContext()
  5. UIGraphicsPushContext(context!)
  6.  
  7. // Setup for the path appearance
  8. UIColor.greenColor().setStroke()
  9. UIColor.whiteColor().setFill()
  10.  
  11. // Draw an oval
  12. let rect = CGRectMake(2,2,96,96)
  13. let path = UIBezierPath(ovalInRect: rect)
  14. path.lineWidth = 4.0
  15. path.fill()
  16. path.stroke()
  17.  
  18. // Convert to UIImage
  19. let cgimage = CGBitmapContextCreateImage(context);
  20. let uiimage = UIImage(CGImage: cgimage!)
  21.  
  22. // End the graphics context
  23. UIGraphicsPopContext()
  24. UIGraphicsEndImageContext()
  25.  
  26. image.setImage(uiimage)

您可以查看示例代码here.

猜你在找的iOS相关文章