如何在iOS中製作帶有底部箭頭的提示氣球？

嗨，我在UIview上創建小費氣球。我的代碼是在UIView上實現的。如何在iOS中製作帶有底部箭頭的提示氣球？

static const CGFloat HEIGHTOFPOPUPTRIANGLE = 20.0f; 
static const CGFloat WIDTHOFPOPUPTRIANGLE = 40.0f; 
static const CGFloat borderRadius = 8.0f; 
static const CGFloat strokeWidth = 3.0f; 

CGContextRef context = UIGraphicsGetCurrentContext(); 
// CGContextTranslateCTM(context, 0.0f, self.bounds.size.height); 
// CGContextScaleCTM(context, 1.0f, -1.0f); 

CGRect currentFrame = self.bounds; 

CGContextSetLineJoin(context, kCGLineJoinRound); 
CGContextSetLineWidth(context, strokeWidth); 
CGContextSetStrokeColorWithColor(context, [[UIColor redColor] CGColor]); 
CGContextSetFillColorWithColor(context, [[UIColor yellowColor] CGColor]); 

// Draw and fill the bubble 

CGContextBeginPath(context); 
CGContextMoveToPoint(context, borderRadius + strokeWidth + 0.5f, strokeWidth + HEIGHTOFPOPUPTRIANGLE + 0.5f); 
CGContextAddLineToPoint(context, round(currentFrame.size.width/2.0f - WIDTHOFPOPUPTRIANGLE/2.0f) + 0.5f, HEIGHTOFPOPUPTRIANGLE + strokeWidth + 0.5f); 
CGContextAddLineToPoint(context, round(currentFrame.size.width/2.0f) + 0.5f, strokeWidth + 0.5f); 
CGContextAddLineToPoint(context, round(currentFrame.size.width/2.0f + WIDTHOFPOPUPTRIANGLE/2.0f) + 0.5f, HEIGHTOFPOPUPTRIANGLE + strokeWidth + 0.5f); 
CGContextAddArcToPoint(context, currentFrame.size.width - strokeWidth - 0.5f, strokeWidth + HEIGHTOFPOPUPTRIANGLE + 0.5f, currentFrame.size.width - strokeWidth - 0.5f, currentFrame.size.height - strokeWidth - 0.5f, borderRadius - strokeWidth); 
CGContextAddArcToPoint(context, currentFrame.size.width - strokeWidth - 0.5f, currentFrame.size.height - strokeWidth - 0.5f, round(currentFrame.size.width/2.0f + WIDTHOFPOPUPTRIANGLE/2.0f) - strokeWidth + 0.5f, currentFrame.size.height - strokeWidth - 0.5f, borderRadius - strokeWidth); 
CGContextAddArcToPoint(context, strokeWidth + 0.5f, currentFrame.size.height - strokeWidth - 0.5f, strokeWidth + 0.5f, HEIGHTOFPOPUPTRIANGLE + strokeWidth + 0.5f, borderRadius - strokeWidth); 
CGContextAddArcToPoint(context, strokeWidth + 0.5f, strokeWidth + HEIGHTOFPOPUPTRIANGLE + 0.5f, currentFrame.size.width - strokeWidth - 0.5f, HEIGHTOFPOPUPTRIANGLE + strokeWidth + 0.5f, borderRadius - strokeWidth); 
CGContextClosePath(context); 
CGContextDrawPath(context, kCGPathFillStroke);

使用此代碼我的小費氣球創造這種

.... enter image description here

，但我想箭頭底部不上頭，請忽略寫在提示氣球UIView的文本。只關注紅色邊框。 SO爲創建底部，所以我上面的兩行註釋掉箭頭....

 CGContextTranslateCTM(context, 0.0f, self.bounds.size.height); 
    CGContextScaleCTM(context, 1.0f, -1.0f);

通過對這個我已經創造尖端氣球與底部箭頭，但問題是在這裏就像文字我的小費熱氣球的UIView旋轉所有內容這樣的形象....

enter image description here

我想與底部箭頭這個技巧氣球但像正確的方式文本等內容寫入。所以請告訴我任何解決方案，我真的很感謝你。基本上我是按照這個鏈接。

How to draw a "speech bubble" on an iPhone?

來源

2015-04-27 rahul

你的文字看起來翻轉，因爲通過改變變換矩陣要更改的座標系統的整個來龍去脈，包括文字。您可以保存繪圖環境，方法是保存其狀態並進行恢復，以防止影響其他繪圖操作。

因此，在更改CTM之前，您可以撥打CGContextSaveGState(context)，然後在完成繪製泡沫呼叫CGContextRestoreGState(context)後完成。如果您在圖形狀態恢復後繪製文本，它應該顯示爲「正常」。

來源

2015-04-27 20:48:00 Artal

如何在iOS中製作帶有底部箭頭的提示氣球？

回答

相關問題