颤动滑块activeTrackHeight 和 inactiveTrackHeight

问题描述

Flutter Slider

为什么 activeTrackHeight 和 inactiveTrackHeight 长度不同? 我希望它们的长度相同。 如何修复我的代码? 请帮忙。

我使用 Android Studio 4.0 和颤振 1.22.3

我尝试了一些自定义滑块包并在搜索引擎中搜索解决方案,但找不到。

对不起,我的英语不好。

import 'package:Flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',theme: ThemeData(
        sliderTheme: SliderThemeData(
          trackHeight: 14,thumbColor: Colors.white,thumbShape: RoundSliderThumbShape(enabledThumbRadius: 7),valueIndicatorColor: Colors.orange,overlayColor: Colors.transparent,activeTrackColor: Colors.black,activeTickMarkColor: Colors.red,inactiveTrackColor: Colors.black,inactiveTickMarkColor: Colors.grey,),home: MyHomePage(title: 'Flutter Demo Home Page'),);
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key,this.title}) : super(key: key);
  final String title;
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  double val=1;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[
            Text(
              'activeTrackHeight and inactiveTrackHeight',Container(
              width: 140,height: 240,child: Transform.scale(
                scale: 4.0,child: Slider(
                  value: val,min: 0,max: 2,divisions: 2,onChanged: (double value) {
                    setState (() {
                      val = value;
                    });
                  },],);
  }
}

解决方法

trackShape: RectangularSliderTrackShape() 添加到您的 SliderThemeData

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',theme: ThemeData(
        sliderTheme: SliderThemeData(
          trackShape: RectangularSliderTrackShape(),trackHeight: 14,thumbColor: Colors.white,thumbShape: RoundSliderThumbShape(enabledThumbRadius: 7),valueIndicatorColor: Colors.orange,overlayColor: Colors.transparent,activeTrackColor: Colors.black,activeTickMarkColor: Colors.red,inactiveTrackColor: Colors.black,inactiveTickMarkColor: Colors.grey,),home: MyHomePage(title: 'Flutter Demo Home Page'),);
  }
}