Flutter自定义按钮尺寸修改无效，如何调整按钮宽高？

你的代码里用SizedBox包裹ElevatedButton但宽度始终不变，核心原因是ElevatedButton本身带有默认的最小尺寸约束，这个约束会优先于外层SizedBox的设置，导致按钮无法缩小到预期宽度。

直接修改ElevatedButton的样式即可解决问题，以下是两种可行方案：

方案1：保留外层SizedBox，覆盖按钮默认约束 #

通过设置minimumSize和padding来移除按钮的默认尺寸限制，让SizedBox的设置生效：

import 'package:flutter/material.dart';

class CustomAppButton extends StatelessWidget {
  final VoidCallback onPressed;
  final String title;
  final double? height;
  final double? width;

  const CustomAppButton({
    required this.onPressed,
    required this.title,
    this.height = 64, 
    this.width = 284, 
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: width,
      height: height,
      child: ElevatedButton(
        onPressed: onPressed,
        style: ElevatedButton.styleFrom(
          backgroundColor: Colors.white,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(20),
          ),
          // 关键：覆盖按钮默认的最小尺寸约束
          minimumSize: Size.zero,
          // 移除按钮内部默认内边距，避免留白影响实际尺寸
          padding: EdgeInsets.zero,
        ),
        child: Text(
          title,
          style: const TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.bold,
            color: Colors.black,
          ),
        ),
      ),
    );
  }
}

方案2：直接在按钮样式中指定固定尺寸 #

不需要外层SizedBox，直接通过fixedSize属性设置按钮的宽高：

import 'package:flutter/material.dart';

class CustomAppButton extends StatelessWidget {
  final VoidCallback onPressed;
  final String title;
  final double? height;
  final double? width;

  const CustomAppButton({
    required this.onPressed,
    required this.title,
    this.height = 64, 
    this.width = 284, 
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: onPressed,
      style: ElevatedButton.styleFrom(
        backgroundColor: Colors.white,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(20),
        ),
        // 直接设置按钮固定尺寸
        fixedSize: Size(width ?? 284, height ?? 64),
      ),
      child: Text(
        title,
        style: const TextStyle(
          fontSize: 16,
          fontWeight: FontWeight.bold,
          color: Colors.black,
        ),
      ),
    );
  }
}

额外注意：如果按钮的父容器（如Row、Column）带有严格的布局约束，可能需要配合Expanded或Flexible组件，确保父容器允许按钮使用指定的尺寸。

内容的提问来源于stack exchange，提问作者CodeBuddy