Home > Back-end >  How to resize the Flutter ElevatedButton, OutlinedButton, or TextButton?
How to resize the Flutter ElevatedButton, OutlinedButton, or TextButton?

Time:10-12

So actually if we have a ListView or a Column, I struggled to resize the button this is my code:

            SizedBox(
                  height: 50,
                  width: 100,
                  child: ElevatedButton(
                    onPressed: () {
                      Navigator.push(context,
                          MaterialPageRoute(builder: (context) {
                        return const HomeScreen();
                      }));
                    },
                    child: const Text("Upload"),
                  ),
                ),

CodePudding user response:

You can try with the style parameter of the ElevetadButton

ElevatedButton(
      style: ButtonStyle(
        fixedSize: MaterialStateProperty.all(const Size(50,100)),
      ),
),

ButtonStyle allows you to define also maximumSize and minimumSize

CodePudding user response:

So I found some a little trick for this, since if we wrap the SizedBox or Container is actually not working to resize the elevatedbutton. So my trick there is I wrap the Container/SizedBox with Center widget

Center(
                child: SizedBox(
                  height: 50,
                  width: 100,
                  child: ElevatedButton(
                    onPressed: () {
                      Navigator.push(context,
                          MaterialPageRoute(builder: (context) {
                        return const HomeScreen();
                      }));
                    },
                    child: const Text("Upload"),
                  ),
                ),
              ),
  • Related