Flutter Slider组件问题：滑块无法拖动且onChanged事件未触发

开发Flutter应用时遇到Slider组件异常：模拟器中Slider显示正常，但拖动滑块无法修改数值，onChanged事件完全不触发。排查过代码逻辑，怀疑是Slider或周边组件的使用方式问题，试过相关解决思路但无效，恳请帮忙审查代码定位问题。

主页面代码 #

double cigaretteCount = 0.0;
return Scaffold(
  appBar: AppBar(
    title: Text(""),
  ),
  body: Column(
    crossAxisAlignment: CrossAxisAlignment.stretch,
    children: [
      Expanded(
        child: Row(
          children: [
            Expanded(child: MyContainer(child: Text("Container 1"))),
            Expanded(child: MyContainer(child: Text("Container 2"))),
          ],
        ),
      ),
      Expanded(
        child: Row(
          children: [
            Expanded(
                child: MyContainer(
                    child: Column(
              children: [
                Text("How many Cigarette do you smoke"),
                Text(cigaretteCount.toString()),
                Slider(
                    min: 0,
                    max: 100,
                    value: cigaretteCount,
                    onChanged: (double val) {
                      setState(() {
                        cigaretteCount = val;
                      });
                    }),
              ],

自定义组件代码 #

import 'package:flutter/material.dart';

class MyContainer extends StatelessWidget {
  final Widget child;
  final EdgeInsetsGeometry margin;

  MyContainer({required this.child, this.margin = const EdgeInsets.all(12)});

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: margin,
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.all(
          Radius.circular(15),
        ),
      ),
      child: child,
    );
  }
}

class SexWidget extends StatelessWidget {
  final sex;
  SexWidget({required this.sex});

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Icon(Icons.person),
        SizedBox(height: 10),
        Text(sex),
      ],
    );
  }
}

问题原因及修复方案 #

1. 未闭合的Widget嵌套（核心问题） #

你提供的主代码存在大量未闭合的Widget括号：Column（Slider所在的嵌套Column）、MyContainer、Expanded、Row都没有完成闭合。Flutter的Widget树要求严格的嵌套结构，不完整的嵌套会导致布局解析异常，直接阻断交互事件的传递，这是Slider无法拖动的主要原因。

修复：补全所有未闭合的括号
修复后的主代码片段：

double cigaretteCount = 0.0;
return Scaffold(
  appBar: AppBar(
    title: Text(""),
  ),
  body: Column(
    crossAxisAlignment: CrossAxisAlignment.stretch,
    children: [
      Expanded(
        child: Row(
          children: [
            Expanded(child: MyContainer(child: Text("Container 1"))),
            Expanded(child: MyContainer(child: Text("Container 2"))),
          ],
        ),
      ),
      Expanded(
        child: Row(
          children: [
            Expanded(
              child: MyContainer(
                child: Column(
                  children: [
                    Text("How many Cigarette do you smoke"),
                    Text(cigaretteCount.toString()),
                    Slider(
                      min: 0,
                      max: 100,
                      value: cigaretteCount,
                      onChanged: (double val) {
                        setState(() {
                          cigaretteCount = val;
                        });
                      },
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    ],
  ),
);

2. 确认主Widget是StatefulWidget #

setState只能在State类中使用，如果你的当前Widget是StatelessWidget，调用setState不会触发UI更新，Slider的数值也无法同步。

修复：将主Widget改为StatefulWidget
示例结构：

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

  @override
  State<CigaretteCountPage> createState() => _CigaretteCountPageState();
}

class _CigaretteCountPageState extends State<CigaretteCountPage> {
  double cigaretteCount = 0.0;

  @override
  Widget build(BuildContext context) {
    // 上述修复后的Scaffold代码放在这里
  }
}

3. 排除组件交互遮挡 #

当前你的MyContainer代码没有添加事件拦截属性（如AbsorbPointer、IgnorePointer），默认不会阻止Slider的交互事件，这部分无需修改。但如果后续给MyContainer添加了手势相关组件，需确保没有阻断事件传递。

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