Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Top border gets cut-out #220

Open
gchiacchio opened this issue Aug 17, 2021 · 1 comment
Open

Top border gets cut-out #220

gchiacchio opened this issue Aug 17, 2021 · 1 comment

Comments

@gchiacchio
Copy link

Describe the bug
By setting a border and showing with .up direction will render half of of the top border

To Reproduce
My settings

        popTip = PopTip()
        popTip.shouldDismissOnTap = false
        popTip.shouldDismissOnTapOutside = false
        popTip.shouldDismissOnSwipeOutside = false
        popTip.bubbleOffset = 0
        popTip.edgeInsets = UIEdgeInsets(
            top: 0,
            left: 8,
            bottom: 0,
            right: 8)
        popTip.bubbleColor = .white
        popTip.borderColor = .textGrey750
        popTip.borderWidth = 2
        popTip.cornerRadius = 12
        popTip.arrowRadius = 2

calling it later with .up will cut-out half of the top border.

Expected behavior
Top border should be properly rendered

Screenshots
image

I've tracked the issue down to this piece of code in PopTip+Draw.swift (lines 83-88):

      // 7: Top left arc
      path.addArc(withCenter: CGPoint(x: baloonFrame.minX + radius + borderWidth, y: baloonFrame.minY + radius), radius:radius, startAngle: CGFloat.pi, endAngle: CGFloat.pi * 1.5, clockwise: true)
      // 8: Top line
      path.addLine(to: CGPoint(x: baloonFrame.width - radius, y: baloonFrame.minY))
      // 9: Top right arc
      path.addArc(withCenter: CGPoint(x: baloonFrame.width - radius, y: baloonFrame.minY + radius), radius:radius, startAngle: CGFloat.pi * 1.5, endAngle: 0, clockwise:true)

Looks like is not accounting for the borderWidth. The stroke will be applied right in the edge of the path, so half inside of the balloon, half outside. That way, the path should account for the outer part of the border stroke.
From UIBezierPath.fill() docs

The painted region includes the pixels right up to, but not including, the path line itself. For paths with large line widths, this can result in overlap between the fill region and the stroked path (which is itself centered on the path line).

@andreamazz
Copy link
Owner

Hey @gchiacchio
Thanks for the detailed report, I'll look into it as soon as I can

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants