waveprogressbar_flutter 0.1.2 copy "waveprogressbar_flutter: ^0.1.2" to clipboard
waveprogressbar_flutter: ^0.1.2 copied to clipboard

wave progress bar,a good widget ,welcome to ues;If you have problems using,please tell me

waveprogressbar #

pub package

双平台通用,可动态调整进度,可自定义大小尺寸等

It is a good widget,can compatible with Android and IOS,Adjustable progress,Customizable color and size

如果使用当中有什么问题,请在github里提出个issues,thankYou

If there is any problem with the use, please submit an issue in github,thankYou

My organization's github:https://github.com/OpenFlutter

Contact Me :OpenFlutter QQ群 892398530

Usage #

Add this to your package's pubspec.yaml file:

dependencies:
  waveprogressbar_flutter: "^0.1.2"

Add it to your dart file:

import 'package:waveprogressbar_flutter/waveprogressbar_flutter.dart';

Example #

import 'package:flutter/material.dart';
import 'package:waveprogressbar_flutter/waveprogressbar_flutter.dart';

class BezierCurveDemo extends StatefulWidget{
  @override
  State<StatefulWidget> createState() {
    return BezierCurveDemoState();
  }
}

class BezierCurveDemoState extends State<BezierCurveDemo>{

  final TextEditingController _controller = new TextEditingController();
  //默认初始值为0.0
  double waterHeight=0.0;
  WaterController waterController=WaterController();

  @override
  void initState() {
    super.initState();
    WidgetsBinding widgetsBinding=WidgetsBinding.instance;
    widgetsBinding.addPostFrameCallback((callback){
      //这里写你想要显示的百分比
      waterController.changeWaterHeight(0.82);
    });
  }


  @override
  Widget build(BuildContext context) {

    return new Scaffold(
      resizeToAvoidBottomPadding: false,
      appBar: new AppBar(
        title: new Text("贝塞尔曲线测试"),
      ),
      body: new Column(
        children: <Widget>[
          new Row(
            children: <Widget>[
              new Text("高度调整:    ",
                style: new TextStyle(fontSize: 20.0),
              ),
              new Container(
                width: 150.0,
                child: new TextField(
                    controller: _controller,
                    decoration: new InputDecoration(
                      hintText: "请输入高度",
                    )
                ),
              ),
              new RaisedButton(onPressed: (){
                print("waterHeight is ${_controller.toString()}");
                FocusScope.of(context).requestFocus(FocusNode());
                waterController.changeWaterHeight(double.parse(_controller.text));
              },
                child: new Text("确定"),
              ),
            ],
          ),
          new Container(
            margin: EdgeInsets.only(top: 80.0),
            child: new Center(
              child: new WaveProgressBar(
                flowSpeed: 2.0,
                waveDistance:45.0,
                waterColor: Color(0xFF68BEFC),
                //strokeCircleColor: Color(0x50e16009),
                heightController: waterController,
                percentage: waterHeight,
                size: new Size (300,300),
                textStyle: new TextStyle(
                    color:Color(0x15000000),
                    fontSize: 60.0,
                    fontWeight: FontWeight.bold),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Properties #

properties type description
size Size 控件大小 The size of widget
percentage double 进度百分比 Percentage of progress
waveHeight double 浪高 The wave height
textStyle TextStyle 文字样式 text style
waveDistance double 1/4波距 ;1/4 Wave distance
flowSpeed double 波浪滚动的速度 The speed of wave
waterColor Color 水的颜色 water color
strokeCircleColor Color 圆环的颜色 Stroke Circle Color
circleStrokeWidth double 圆环的宽度 Circle Stroke Width
heightController WaterController 进度控制器 progress Controller
23
likes
40
pub points
69%
popularity

Publisher

unverified uploader

wave progress bar,a good widget ,welcome to ues;If you have problems using,please tell me

Repository (GitHub)
View/report issues

License

Apache-2.0 (LICENSE)

Dependencies

flutter

More

Packages that depend on waveprogressbar_flutter