mohammed nabil
mohammed nabil

Reputation: 107

How to add multiple button in one row inside Inkwell widget in flutter

How to add multiple buttons at the top in one row,that should inside the inkwell widget.Below is the code of inkwell widget

  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Flutter Counter"),
      ),
      body:InkWell(
        onTap: () {
          setState(() { _increment();});
        },
        child:Container(
          decoration: new BoxDecoration(color: Colors.blueAccent),
          width: MediaQuery.of(context).size.width,
          height: MediaQuery.of(context).size.height,
          child:Center(
            child: Text('$counter',

              style: TextStyle(fontSize: 60.0,fontWeight: FontWeight.bold,color: Colors.white),),
          ),

        ),
      ),
    );
  }
}

Upvotes: 1

Views: 7752

Answers (1)

Constantin Chernishov
Constantin Chernishov

Reputation: 301

Wrap content of InkWell into Stack and use Row for needed buttons. If I've understood your question correct

Widget build(BuildContext context) {
  return Scaffold(
      appBar: new AppBar(
        elevation:
        Theme.of(context).platform == TargetPlatform.iOS
            ? 0.0
            : 4.0,
        title: new Text(
          "HelloFlutter",
        ),
      ),
      body: InkWell(
        onTap: () {
          setState(() { _increment();});
        },
        child: Stack(
          children: <Widget>[
            Column(
              mainAxisAlignment: MainAxisAlignment.start,
              children: <Widget>[
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  children: <Widget>[
                    FlatButton(onPressed: (){ setState(() {
                      counter = 1;
                    }); }, child: Text('Button1')),
                    FlatButton(onPressed: (){setState(() {
                      counter = 2;
                    }); }, child: Text('Button2')),
                    FlatButton(onPressed: (){setState(() {
                      counter = 3;
                    }); }, child: Text('Button3')),
                  ],
                )
              ],
            ),
            Center(
              child: Text('$counter',

                style: TextStyle(fontSize: 60.0,fontWeight: FontWeight.bold,color: Colors.red),),
            ),
          ],
        )
      ),
    );
}

Upvotes: 1

Related Questions