joefryer/jdftooltips

A simple library for showing tooltip-like popups on iOS

JDFTooltips

JDFTooltips makes it easy to show tooltip-like popups on iOS (for example, if you want to show instructions/hints to the user the first time they use the app).

They look a bit like this:

Usage

Creating and showing a tooltip is easy. You can create and show a tooltip on its own, like so:

JDFTooltipView *tooltip = [[JDFTooltipView alloc] initWithTargetView:self.label1 hostView:self.view tooltipText:@"This is a Tooltip" arrowDirection:JDFTooltipViewArrowDirectionUp width:200.0f];
[tooltip show];

Or, if you want to show more than one tooltip, it's probably easier to use one of the manager classes, JDFTooltipManager or its subclass JDFSequentialTooltipManager.

JDFTooltipManager allows you to easily show multiple tooltips at once, and by default it will also show a 'backdrop' behind the tooltips (the user can tap anywhere on the backdrop to dismiss the tooltips).

JDFSequentialTooltipManager allows you to easily show your tooltips sequentially; one is shown at a time, with the next one being shown after the previous one is dismissed. JDFSequentialTooltipManager also shows a backdrop by a default - tapping it moves to the next tooltip in the sequence.

These manager classes also provide convenience methods for configuring stuff (background colour, text colour, font etc) on the all of the tooltips they are managing, and convenience methods for creating tooltips.

If you are using a tooltip manager, you should keep a strong reference to it.

Note: If you have the backdrop enabled, you should not show your tooltips from within viewDidLoad - you should instead show them from viewDidAppear:. This is a know issue that will be fixed in the future.

JDFSequentialTooltipManager example:

    // In your interface
    @property (nonatomic, strong) JDFSequentialTooltipManager *tooltipManager;
    
    // Somewhere in your implementation
    self.tooltipManager = [[JDFSequentialTooltipManager alloc] initWithHostView:self.view];
    [self.tooltipManager addTooltipWithTargetView:view1 hostView:self.view tooltipText:@"Tooltip 1" arrowDirection:JDFTooltipViewArrowDirectionUp width:200.0f];
    [self.tooltipManager addTooltipWithTargetView:view2 hostView:self.view tooltipText:@"Tooltip 2" arrowDirection:JDFTooltipViewArrowDirectionUp width:200.0f];
    [self.tooltipManager addTooltipWithTargetView:view3 hostView:self.view tooltipText:@"Tooltip 3" arrowDirection:JDFTooltipViewArrowDirectionDown width:200.0f];
    [self.tooltipManager showNextTooltip];

Demo

To run the example project, clone the repo, and run pod install from the Example directory first.

Installation

JDFTooltips is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "JDFTooltips"

If you're not using CocoaPods, simply copy everything from Pod\Classes into your project.

Author

Joe Fryer, [email protected]

@JoeFryer88 on Twitter

License

JDFTooltips is available under the MIT license. See the LICENSE file for more info.

Release Notes

1.0

Initial Release

1.1

• Improved tooltip showing/hiding animation
• Bug Fix: JDFSequentialTooltipManager no longer bypasses a tooltip's dismissOnTouch setting.

jdftooltips's Issues

Auto-dismiss

Add the option to auto-dismiss a tooltip after a certain amount of time.

Right way to create BarButtonItem tips

I'd like to add a tooltip pointing to the right BarButton in the Navigation bar. I can't seem to figure out the right approach.

I've tried this but it doesn't work. I can't get a pointer to the host view. It seems the targetview is nil.

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    [self loadObjects];
    UIBarButtonItem *rightBarButtonItem = self.navigationItem.rightBarButtonItem;
    UIView *targetView = [self.navigationItem.rightBarButtonItem valueForKey:@"view"];
    UIView *targetSuperview = [targetView superview];
    UIView *containerView = [targetSuperview superview];

    if (nil == containerView) {
        NSLog(@"Cannot determine container view from UIBarButtonItem: %@", self.navigationItem.rightBarButtonItem);
        return;
    }
    JDFTooltipView *tooltip = [[JDFTooltipView alloc] initWithTargetBarButtonItem:self.navigationItem.rightBarButtonItem hostView:containerView tooltipText:@"Right bar button" arrowDirection:JDFTooltipViewArrowDirectionDown width:200.0f];
    [tooltip show];
}

So I tried a different way to get the view for UIBarButtonItem but again the targetview is nil.

UIView *targetView = (UIView *)[self.navigationItem.rightBarButtonItem performSelector:@selector(view)];

I even tried getting the view this way but no luck there either.

UIView* customview = [self.navigationItem.rightBarButtonItem customView];

Positioning error

Hi, sorry for the delay (I stopped receiving notifications for some reason). Since you closed the first issue, posting a new one with the code that got me that position behavior:
https://gist.github.com/francisjervis/1b022e05f948a2e71770#file-positionerror

Backdrop is working now, too.

Two tooltips when I should be getting one

I'm getting two tooltips when I should be getting one. I have a tableview which contains a imageview and a contentview. The contentview has a button. I'd like to show the tooltip pointing to the button. The code below tries to do that. Could you point me where I'm going wrong?

• (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath object:(PFObject *)object {

  static NSString *CellIdentifier = @"Cell";
  JKEPFTableViewCell *cell = (JKEPFTableViewCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
  if (cell == nil) {
  cell = [[JKEPFTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
  }

  // Configure the cell
  ...
  UIView contentView = (UIView) [cell viewWithTag:105];
  JDFTooltipView *tooltip = [[JDFTooltipView alloc] initWithTargetView:cell.shortlistButton hostView:contentView tooltipText:@"Tap to find similar shoes" arrowDirection:JDFTooltipViewArrowDirectionUp width:200.0f];
  [tooltip show];
  ...
  return cell;
  }

Does not allow tooltips over UIBarbuttonItems in buttom toolbars

Seems to be new with iOS 11 SDK. Other tool tips fail here too

Carthage support

Pull request: #13

tooltip position

is there a setting to position the tooltip (arrow facing down) with the tooltip centred above the view and not to the side?

Arrow appears behind the target view instead of over it.

I have added tooltips using sequential manager to my root view controller and the arrow of the tool tip actually appears behind the bar button or the target view in question.

Add Tooltip to marker info window View

Dismiss on touch

Dismiss on touch doesn't work, i think it's because it's drawing using Brezier Line Path, and has a clear color as the background, so the touchgesture never gets firedinside of the rectangle

Crash with Swift

Hi, I get a crash as soon as I tap the tool tip:

tooltip`top_level_code at AppDelegate.swift:
0x101500540:  pushq  %rbp
0x101500541:  movq   %rsp, %rbp
0x101500544:  subq   $0x20, %rsp
0x101500548:  callq  0x10150ac32               ; symbol stub for: Swift.C_ARGC.mutableAddressor : Swift.Int32
0x10150054d:  movl   (%rax), %edi
0x10150054f:  movl   %edi, -0x4(%rbp)
0x101500552:  callq  0x10150ac38               ; symbol stub for: Swift.C_ARGV.mutableAddressor : Swift.UnsafeMutablePointer<Swift.UnsafeMutablePointer<Swift.Int8>>
0x101500557:  movq   (%rax), %rax
0x10150055a:  movq   %rax, -0x10(%rbp)
0x10150055e:  callq  0x101500330               ; type metadata accessor for tooltip.AppDelegate
0x101500563:  movq   %rax, %rdi
0x101500566:  callq  0x10150ac0e               ; symbol stub for: NSStringFromClass
0x10150056b:  movabsq $0x0, %rdx
0x101500575:  movq   -0x10(%rbp), %rdi
0x101500579:  movl   -0x4(%rbp), %ecx
0x10150057c:  movq   %rdi, -0x18(%rbp)
0x101500580:  movl   %ecx, %edi
0x101500582:  movq   -0x18(%rbp), %rsi
0x101500586:  movq   %rax, %rcx
0x101500589:  callq  0x10150ab48               ; symbol stub for: UIApplicationMain
0x10150058e:  movl   %eax, -0x1c(%rbp)
0x101500591:  addq   $0x20, %rsp
0x101500595:  popq   %rbp
0x101500596:  retq   

The code I'm using (in a blank project with only this pod installed) is

        let toolTipMgr = JDFSequentialTooltipManager(hostView: self.view)


        toolTipMgr.addTooltipWithTargetView(button, hostView: self.view, tooltipText: "tip", arrowDirection: JDFTooltipViewArrowDirection.Up, width: 180.0)
        toolTipMgr.showNextTooltip()

Remove use of UIWindow for the backdrop

Tooltips don't show when using self.tooltipManager.showsBackdropView = YES;

Hi,

I'm unable to get tooltips to show when using the line: "self.tooltipManager.showsBackdropView = YES;"

If I remove that line, then the tooltips appear, but without the backdrop, and they have to be individually pressed to dismiss them (instead of being able to tap anywhere on the screen).

The configuration is straight forward, as I copied the code from the example.

Possible issue with iOS9?

Thanks.

I've also found that the line:
[self.tooltipManager setDismissOnTouchForAllTooltips:NO];

doesn't change the behaviour of the tooltips at all (they still dismiss when touched).

Am I doing something obviously wrong?

Thanks.

Chris

Text shows after tooltip is shown

Thanks for the great library. it's really well written and architected. One issue though is that the text is always some milliseconds behind when showing the tooltip. I mean the tooltip background shows first and after that the text appears. the same when dismissing. You can see it in the demo picture on the home page.

Is this intentional or is it a bug ? visually it looks like an issue.. if you got a quick hack to fix it, please help. Thank you

Can't run pod install from Example directory

Here's what I get when I try to install the dependencies.

$ pod install
Analyzing dependencies

CocoaPods 0.36.0.beta.2 is available.
To update use: `gem install cocoapods --pre`
[!] This is a test version we'd love you to try.

For more information see http://blog.cocoapods.org
and the CHANGELOG for this version http://git.io/BaH8pQ.

Fetching podspec for `JDFTooltips` from `../`
[!] Unable to satisfy the following requirements:

- `JDFTooltips (from `../`)` required by `Podfile`
- `JDFTooltips (from `../`)` required by `Podfile`
- `JDFTooltips (= 0.1.0)` required by `Podfile.lock`

Regardless, I've managed to integrate your library into my app, and was wondering if you had plans to support the following:

• customization of tooltip views, primarily padding
• showing the same tooltip more than once
• animation customization

I could also try implementing these myself and submitting a pull request if you'd like.