Change the button size by passing the parameters in the constructor

Rhishikesh12

I want to change the button width when the user passes the parameter to the constructor, whether they want a full-width button or a normal-width button. However, I have tried to implement it, but the width of the button is not changing.

here's my code:

SmallButtonsElevated.dart

import 'package:flutter/material.dart';

class SmallButtonsElevated extends StatefulWidget {
  final String buttonName;
  final Color color;
  final bool isFullWidth;

  const SmallButtonsElevated({
    required this.buttonName,
    required this.color,
    this.isFullWidth = false,
    Key? key,
  }) : super(key: key);

  @override
  State<SmallButtonsElevated> createState() => _SmallButtonsElevatedState();
}

class _SmallButtonsElevatedState extends State<SmallButtonsElevated> {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Container(
        margin: EdgeInsets.all(16),
        child: ElevatedButton(
          onPressed: () {
            // Handle button press
          },
          style: ElevatedButton.styleFrom(
            backgroundColor: widget.color,
            minimumSize: widget.isFullWidth
                ? const Size(double.infinity, 60)
                : const Size(100, 60),
            shape:
                RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
          ),
          child: Text(
            widget.buttonName,
            style: const TextStyle(color: Colors.white),
          ),
        ),
      ),
    );
  }
}

allButtons.dart

import 'package:flutter/material.dart';
import 'package:navbars/Buttons/smallButtons/smallButtonsElevated.dart';

class AllButtonsClass extends StatefulWidget {
  const AllButtonsClass({super.key});

  @override
  State<AllButtonsClass> createState() => _AllButtonsClassState();
}

class _AllButtonsClassState extends State<AllButtonsClass> {
  @override
  Widget build(BuildContext context) {
    List<Widget> functionList = [
      const SmallButtonsElevated(
        buttonName: 'Button',
        color: Colors.redAccent,
      ),
    ];
    return Scaffold(
      body: ListView.builder(
        itemCount: functionList.length,
        itemBuilder: (context, index) {
          return functionList[index];
        },
      ),
    );
  }
}


I tried to pass the parameters in the constructor, but it did not work. The button width remained the same, as if it was set to full width instead of normal width. Can you please help me solve this issue?

tk_tanz

Since you are using it inside Listview.builder it is taking up the full width. you can just wrap the button with centre it will work as expected.

import 'package:flutter/material.dart';
import 'package:navbars/Buttons/smallButtons/smallButtonsElevated.dart';

class AllButtonsClass extends StatefulWidget {
  const AllButtonsClass({super.key});

  @override
  State<AllButtonsClass> createState() => _AllButtonsClassState();
}

class _AllButtonsClassState extends State<AllButtonsClass> {
  @override
  Widget build(BuildContext context) {
    List<Widget> functionList = [
      const Center(child:SmallButtonsElevated(
        buttonName: 'Button',
        color: Colors.redAccent,
      ),),
    ];
    return Scaffold(
      body: ListView.builder(
        itemCount: functionList.length,
        itemBuilder: (context, index) {
          return functionList[index];
        },
      ),
    );
  }
}

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

TOP Ranking

  1. 1

    Failed to listen on localhost:8000 (reason: Cannot assign requested address)

  2. 2

    Loopback Error: connect ECONNREFUSED 127.0.0.1:3306 (MAMP)

  3. 3

    How to import an asset in swift using Bundle.main.path() in a react-native native module

  4. 4

    pump.io port in URL

  5. 5

    Compiler error CS0246 (type or namespace not found) on using Ninject in ASP.NET vNext

  6. 6

    BigQuery - concatenate ignoring NULL

  7. 7

    ngClass error (Can't bind ngClass since it isn't a known property of div) in Angular 11.0.3

  8. 8

    ggplotly no applicable method for 'plotly_build' applied to an object of class "NULL" if statements

  9. 9

    Spring Boot JPA PostgreSQL Web App - Internal Authentication Error

  10. 10

    How to remove the extra space from right in a webview?

  11. 11

    java.lang.NullPointerException: Cannot read the array length because "<local3>" is null

  12. 12

    Jquery different data trapped from direct mousedown event and simulation via $(this).trigger('mousedown');

  13. 13

    flutter: dropdown item programmatically unselect problem

  14. 14

    How to use merge windows unallocated space into Ubuntu using GParted?

  15. 15

    Change dd-mm-yyyy date format of dataframe date column to yyyy-mm-dd

  16. 16

    Nuget add packages gives access denied errors

  17. 17

    Svchost high CPU from Microsoft.BingWeather app errors

  18. 18

    Can't pre-populate phone number and message body in SMS link on iPhones when SMS app is not running in the background

  19. 19

    12.04.3--- Dconf Editor won't show com>canonical>unity option

  20. 20

    Any way to remove trailing whitespace *FOR EDITED* lines in Eclipse [for Java]?

  21. 21

    maven-jaxb2-plugin cannot generate classes due to two declarations cause a collision in ObjectFactory class

HotTag

Archive