10_flutter_BottomSheet(底部滑起列表),Step(步骤),LinearProgressIndicator(进度条)

1_BottomSheet(底部滑起列表)


import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    home: MyApp()
  ));
}

class MyApp extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('showModalBottomSheet')
      ),
      body: Center(
        child: RaisedButton(
          child: Text('肯定'),
          onPressed: () {
            showModalBottomSheet<Null>(context:context, builder:(BuildContext context) {
              return Container(
                height: 100,
                child: Column(
                  children: <Widget>[
                    RaisedButton(
                              child: Text('升压'),
                              onPressed: () {
                                Navigator.of(context).pop();
                              }),
                           RaisedButton(
                              child: Text('降压'),
                              onPressed: () {
                                Navigator.of(context).pop();
                              }),    
                  ],
                )
              );
            });
          }
        )
      )
    );
  }
}
复制代码

2_Step(步骤)


import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
      home: MyHome()));
}

class MyHome extends StatefulWidget {
  @override
  MyHomeState createState() => MyHomeState();
}

class MyHomeState extends State<MyHome> {
  int currentstep = 0;
  List<Step> powerstep = [
    Step(
        title: Text("电感 1"),
        content: Text("测试1"),
        isActive: true),
    Step(
        title: Text("二极管 2"),
        content: Text("测试2"),
        state: StepState.editing,
        isActive: true),
    Step(
        title: Text("电容 3"),
        content: Text("测试3"),
        isActive: true),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar:AppBar(
        title: Text("Simple Material App"),
      ),
      body: Container(
          child: Stepper(
        currentStep: this.currentstep,
        steps: powerstep,
        type: StepperType.vertical,

        onStepTapped: (step) {
          setState(() {
            currentstep = step;
          });
        },

        onStepCancel: () {
          setState(() {
            if (currentstep > 0) {
              currentstep = currentstep - 1;
            } else {
              currentstep = 0;
            }
          });
        },

        onStepContinue: () {
          setState(() {
            if (currentstep < powerstep.length - 1) {
              currentstep = currentstep + 1;
            } else {
              currentstep = 0;
            }
          });
        },

      )),
    );
  }
}
复制代码

3_LinearProgressIndicator(进度条)


import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    home: MyApp(),
  ));
}
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("LinearProgressIndicator"),
      ),
      body:LinearProgressIndicator(),
    );
  }
}
复制代码

相关文章
相关标签/搜索