Fl_chart: Listen to normal tap on Tooltip instead of longpress

Created on 8 Jul 2019  Â·  26Comments  Â·  Source: imaNNeoFighT/fl_chart

First of all, thank you for this amazing library <3

Please provide onTap option with some sort of MoveUpdate to show Tooltip on chart as an alternative to onLongPress

Looking forward for this library

enhancement

Most helpful comment

I've done this enhancement. Replace your fl_chart.dart with attached file (Remove .txt).
fl_chart.dart.txt

All 26 comments

Yes, I also want the same thing. Please provide that functionality.

Would be great, I don't know if users will realise they can long press to show tip. Normal press would be better.

Also please keep in mind that chart should maintain selected state on rebuild. For example, if some data point is selected and then rebuild occurs, that selection should be preserved.

I think it should handle out of the chart,
I mean you can tell to the chart, which tooltip should be shown now,
then you can keep the state of selected tooltip on your side,
and it is more customizable.
@Mazas17

Also sounds good

To take this one further, I am wanting to use this on desktop. Is there a way to make it so that if a mouse is hovering over it, it shows all the time and follows the mouse as if you are holding down a press?

Yes, for sure we will add the Desktop compatibility,
I just need time :),
Also, all contributions are welcome,
give it a try!
@MostHated

Hi,
Unfortunately, Github started banning Iranian users while ago,
If they didn't stop their action, I can't continue on this repo,
read more it here,
If you want to prevent this unfair action, give a start on this repository and say your support by creating an issue, and spread it.
Best regards,
Iman Khoshabi

I've done this enhancement. Replace your fl_chart.dart with attached file (Remove .txt).
fl_chart.dart.txt

Are you getting shut down?

On Wed, 31 Jul. 2019, 8:51 pm Dipendra Sharma, notifications@github.com
wrote:

Replace your fl_chart.dart with attached file (Remove .txt).
fl_chart.dart.txt
https://github.com/imaNNeoFighT/fl_chart/files/3451322/fl_chart.dart.txt

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/imaNNeoFighT/fl_chart/issues/37?email_source=notifications&email_token=AK43TTUNLSIFO2MFTBVWLEDQCFVCTA5CNFSM4H66OOP2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD3G3WMQ#issuecomment-516799282,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AK43TTTMUURSMORI4FRVOMLQCFVCTANCNFSM4H66OOPQ
.

@dipendra-sharma Thank you, works as expected ;)

Yes, for sure we will add the Desktop compatibility,
I just need time :),
Also, all contributions are welcome,
give it a try!
@MostHated

I am having a go at this to see what I can come up with.

I tried adding/changing this below. It works, but the position available for Listeners vs Gesture is only d.position and d.localPosition, so it kind of acts weird and some of the points jump to another spot on the graph with 3 lines when you get close to them slowly, lol.

I want to try a few things first to see if there is a way to fix the position before I do a PR.

class FlChart extends StatefulWidget {
  final BaseChart chart;
  var enableTap;
  var enablePointer;

  FlChart({
    Key key,
    @required this.chart,
    this.enableTap = true,
    this.enablePointer = true,
  }) : super(key: key) {
    if (chart == null) {
      throw Exception('chart should not be null');
    }
  }
  @override
  Widget build(BuildContext context) {
    return widget.enablePointer ? _withPointerInput() : widget.enableTap ? _widgetWithTap() : _widgetWithLongPress();
  }
  Widget _withPointerInput() {
    return Listener(
      onPointerEnter: (d) {
        _touchInputNotifier.value = FlLongPressStart(
          _globalToLocal(context, d.localPosition),
        );
      },
      onPointerHover: (d) {
        _touchInputNotifier.value = FlLongPressMoveUpdate(
          _globalToLocal(context, d.localPosition),
        );
      },
      onPointerExit: (d) {
        _touchInputNotifier.value = FlLongPressEnd(
          _globalToLocal(context, d.localPosition),
        );
      },
      child: CustomPaint(
        painter: widget.chart.painter(
          touchInputNotifier: _touchInputNotifier,
          touchResponseSink: widget.chart.getData().touchData.touchResponseSink,
        ),
      ),
    );
  }

No, I will not shut down this repo, I just need some free times to improve it
@odonc

Hi, @imaNNeoFighT Please add me in contributors. I've already done it, will create a PR. Both the features will be there Long press & Tap.

You can make a PR already,
clone the project,
make a new branch,
push your changes to each branch separately (or maybe both of them in one branch),
then make a PR from your Repo branch to This Repo master branch.
@dipendra-sharma

Yes, for sure we will add the Desktop compatibility,
I just need time :),
Also, all contributions are welcome,
give it a try!
@MostHated

I am having a go at this to see what I can come up with.

I tried adding/changing this below. It works, but the position available for Listeners vs Gesture is only d.position and d.localPosition, so it kind of acts weird and some of the points jump to another spot on the graph with 3 lines when you get close to them slowly, lol.

I want to try a few things first to see if there is a way to fix the position before I do a PR.

class FlChart extends StatefulWidget {
  final BaseChart chart;
  var enableTap;
  var enablePointer;

  FlChart({
    Key key,
    @required this.chart,
    this.enableTap = true,
    this.enablePointer = true,
  }) : super(key: key) {
    if (chart == null) {
      throw Exception('chart should not be null');
    }
  }
  @override
  Widget build(BuildContext context) {
    return widget.enablePointer ? _withPointerInput() : widget.enableTap ? _widgetWithTap() : _widgetWithLongPress();
  }
  Widget _withPointerInput() {
    return Listener(
      onPointerEnter: (d) {
        _touchInputNotifier.value = FlLongPressStart(
          _globalToLocal(context, d.localPosition),
        );
      },
      onPointerHover: (d) {
        _touchInputNotifier.value = FlLongPressMoveUpdate(
          _globalToLocal(context, d.localPosition),
        );
      },
      onPointerExit: (d) {
        _touchInputNotifier.value = FlLongPressEnd(
          _globalToLocal(context, d.localPosition),
        );
      },
      child: CustomPaint(
        painter: widget.chart.painter(
          touchInputNotifier: _touchInputNotifier,
          touchResponseSink: widget.chart.getData().touchData.touchResponseSink,
        ),
      ),
    );
  }

@MostHated Have you tested it? it is not working on iPhone 7.

@imaNNeoFighT

Remote: Permission to imaNNeoFighT/fl_chart.git denied to dipendra-sharma. unable to access 'https://github.com/imaNNeoFighT/fl_chart.git/': The requested URL returned error: 403

Sorry you have to firstly fork it in your profile,
Then clone it and...

@MostHated Have you tested it? it is not working on iPhone 7.

I would assume that is because iPhone does not have a pointer. It uses touch/gesture. Pointer is for desktop platforms. I don't think anything with "pointer" in the event callback will work with Android or iPhone unless you attach a mouse to it.

I tested and it works for me on both go-flutter and flutter-desktop-embedded.

https://i.imgur.com/ECBG3G9.gifv

@MostHated Pointer was not working on the iPhone device.

Yes, did you read my explanation above? Pointer only works I believe if you are running on a platform which is using the debugDefaultTargetPlatformOverride = TargetPlatform.fuchsia; override, which would typically only be desktop platforms. If you are running Android or iPhone, you would not be using pointer.

Hi, thanks all for your patience,
It is added in 0.1.6, If you had any feedback, feel free to let me know.
and also there are a lot of features to implement and pull requests are welcome.
Best regards!

@imaNNeoFighT was the MouseOver on desktop that was mentioned by @MostHated ever implemented?
I can't seem to find it in the code or documentation...

thanks!

Hi @jlubeck
At the moment our main focus is on the Quality and Stability in the android and iOS,
even though, we will focus on web and desktop, when they are stabled in the Flutter.
Thanks for reaching me out.

Also, feel free to make an issue about it,
we can follow it up there.

Ok, I was asking mainly because @MostHated seemed to had it working... I'll create the new ticket. Thank you

Was this page helpful?
0 / 5 - 0 ratings

Related issues

BadReese picture BadReese  Â·  6Comments

Mohdx picture Mohdx  Â·  4Comments

jitenders859 picture jitenders859  Â·  5Comments

alexodus picture alexodus  Â·  3Comments

mukhammad-akilov picture mukhammad-akilov  Â·  4Comments