如何動畫使用核心圖庫開發的餅圖？

Question

在iPhone應用程序Roambi中，顯示的餅圖可以像用旋轉盤一樣與用戶一起旋轉動畫。我們可以堅持並做很多事情。

有人提到的Roambi應用程序被開發使用核心情節庫：

What library use Roambi app iPhone to draw chart?

如何操作餅圖使用核心情節發展？

Answer 1

就讓我們來看看在覈心繪圖源代碼顯示，CPPieChart的繼承看起來像這樣：

CPPieChart：CPPlot：CPAnnotationHostLayer：CPLayer：CALayer

所以你可以看到，在最後，CPPieChart只是一個重大分類CALayer。我可能在這裏完全不正確，但沒有任何跡象表明這不能像其他任何CALayer一樣動畫。試試下面的代碼通過360度旋轉層：

CABasicAnimation *rotation = [CABasicAnimation animationWithKeyPath:@"transform"]; 
CATransform3D transform = CATransform3DMakeRotation(DegreesToRadians(360), 0, 0, 1); 
rotation.toValue = [NSValue valueWithCATransform3D:transform]; 
rotation.duration = 10.0f; 
[pieChart addAnimation:rotation forKey:@"rotation"]; 

如果你能得到的從加速度計讀取值，並將其轉換爲旋轉角度這個工作然後它只是一個問題。

Answer 2

對於簡單的餅圖，即使使用上述動畫，Core Plot也不是必需的。如果您只想要Core Plot解決方案，請忽略此答案。然而，這是一個簡單的解決方案，不需要外部包或甚至任何框架。

創建一個名爲PieChartView的UIView。在PieChartView.h：

#import <UIKit/UIKit.h> 

@interface PieChartView : UIView { 
    float zeroAngle; 
    NSMutableArray *valueArray; 
    NSMutableArray *colorArray; 
} 
@property (nonatomic) float zeroAngle; 
@property (nonatomic, retain) NSMutableArray *valueArray; 
@property (nonatomic, retain) NSMutableArray *colorArray; 
@end 

然後在PieChartView.m實現：

#import "PieChartView.h" 

@implementation PieChartView 
@synthesize zeroAngle; 
@synthesize valueArray, colorArray; 

- (id)initWithFrame:(CGRect)frame { 
    if ((self = [super initWithFrame:frame])) { 
    } 
    return self; 
} 


- (void)drawRect:(CGRect)rect { 
    CGContextRef context = UIGraphicsGetCurrentContext(); 

    // DETERMINE NUMBER OF WEDGES OF PIE 
    int wedges = [valueArray count]; 
    if (wedges > [colorArray count]) { 
     NSLog(@"INSUFFICENT COLORS FOR PIE CHART: Please add %d additional colors.",wedges-[colorArray count]); 
     for (int i=[colorArray count] ; i<wedges ; ++i) { 
      [colorArray addObject:[UIColor whiteColor]]; 
     } 
    } 

    // DETERMINE TOTAL VOLUME OF PIE 
    float sum = 0.0; 
    for (int i=0; i<wedges ; ++i) { 
     sum += [[valueArray objectAtIndex:i] floatValue]; 
    } 
    float frac = 2.0*M_PI/sum; 

    // DETERMINE CENTER AND MAXIMUM RADIUS OF INSCRIBED CIRCLE 
    int center_x = rect.size.width/2.0; 
    int center_y = rect.size.height/2.0; 
    int radius = (center_x > center_y ? center_x : center_y); 

    // DRAW WEDGES CLOCKWISE FROM POSITIVE X-AXIS 
    float startAngle=zeroAngle; 
    float endAngle=zeroAngle; 
    for (int i=0; i<wedges; ++i) { 
     startAngle = endAngle; 
     endAngle += [[valueArray objectAtIndex:i] floatValue]*frac; 
     [[colorArray objectAtIndex:i] setFill]; 
     CGContextMoveToPoint(context, center_x, center_y); 
     CGContextAddArc(context, center_x, center_y, radius, startAngle, endAngle, 0); 
     CGContextClosePath(context); 
     CGContextFillPath(context); 
    } 
} 

- (void)dealloc { 
    [valueArray release]; 
    [colorArray release]; 
    [super dealloc]; 
} 
@end 

現在你可以浮動zeroAngle綁定到你想要達到理想的動畫任何方式加速度計。

Answer 3

我不知道CorePlot，它可能在不久的將來會有一些用處，所以我只是看了一下。 CorePlot很有趣，並且有效。

關於動畫與CorePlot：

1. CorePlot文檔中提到的Animation system，但尚未實現 ...
2. 即使基於Core Animation，它不意味着CorePlot圖將很容易動畫。

Interesting reading on the topic on google groups.

因此，這裏有你的選擇（我的優先順序排列）：

1. 尋找另一個繪圖庫處理類似的Roambi做動畫。
2. 實現基於CorePlot你的動畫（指這個框架有很好的理解和Core Animation）
3. 自己所做的一切，這取決於你想要什麼，再次可能並不難......但Core Animation需要的技能，再次。

我懷疑的Roambi使用CorePlot，但如果他們這樣做，他們把它作爲與萬噸房子代碼定製基地...