web-dev-qa-db-ja.com

LinearProgressIndicator Flutterの使用

私はFlutterをすべて学んでいるのですが、それが正しい決定であるかどうかはわかりません。 Material LibreryのLinearProgressIndicator Componentを使用したいが、使用方法がわからなかったので、次のコードを試してみました。

import 'Dart:async';
import 'package:flutter/material.Dart';

void main() {
runApp(new MaterialApp(
debugShowCheckedModeBanner: false,
home: new MyApp(),
 ));
}

class MyApp extends StatefulWidget {
@override
MyAppState createState() => new MyAppState();
}

class MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return new Scaffold(
  appBar: new AppBar(
    title: new Text('Slider Demo'),
  ),
  body: new Container(
    color: Colors.blueAccent,
    padding: new EdgeInsets.all(32.0),
    child: new ProgressIndicatorDemo(),
  ),
);
}
}

class ProgressIndicatorDemo extends StatefulWidget {

@override
_ProgressIndicatorDemoState createState() =>
  new _ProgressIndicatorDemoState();
}

class _ProgressIndicatorDemoState extends State<ProgressIndicatorDemo>
with SingleTickerProviderStateMixin {
AnimationController _controller;

@override
void initState() {
super.initState();
_controller = new AnimationController(
  duration: const Duration(milliseconds: 1500),
  vsync: this,
);
_playAnimation();
}

 Future<Null> _playAnimation() async {
  try {
  await _controller.repeat().orCancel;
  } on TickerCanceled {
  // the animation got canceled, probably because we were disposed
  }
  }

  @override
  void dispose() {
  _controller.stop();
  super.dispose();
  }

  @override
  Widget build(BuildContext context) {
  return _buildAnimation(context, null);
 }

 Widget _buildAnimation(BuildContext context, Widget child) {
 return new Center(
    child: new Container(
  color: Colors.redAccent.withOpacity(.1),
  child: new LinearProgressIndicator(
    value: _controller.value,
    backgroundColor: Colors.redAccent,
  ),
   ));
  }
 }

しかし、私はいつもこのエラーが出ます

I/flutter ( 3819): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY 
╞═══════════════════════════════════════════════════════════
I/flutter ( 3819): The following NoSuchMethodError was thrown building 
ProgressIndicatorDemo(dirty, state:
I/flutter ( 3819): _ProgressIndicatorDemoState#80400(ticker active)):
I/flutter ( 3819): The getter 'value' was called on null.
I/flutter ( 3819): Receiver: null
I/flutter ( 3819): Tried calling: value
I/flutter ( 3819):
I/flutter ( 3819): When the exception was thrown, this was the stack:
I/flutter ( 3819): #0      Object.noSuchMethod 
(Dart:core/runtime/libobject_patch.Dart:46:5)
I/flutter ( 3819): #1      _ProgressIndicatorDemoState.build 
(file:///E:/Flutter_work/animation_test/lib/main.Dart:67:26)
I/flutter ( 3819): #2      StatefulElement.build 
(package:flutter/src/widgets/framework.Dart:3730:27)
I/flutter ( 3819): #3      ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3642:15)
I/flutter ( 3819): #4      Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #5      StatefulElement.update 
(package:flutter/src/widgets/framework.Dart:3799:5)
I/flutter ( 3819): #6      Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #7      SingleChildRenderObjectElement.update 
(package:flutter/src/widgets/framework.Dart:4661:14)
I/flutter ( 3819): #8      Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #9      SingleChildRenderObjectElement.update 
(package:flutter/src/widgets/framework.Dart:4661:14)
I/flutter ( 3819): #10     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #11     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #12     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #13     StatelessElement.update 
(package:flutter/src/widgets/framework.Dart:3702:5)
I/flutter ( 3819): #14     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #15     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #16     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #17     ProxyElement.update 
(package:flutter/src/widgets/framework.Dart:3909:5)
I/flutter ( 3819): #18     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #19     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #20     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #21     ProxyElement.update 
(package:flutter/src/widgets/framework.Dart:3909:5)
I/flutter ( 3819): #22     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #23     RenderObjectElement.updateChildren 
(package:flutter/src/widgets/framework.Dart:4379:32)
I/flutter ( 3819): #24     MultiChildRenderObjectElement.update 
(package:flutter/src/widgets/framework.Dart:4769:17)
I/flutter ( 3819): #25     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #26     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #27     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #28     StatefulElement.update 
(package:flutter/src/widgets/framework.Dart:3799:5)
I/flutter ( 3819): #29     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #30     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #31     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #32     ProxyElement.update 
(package:flutter/src/widgets/framework.Dart:3909:5)
I/flutter ( 3819): #33     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #34     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #35     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #36     StatefulElement.update 
(package:flutter/src/widgets/framework.Dart:3799:5)
I/flutter ( 3819): #37     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #38     SingleChildRenderObjectElement.update 
(package:flutter/src/widgets/framework.Dart:4661:14)
I/flutter ( 3819): #39     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #40     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #41     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #42     StatelessElement.update 
(package:flutter/src/widgets/framework.Dart:3702:5)
I/flutter ( 3819): #43     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)   
I/flutter ( 3819): #44     SingleChildRenderObjectElement.update 
(package:flutter/src/widgets/framework.Dart:4661:14)
I/flutter ( 3819): #45     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #46     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #47     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #48     StatefulElement.update 
(package:flutter/src/widgets/framework.Dart:3799:5)
I/flutter ( 3819): #49     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #50     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #51     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #52     StatefulElement.update 
(package:flutter/src/widgets/framework.Dart:3799:5)
I/flutter ( 3819): #53     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #54     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #55     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #56     ProxyElement.update 
(package:flutter/src/widgets/framework.Dart:3909:5)
I/flutter ( 3819): #57     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #58     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #59     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #60     ProxyElement.update 
(package:flutter/src/widgets/framework.Dart:3909:5)
I/flutter ( 3819): #61     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #62     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #63     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)
I/flutter ( 3819): #64     StatefulElement.update 
(package:flutter/src/widgets/framework.Dart:3799:5)
I/flutter ( 3819): #65     Element.updateChild 
(package:flutter/src/widgets/framework.Dart:2699:15)
I/flutter ( 3819): #66     ComponentElement.performRebuild 
(package:flutter/src/widgets/framework.Dart:3653:16)
I/flutter ( 3819): #67     Element.rebuild 
(package:flutter/src/widgets/framework.Dart:3495:5)  
I/flutter ( 3819): #68     BuildOwner.buildScope 
(package:flutter/src/widgets/framework.Dart:2242:33)
 Reloaded 0 of 391 libraries in 829ms.
 Lost connection to device.

それを愛する方法と、このデモを実行するためのトリード Flutter進行状況インジケーターデモ でも同じ結果だれでもそれについての例の作業を手伝ったり、コードのどこが間違っているかを教えたりできますか？よろしく

Error Screen Shot

androiddartmaterial-designflutterflutter-animation
5
DoctorDoom

アニメーションオブジェクトを使用していません。

import 'Dart:async';
import 'package:flutter/material.Dart';

void main() {
  runApp(new MaterialApp(
    debugShowCheckedModeBanner: false,
    home: new MyApp(),
  ));
}

class MyApp extends StatefulWidget {
  @override
  MyAppState createState() => new MyAppState();
}

class MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Slider Demo'),
      ),
      body: new Container(
        color: Colors.blueAccent,
        padding: new EdgeInsets.all(32.0),
        child: new ProgressIndicatorDemo(),
      ),
    );
  }
}

class ProgressIndicatorDemo extends StatefulWidget {

  @override
  _ProgressIndicatorDemoState createState() =>
      new _ProgressIndicatorDemoState();
}

class _ProgressIndicatorDemoState extends State<ProgressIndicatorDemo>
    with SingleTickerProviderStateMixin {
  AnimationController controller;
  Animation<double> animation;

  @override
  void initState() {
    super.initState();
    controller = AnimationController(
        duration: const Duration(milliseconds: 2000), vsync: this);
    animation = Tween(begin: 0.0, end: 1.0).animate(controller)
      ..addListener(() {
        setState(() {
          // the state that has changed here is the animation object’s value
        });
      });
    controller.repeat();
  }


  @override
  void dispose() {
    controller.stop();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return new Center(
        child: new Container(
          child:  LinearProgressIndicator( value:  animation.value,),

        )
    );
  }

}
3
Viren V Varasadiya

これを試して ：

の代わりに

value: _controller.value,

使用する

value: _controller.value ?? 0.0,

私が作成したパッケージを使用することもできます。アニメーションがあります。

https://pub.dartlang.org/packages/percent_indicator

2
diegoveloper

この問題の解決策はFlutterチャネルをベータチャネルからマスターチャネルに切り替えるで、その後上記のコードが機能しました

0
DoctorDoom