-2

This effect is similar to a fast-growing rectangle. Because it’s clear that it’s not just round ripples. It even exists in the google play market as in video.

  1. https://youtu.be/ttYRc_zem00
  2. https://youtu.be/8d-ki6kDgqg

How to do it using flutter?

(RaisedButton, MaterialButton have ripple effect (circle), but not sort of rectangle compared to that)

Prot_CN
  • 61
  • 2
  • 9
  • 1
    `class RectangleSplash extends InteractiveInkFeature { ...` – pskink Dec 18 '19 at 14:14
  • 1
    so do you know how to implement it? – pskink Dec 21 '19 at 09:26
  • ..... No, sir =( – Prot_CN Dec 21 '19 at 09:29
  • 1
    check how they did it with [InkSplash](https://github.com/flutter/flutter/blob/80b526ea62/packages/flutter/lib/src/material/ink_splash.dart#L98) – pskink Dec 21 '19 at 09:30
  • But I think this is a ready-made widget, because many applications have such an effect – Prot_CN Dec 21 '19 at 09:34
  • 1
    I don't think so, I checked the sources and did not find any – pskink Dec 21 '19 at 09:50
  • But look, the SleepCycle application also has such an effect! How so? https://www.youtube.com/watch?v=sAUvskohPww&feature=youtu.be – Prot_CN Dec 21 '19 at 10:29
  • 1
    maybe they all use some 3rd party library, but i am sure the flutter public SDK does not have such effect, btw what is so hard in extending `InteractiveInkFeature`? – pskink Dec 21 '19 at 10:33
  • Does the Android SDK contain this? – Prot_CN Dec 21 '19 at 10:36
  • 1
    contains what? `InteractiveInkFeature`? – pskink Dec 21 '19 at 10:37
  • No, that effect – Prot_CN Dec 21 '19 at 10:43
  • 1
    we are talking about flutter, so what android has to do with that? – pskink Dec 21 '19 at 10:45
  • You said that flutter SDK does not have effect, and I asked you, maybe then Android SDK has effect. Man :D – Prot_CN Dec 21 '19 at 10:52
  • 1
    i said that you can easily make it in flutter by extending `InteractiveInkFeature` - just like [InkSplah](https://github.com/flutter/flutter/blob/80b526ea62/packages/flutter/lib/src/material/ink_splash.dart#L98) is implemented – pskink Dec 21 '19 at 11:00
  • what "pain" do you mean? i gave you sources for `InkSplah`- it uses [Canvas.drawCircle](https://github.com/flutter/flutter/blob/80b526ea62/packages/flutter/lib/src/material/ink_splash.dart#L226) (line #226) so simply follow that code and draw any kind of rectangle you want – pskink Dec 22 '19 at 06:12

1 Answers1

0

You can use the InkWell widget to achieve the same result.

InkWell(
        onTap: () {//doSomething},
        child: Container(
            margin: EdgeInsets.all(8.0),
            child: Text("Press me"),
              ),
            )
Emanuel Muroni
  • 170
  • 3