Stockapp類型的交互 - UIView x CALayer

Question

我正在實現一些用戶交互的圖表，比如長按查看手指下的全部數據，用兩根手指畫線和其他東西。

首先，我將如何實現iphone股票應用程序在價格圖的橫向模式下進行的交互？

操縱一個CALayer爲黃色的垂直線和黃點？那些來自圖像或渲染？使用UIView（或UIImageView）？或者在drawRect中渲染它們？

Answer 1

我認爲這實際上只是一個實施細節，所以它取決於你如何做到這一點。我猜想他們正在做的一切都在-drawRect，但是，如果你願意，你可以用Core Animation層來實現它。

如果您已經繪製與-drawRect圖，那麼它將使感但是堅持說，如果你只是想覆蓋層的黃點，你可以只使用垂直黃線常規CALayer s並更改其位置以響應-托架移動。

// Create a line layer with a 1px width and yellow bg 
CALayer *lineLayer = [CALayer layer]; 
[lineLayer setBounds:CGRectMake(0.0f, 0.0f, 1.0f, parentViewHeight)]; 
[lineLayer setPosition:CGPointMake(currentX, parentViewHeight/2.0f)]; 
[lineLayer setBackgroundColor:[[UIColor yellowColor] CGColor]]; 
[[parentView layer] addSublayer:lineLayer]; 

// Create a dot layer with the contents set to a CGImageRef 
UIImage *dotImage = [UIImage imageNamed:@"yellowdot.png"]; 
CALayer *dotLayer = [CALayer layer]; 
[dotLayer setBounds:CGRectMake(0.0f, 0.0f, [dotImage size].width, 
               [dotImage size].height)]; 
[dotLayer setPosition:[lineLayer position]]; 
[dotLayer setContents:[dotImage CGImage]]; 
[[parentView layer] addSublayer:dotLayer]; 

您需要製作這些圖層的層級，以便您在收到觸摸事件時可以更新其位置。

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event; 
{ 
    CGPoint current = [[touches anyObject] locationInView:parentView]; 
    [lineLayer setPosition:CGPointMake(current.x, [lineLayer position].y)]; 
    [dotLayer setPosition:CGPointMake(current.x, [self yForStockPriceAtPoint:current])]; 

    [super touchesMoved:touches withEvent:event]; 
}