在UIView中绘制三angular形切口以供select指示
我正在创build一个视图，作为我的应用程序的类别select器。 我希望它有一个三angular形作为select指示，如在这个图像：
我不确定如何绘制三angular形，使其成为镂空，揭示下面的主要视图。 下面的主视图很可能有一个自定义的，可能不重复的（我还没有决定）图像作为其背景。 另外，当select改变时，我希望三angular形animation到一个新的位置，这使得事情进一步复杂化。
我意识到子视图会使animation更容易，但会使绘图复杂化; 直接绘制可能会使animation更难一点。 而且我对Quartz不太熟悉，所以我不确定如何去直接绘制路线。
提前致谢！
更新：我已经看过马特·加拉格尔（Matt Gallagher）在绘制带有孔的graphics上的post，但是它并没有真正回答我的问题。 有没有办法让我“看”在我的形状内的特定path下面的东西，并复制它？ …然后支持animation呢？
更新2：我通过简单地绘制一个额外的path完成了部分工作。 结果如下所示： http : //dl.dropbox.com/u/7828009/Category%20Selector.mov
代码：
CGRect cellRect = [self rectForCategoryNumber:(selectedCategoryIndex + 1)]; [[UIColor scrollViewTexturedBackgroundColor] setFill]; CGContextMoveToPoint(currentContext, self.frame.size.width, (cellRect.origin.y + cellRect.size.height * 0.15)); CGContextAddLineToPoint(currentContext, self.frame.size.width, (cellRect.origin.y + cellRect.size.height * 0.65)); CGContextAddLineToPoint(currentContext, self.frame.size.width * 0.8, (cellRect.origin.y + cellRect.size.height * 0.4)); CGContextClosePath(currentContext); CGContextFillPath(currentContext); [[UIColor darkGrayColor] setStroke]; CGContextSetLineCap(currentContext, kCGLineCapRound); CGContextMoveToPoint(currentContext, self.frame.size.width, (cellRect.origin.y + cellRect.size.height * 0.15)); CGContextAddLineToPoint(currentContext, self.frame.size.width * 0.8, (cellRect.origin.y + cellRect.size.height * 0.4)); CGContextSetLineWidth(currentContext, 2.5); CGContextStrokePath(currentContext); [[UIColor lightGrayColor] setStroke]; CGContextMoveToPoint(currentContext,self.frame.size.width * 0.8, (cellRect.origin.y + cellRect.size.height * 0.4)); CGContextAddLineToPoint(currentContext, self.frame.size.width, (cellRect.origin.y + cellRect.size.height * 0.65)); CGContextSetLineWidth(currentContext, 1.0); CGContextStrokePath(currentContext); 显然，在这种情况下，它只能工作，因为我在这两种情况下使用相同的填充颜色; 如果可能的话，我想消除这种依赖。 另外，当然我想animation这个三angular形的位置。
更新3：我试图做的animation：
static CALayer *previousLayer = nil; static CGMutablePathRef previousPath = nil; // … Get context, etc. CAShapeLayer *shapeLayer = [[CAShapeLayer alloc] init]; shapeLayer.path = shapePath; [shapeLayer setFillColor:[[UIColor redColor] CGColor]]; [shapeLayer setStrokeColor:[[UIColor blackColor] CGColor]]; [shapeLayer setBounds:self.bounds]; [shapeLayer setAnchorPoint:self.bounds.origin]; [shapeLayer setPosition:self.bounds.origin]; if (previousPath) { // Animate change CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"changePath"]; animation.duration = 0.5; animation.fromValue = (id)previousPath; animation.toValue = (id)shapePath; [shapeLayer addAnimation:animation forKey:@"animatePath"]; previousPath = shapePath; } if (previousLayer) [previousLayer removeFromSuperlayer]; previousLayer = shapeLayer; [self.layer addSublayer:shapeLayer];
你看过CAShapeLayer吗？ 您可以为select窗格创build一个path，以定义整个大纲，包括排除每个需要遮罩的状态的三angular形。 然后，您可以通过设置lineWidth和strokeColor属性，在图像中显示轮廓的情况下对图层进行描边。 这应该能够给你你需要的东西。 CAShapeLayer中的path属性是可以animation的，这意味着你所要做的就是设置path属性，它会animation（假定你的图层是视图的子层而不是根层）。
最好的祝福。
用代码更新
此代码：
- (void)viewDidLoad { [super viewDidLoad]; [[self view] setBackgroundColor:[UIColor blueColor]]; CGMutablePathRef path = CGPathCreateMutable(); CGPathMoveToPoint(path,NULL,0.0,0.0); CGPathAddLineToPoint(path, NULL, 160.0f, 0.0f); CGPathAddLineToPoint(path, NULL, 160.0f, 100.0f); CGPathAddLineToPoint(path, NULL, 110.0f, 150.0f); CGPathAddLineToPoint(path, NULL, 160.0f, 200.0f); CGPathAddLineToPoint(path, NULL, 160.0f, 480.0f); CGPathAddLineToPoint(path, NULL, 0.0f, 480.0f); CGPathAddLineToPoint(path, NULL, 0.0f, 0.0f); CAShapeLayer *shapeLayer = [CAShapeLayer layer]; [shapeLayer setPath:path]; [shapeLayer setFillColor:[[UIColor redColor] CGColor]]; [shapeLayer setStrokeColor:[[UIColor blackColor] CGColor]]; [shapeLayer setBounds:CGRectMake(0.0f, 0.0f, 160.0f, 480)]; [shapeLayer setAnchorPoint:CGPointMake(0.0f, 0.0f)]; [shapeLayer setPosition:CGPointMake(0.0f, 0.0f)]; [[[self view] layer] addSublayer:shapeLayer]; CGPathRelease(path); }
结果在这个显示中：
你可以在这里下载示例项目：