是否可以将进度条作为指示器而不是带有图像滑块轮播的点指示器?
Is it possible to make progress bar as indicator instead of dot indicator with image slider carousel?
是否可以使用条形图作为指示器而不是使用带有图像滑块轮播颤动的点指示器?
是在堆栈小部件中使用 2 个容器吗?那么如何制作动画呢?
Here the goal that I want to achieve
您可以使用 LinearProgressIndicator
并将活动索引映射为值(值从 0 到 1)。最终根据需要设置指标样式
正如@MartinM 建议的那样,使用 LinearProgressIndicator
并明确设置其值。
看看这个例子:
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key}) : super(key: key);
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
double progress = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
LinearProgressIndicator(
value: progress,
),
const SizedBox(height: 45),
OutlinedButton(
onPressed: () => setState(() => progress += 0.1),
child: const Text('Tap for progress')),
],
),
),
);
}
}
是否可以使用条形图作为指示器而不是使用带有图像滑块轮播颤动的点指示器?
是在堆栈小部件中使用 2 个容器吗?那么如何制作动画呢?
Here the goal that I want to achieve
您可以使用 LinearProgressIndicator
并将活动索引映射为值(值从 0 到 1)。最终根据需要设置指标样式
正如@MartinM 建议的那样,使用 LinearProgressIndicator
并明确设置其值。
看看这个例子:
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key}) : super(key: key);
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
double progress = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
LinearProgressIndicator(
value: progress,
),
const SizedBox(height: 45),
OutlinedButton(
onPressed: () => setState(() => progress += 0.1),
child: const Text('Tap for progress')),
],
),
),
);
}
}