-
Notifications
You must be signed in to change notification settings - Fork 5
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #2 from KevinZhang19870314/dev
Add more wired widgets.
- Loading branch information
Showing
12 changed files
with
407 additions
and
9 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,81 @@ | ||
| import 'package:flutter/material.dart'; | ||
| import 'package:wired_elements/wired_elements.dart'; | ||
|
|
||
| import 'wired_text.dart'; | ||
|
|
||
| class WiredProgressExample extends StatefulWidget { | ||
| final String title; | ||
| const WiredProgressExample({Key? key, required this.title}) : super(key: key); | ||
|
|
||
| @override | ||
| _WiredProgressExampleState createState() => _WiredProgressExampleState(); | ||
| } | ||
|
|
||
| class _WiredProgressExampleState extends State<WiredProgressExample> | ||
| with TickerProviderStateMixin { | ||
| @override | ||
| Widget build(BuildContext context) { | ||
| final _controller1 = AnimationController( | ||
| duration: const Duration(milliseconds: 1000), vsync: this); | ||
| final _controller2 = AnimationController( | ||
| duration: const Duration(milliseconds: 1000), vsync: this); | ||
| return Scaffold( | ||
| appBar: AppBar( | ||
| title: WiredText( | ||
| '${widget.title}', | ||
| fontSize: 20.0, | ||
| ), | ||
| ), | ||
| body: Padding( | ||
| padding: EdgeInsets.symmetric(horizontal: 20.0), | ||
| child: Column( | ||
| mainAxisAlignment: MainAxisAlignment.center, | ||
| children: [ | ||
| WiredProgress(controller: _controller1, value: 0.5), | ||
| SizedBox(height: 20.0), | ||
| Row( | ||
| mainAxisAlignment: MainAxisAlignment.end, | ||
| children: [ | ||
| ..._example(_controller1), | ||
| ], | ||
| ), | ||
| SizedBox(height: 50.0), | ||
| WiredProgress(controller: _controller2), | ||
| SizedBox(height: 20.0), | ||
| Row( | ||
| mainAxisAlignment: MainAxisAlignment.end, | ||
| children: [ | ||
| ..._example(_controller2), | ||
| ], | ||
| ), | ||
| ], | ||
| ), | ||
| ), | ||
| ); | ||
| } | ||
|
|
||
| List<Widget> _example(AnimationController controller) { | ||
| return [ | ||
| WiredButton( | ||
| child: Text('Start'), | ||
| onPressed: () { | ||
| controller.forward(); | ||
| }, | ||
| ), | ||
| SizedBox(width: 20.0), | ||
| WiredButton( | ||
| child: Text('Stop'), | ||
| onPressed: () { | ||
| controller.stop(); | ||
| }, | ||
| ), | ||
| SizedBox(width: 20.0), | ||
| WiredButton( | ||
| child: Text('Reset'), | ||
| onPressed: () { | ||
| controller.reset(); | ||
| }, | ||
| ), | ||
| ]; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,51 @@ | ||
| import 'package:flutter/material.dart'; | ||
| import 'package:wired_elements/wired_elements.dart'; | ||
|
|
||
| import 'wired_text.dart'; | ||
|
|
||
| class WiredToggleExample extends StatelessWidget { | ||
| final String title; | ||
| const WiredToggleExample({Key? key, required this.title}) : super(key: key); | ||
|
|
||
| @override | ||
| Widget build(BuildContext context) { | ||
| bool _firstVal = false; | ||
| bool _secondVal = true; | ||
|
|
||
| return Scaffold( | ||
| appBar: AppBar( | ||
| title: WiredText( | ||
| '$title', | ||
| fontSize: 20.0, | ||
| ), | ||
| ), | ||
| body: Container( | ||
| color: Colors.transparent, | ||
| padding: EdgeInsets.all(50.0), | ||
| child: Column( | ||
| mainAxisAlignment: MainAxisAlignment.start, | ||
| crossAxisAlignment: CrossAxisAlignment.center, | ||
| children: [ | ||
| WiredToggle( | ||
| value: _firstVal, | ||
| onChange: (val) { | ||
| print(val); | ||
|
|
||
| return false; | ||
| }, | ||
| ), | ||
| SizedBox(height: 50.0), | ||
| WiredToggle( | ||
| value: _secondVal, | ||
| onChange: (val) { | ||
| print(val); | ||
|
|
||
| return true; | ||
| }, | ||
| ), | ||
| ], | ||
| ), | ||
| ), | ||
| ); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,111 @@ | ||
| import 'package:flutter/material.dart'; | ||
| import 'package:wired_elements/rough/rough.dart'; | ||
| import 'package:wired_elements/src/const.dart'; | ||
|
|
||
| import 'canvas/wired_canvas.dart'; | ||
| import 'wired_base.dart'; | ||
|
|
||
| /// Wired progress | ||
| /// | ||
| /// Usage: | ||
| /// ```dart | ||
| /// final _controller = AnimationController( | ||
| /// duration: const Duration(milliseconds: 1000), vsync: this); | ||
| /// ...... | ||
| /// WiredProgress(controller: _controller, value: 0.5), | ||
| /// ...... | ||
| /// _controller.forward(); | ||
| /// _controller.stop(); | ||
| /// _controller.reset(); | ||
| /// ``` | ||
| class WiredProgress extends StatefulWidget { | ||
| /// The current progress value, range is 0.0 ~ 1.0. | ||
| final double value; | ||
|
|
||
| final AnimationController controller; | ||
|
|
||
| const WiredProgress({ | ||
| Key? key, | ||
| required this.controller, | ||
| this.value = 0.0, | ||
| }) : super(key: key); | ||
|
|
||
| @override | ||
| _WiredProgressState createState() => _WiredProgressState(); | ||
| } | ||
|
|
||
| class _WiredProgressState extends State<WiredProgress> with WiredRepaintMixin { | ||
| final double _progressHeight = 20.0; | ||
| double _width = 0.0; | ||
|
|
||
| late Animation<double> _animation; | ||
| late Tween<double> _tween; | ||
|
|
||
| @override | ||
| void initState() { | ||
| super.initState(); | ||
|
|
||
| _tween = Tween<double>(begin: 0, end: 1); | ||
| _animation = _tween.animate( | ||
| CurvedAnimation( | ||
| parent: widget.controller, | ||
| curve: Curves.easeIn, | ||
| ), | ||
| )..addListener(() { | ||
| setState(() {}); | ||
| }); | ||
|
|
||
| // Delay for calculate the width `_getWidth()` during the next frame | ||
| Future.delayed(Duration(milliseconds: 0), () { | ||
| _tween.begin = widget.value; | ||
| setState(() {}); | ||
| }); | ||
| } | ||
|
|
||
| @override | ||
| Widget build(BuildContext context) { | ||
| return buildWiredElement(child: _buildWidget()); | ||
| } | ||
|
|
||
| Widget _buildWidget() { | ||
| _width = _getWidth(); | ||
|
|
||
| return Stack( | ||
| children: [ | ||
| SizedBox( | ||
| height: _progressHeight, | ||
| width: _width * _animation.value, | ||
| child: WiredCanvas( | ||
| painter: WiredRectangleBase(fillColor: borderColor), | ||
| fillerType: RoughFilter.HachureFiller, | ||
| fillerConfig: FillerConfig.build(hachureGap: 1.5), | ||
| ), | ||
| ), | ||
| SizedBox( | ||
| height: _progressHeight, | ||
| width: _width, | ||
| child: WiredCanvas( | ||
| painter: WiredRectangleBase(), | ||
| fillerType: RoughFilter.NoFiller, | ||
| ), | ||
| ), | ||
| LinearProgressIndicator( | ||
| backgroundColor: Colors.transparent, | ||
| minHeight: _progressHeight, | ||
| color: Colors.transparent, | ||
| value: _animation.value, | ||
| ), | ||
| ], | ||
| ); | ||
| } | ||
|
|
||
| double _getWidth() { | ||
| double width = 0; | ||
| try { | ||
| var box = context.findRenderObject() as RenderBox; | ||
| width = box.size.width; | ||
| } catch (e) {} | ||
|
|
||
| return width; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.