如何绘制带箭头的圆角矩形（对话气泡）？排查代码无箭头问题

你的代码问题在于：箭头线条是在完成整个圆角矩形的轮廓绘制后才添加的，此时路径的当前点停在气泡的左上角，直接绘制箭头会先拉出一条多余的线条连接左上角和箭头起点，导致箭头无法和气泡主体路径融合，最终只会显示原始的圆角矩形。

修复方案 #

将箭头的绘制嵌入到气泡右侧竖线的绘制流程中，让箭头成为气泡轮廓的一部分，修改后的代码如下：

Public Function SpeechBubbleRight(ByRef r As gdiplus.RECTF, ByVal r1 As Single, ByVal r2 As Single, ByVal r3 As Single, ByVal r4 As Single) As clsWApath
    Dim x As Single
    Dim Y As Single
    Dim w As Single
    Dim h As Single
    
    x = r.Left
    Y = r.Top
    w = r.Width
    h = r.Height
    
    Dim rr As New clsWApath
    Dim arrowSize As Single
    arrowSize = 20 ' 调整此值改变箭头大小

    '/''''''
    Call rr.Append_Bezier(x, Y + r1, x, Y, x + r1, Y, x + r1, Y)
    '---
    Call rr.Append_Line(x + r1, Y, x + w - r2, Y)
    '''''' \
    Call rr.Append_Bezier(x + w - r2, Y, x + w, Y, x + w, Y + r2, x + w, Y + r2)
    '     | 绘制右侧上半部分至箭头顶部
    Call rr.Append_Line(x + w, Y + r2, x + w, Y + h / 2 - arrowSize / 2)
    ' 绘制箭头
    Call rr.Append_Line(x + w, Y + h / 2 - arrowSize / 2, x + w + arrowSize, Y + h / 2)
    Call rr.Append_Line(x + w + arrowSize, Y + h / 2, x + w, Y + h / 2 + arrowSize / 2)
    '     | 继续绘制右侧下半部分
    Call rr.Append_Line(x + w, Y + h / 2 + arrowSize / 2, x + w, Y + h - r3)
    '    /
    Call rr.Append_Bezier(x + w, Y + h - r3, x + w, Y + h, x + w - r3, Y + h, x + w - r3, Y + h)
    '__
    Call rr.Append_Line(x + w - r3, Y + h, x + r4, Y + h)
    '\_
    Call rr.Append_Bezier(x + r4, Y + h, x, Y + h, x, Y + h - r4, x, Y + h - r4)
    '|
    Call rr.Append_Line(x, Y + h - r4, x, Y + r1)
    
    Call rr.ClosePath
    
    Set SpeechBubbleRight = rr
End Function

修改说明 #

• 提前定义arrowSize变量，避免路径绘制中途临时声明
• 将右侧竖线拆分为三段绘制：从顶部圆角到箭头上方 → 绘制箭头的三角形轮廓 → 从箭头下方到底部圆角
• 这样整个路径是连续的闭合形状，箭头会作为气泡的一部分被正确绘制和填充

内容的提问来源于stack exchange，提问作者tmighty