'Flutter: Is there an onhold option instead of oppressed once to repeat SetState

I want a button which I can hold down and then Setstate is repeating, unless I stop holding it.

I am a beginner and working at my first app. I want to calculate volume. People have to put in height, width and dept. I don't want in text(form)field, because the keyboard is necessary. I found a solution with two buttons, an add and a minus button.

I have it working, but people have to push the button very often to set the value of height they want.

I thought instead of oppressed, I use something as on hold and the counter is adding quickly. But I don't know the solution.

RawMaterialButton(
child: Icon(MdiIcons.minus),
onPressed: () {
setState(() {
width--;
buttonfluttercountersetstateflutter-onpressed


Solution 1:[1]

Ok, I didn't fix it. It was to complex for me as a beginner. I found another solution. I made a row, with three children: a minus button and a plus button for fine tuning a slider-bar for the big steps.

This is the code I used, do you have better solutions, let me know. I just place it for other beginners like me. I want to thank special @Abbas.M who tried to help me. 

Row(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[
                    AnimatedOpacity(
                      opacity: height == 1 ? 0.0 : 1.0,
                      duration: Duration(milliseconds: 500),
                      child: RawMaterialButton(
                        child: Icon(MdiIcons.minus),
                        onPressed: () {
                          setState(() {
                            height > 1 ? height-- : height = height;
                          });
                        },
                        constraints: BoxConstraints.tightFor(
                          width: 25.0,
                          height: 25.0,
                        ),
                        shape: CircleBorder(),
                        fillColor: white,
                      ),
                    ),
                    SliderTheme(
                      data: SliderTheme.of(context).copyWith(
                        inactiveTrackColor: cAppBottomBar,
                        activeTrackColor: white,
                        thumbColor: white,
                        overlayColor: cShadow,
                        thumbShape:
                            RoundSliderThumbShape(enabledThumbRadius: 10.0),
                        overlayShape:
                            RoundSliderOverlayShape(overlayRadius: 17.0),
                      ),
                      child: Slider(
                          value: height.toDouble(),
                          min: 1,
                          max: 300,
                          onChanged: (value) {
                            setState(() {
                              height = value.toInt();
                            });
                          }),
                    ),
                    AnimatedOpacity(
                      opacity: height == 300 ? 0.0 : 1.0,
                      duration: Duration(milliseconds: 500),
                      child: RawMaterialButton(
                        child: Icon(Icons.add),
                        onPressed: () {
                          setState(() {
                            height < 300 ? height++ : height = height;
                          });
                        },
                        constraints: BoxConstraints.tightFor(
                          width: 25.0,
                          height: 25.0,
                        ),
                        shape: CircleBorder(),
                        fillColor: white,
                      ),
                    ),

Solution 2:[2]

If this topic is still interesting for you, you could try holding_gesture, see https://pub.dev/packages/holding_gesture

Solution 3:[3]

You should use GestureDetector widget's onTapDown (for holding the button) and onTapUp (for the release user's finger) features.

GestureDetector(
                onTapDown: (details) {
                  print("Someone is touchin' me !!");
                },
                onTapUp: (details) {
                  print("I relaxed, oh.");
                },
                child: Container(
                  height: 100,
                  width: 100,
                  color: Colors.brown,
                )),

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Margriet
Solution 2 rgisi
Solution 3 Jeremy Caney

Related Questions