Added tooltip prop to ActionButton.Item

[Ajackster]

This pull request adds tooltips to the ActionButtonItem component. It calculates the position of each action button and either places it to the left, right or on top of the action button item.

Here are pictures of what the tooltip looks like with an even and odd set of ActionButtonItems.

@geremih Would you be interested in adding this to your project?

[geremih]

Thanks @Ajackster! I have added some comments to be addressed before I can merge. Also, can you document your change in the Readme?

[Ajackster]

Hey @geremih I'm not sure what comments you are talking about. Happy to fix or improve anything though!

[geremih]

There is also a position prop for ActionButton. Shouldn't this also cover the case in which the button is aligned to either of the sides?

[geremih]

@Ajackster that's what I meant. So if the button is positioned to the right, no button item should have the tooltip to the left side,? So in that case, one way to do that would be const middle = (index == length -1) and the rest are aligned to the right. I saw that in the new screenshot you posted, all tooltips are at the top of the button item. Is that something you would prefer using, instead of aligning the tooltip with respect to the index?

[Ajackster]

@geremih Hm I'm not too sure what the position prop actually does. I tried passing it down to the action button items and wasn't seeing the same result. I think the position prop is actually used for the placement of the actual ActionButton component, not necessarily the placement of the ActionButtonItems.

position="center"

position="left"

[joncursi]

Would love to see this added. However, I think the tooltip text will also need a tooltipStyle prop to go with it to style the backdrop of the text and the text color. Or allow the user to supply a custom component rather than limiting them to a string.

[Ajackster]

@AbhishekBiswal Haven't had the time to finish this yet, I've been very busy. I plan to finish this very soon.

[AbhishekBiswal]

@Ajackster any work-in-progress branch I can pull this from? I'm trying to implement this:

[Monte9]

@Ajackster I tried this PR out and I have some feedback if you don't mind.

1. For some weird reason, the tooltip doesn't show up on Android. Any idea why?
2. The tooltips don't align properly when you right position the ActionButton. See attached screenshot.

[rknell]

I think the key might be to place it up slightly higher than the button rather than the middle. This is what the My fitness Pal app does:

[rknell]

Unfortunately doesn't work for right alignment:

Plus there is a weird issue on email as pictured

Good work, just not ready for production. Looking at the My Fitness Pal screenshot above I wouldn't be surprised if they were using this project!

[Monte9]

@rknell do you know if my fitness pal is written in React Native?

[rknell]

No idea! it just looks suspiciously like this project hey <http://www.snappy-apps.com.au>

…

On 4 August 2017 at 07:48, Monte Thakkar ***@***.***> wrote: @rknell <https://github.com/rknell> do you know if my fitness pal is written in React Native? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#3 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AFmlbWrzoPFJhjLaHTGaj52f7Livi6Cgks5sUkA4gaJpZM4LxxtP> .