フラッターボトムが無限ピクセルで溢れています

ライディープ

特定のウィジェットを列の子に追加すると、「底が無限ピクセルでオーバーフロー」し続けるというこの問題に直面しています。これは、次のような新しいウィジェットを追加する前の状態countdownです。

ここに画像の説明を入力してください

以下は、追加した後に何が起こるかcountdownです:

ここに画像の説明を入力してください

画面の下半分のコードを次に追加しcountdownます。

    final countdown = Countdown();

    final quizBottomContent = SingleChildScrollView(
      child: Container(
      width: MediaQuery.of(context).size.width,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[quizBottomContentText, quizOptions, countdown],
        ),
      )
    ); 

カウントダウンウィジェットは次のとおりです。

import 'package:flutter/material.dart';
import 'dart:math' as math;

class Countdown extends StatefulWidget {
  @override
  CountdownState createState() => CountdownState();
}

class CountdownState extends State<Countdown> with TickerProviderStateMixin {
  AnimationController controller;

  String get timerString {
    Duration duration = controller.duration * controller.value;
    return '${duration.inMinutes}:${(duration.inSeconds % 60).toString().padLeft(2, '0')}';
  }

  @override
  void initState() {
    super.initState();
    controller = AnimationController(
      vsync: this,
      duration: Duration(seconds: 10),
    );
  }

  @override
  Widget build(BuildContext context) {
    ThemeData themeData = Theme.of(context);
    return Scaffold(
      body: Padding(
        padding: EdgeInsets.all(8.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            Expanded(
              child: Align(
                alignment: FractionalOffset.center,
                child: AspectRatio(
                  aspectRatio: 1.0,
                  child: Stack(
                    children: <Widget>[
                      Positioned.fill(
                        child: AnimatedBuilder(
                          animation: controller,
                          builder: (BuildContext context, Widget child) {
                            return CustomPaint(
                                painter: TimerPainter(
                              animation: controller,
                              backgroundColor: Colors.white,
                              color: themeData.indicatorColor,
                            ));
                          },
                        ),
                      ),
                      Align(
                        alignment: FractionalOffset.center,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: <Widget>[
                            Text(
                              "Count Down",
                              style: themeData.textTheme.subhead,
                            ),
                            AnimatedBuilder(
                                animation: controller,
                                builder: (BuildContext context, Widget child) {
                                  return Text(
                                    timerString,
                                    style: themeData.textTheme.display4,
                                  );
                                }),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
            Container(
              margin: EdgeInsets.all(8.0),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  FloatingActionButton(
                    child: AnimatedBuilder(
                      animation: controller,
                      builder: (BuildContext context, Widget child) {
                        return Icon(controller.isAnimating
                            ? Icons.pause
                            : Icons.play_arrow);
                      },
                    ),
                    onPressed: () {
                      if (controller.isAnimating)
                        controller.stop();
                      else {
                        controller.reverse(
                            from: controller.value == 0.0
                                ? 1.0
                                : controller.value);
                      }
                    },
                  )
                ],
              ),
            )
          ],
        ),
      ),
    );
  }
}

class TimerPainter extends CustomPainter {
  TimerPainter({
    this.animation,
    this.backgroundColor,
    this.color,
  }) : super(repaint: animation);

  final Animation<double> animation;
  final Color backgroundColor, color;

  @override
  void paint(Canvas canvas, Size size) {
    Paint paint = Paint()
      ..color = backgroundColor
      ..strokeWidth = 5.0
      ..strokeCap = StrokeCap.round
      ..style = PaintingStyle.stroke;

    canvas.drawCircle(size.center(Offset.zero), size.width / 2.0, paint);
    paint.color = color;
    double progress = (1.0 - animation.value) * 2 * math.pi;
    canvas.drawArc(Offset.zero & size, math.pi * 1.5, -progress, false, paint);
  }

  @override
  bool shouldRepaint(TimerPainter old) {
    return animation.value != old.animation.value ||
        color != old.color ||
        backgroundColor != old.backgroundColor;
  }
}

いくつかのコンテキスト:カウントダウンは基本的に、このリンクから抽出したカウントダウン中のアニメーション付きのタイマーです。したがって、タイマーはボタンのすぐ下にあります。

Praneeth Dhanushka Fernando

列のmainaxissizeを設定してみてください mainAxisSize: MainAxisSize.min,

更新

さて、列のウィジェットとしてカウントダウンウィジェットを作成しようとしている場合は、カウントダウンウィジェットのビルドメソッドからスキャフォールドを削除し、コンテナーにラップして高さを定義できます。

 return Scaffold(
      body: Padding(
        padding: EdgeInsets.all(8.0),
        child: Column(

 return Container(
         height: 100,
         child: Padding(
              padding: EdgeInsets.all(8.0),
              child: Column(

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

データフレームピボットの戻りエラー:インデックスに重複するエントリが含まれています

分類Dev

エラー1004vbaピボットフィルターに値が含まれています

分類Dev

スクロールではなくコードタグにテキストが溢れています

分類Dev

コンテンツが溢れているフレックスボックスをスクロールする

分類Dev

wglCreateContextが「ピクセルフォーマットが無効です」というエラーで失敗する

分類Dev

消しゴム:「警告:このコンピューターでは、システムの復元またはボリュームシャドウコピーが有効になっています。」USBフラッシュドライブに保存されているファイルのコピーが含まれていますか?

分類Dev

Robo-Windowsタスクスケジューラを使用してGoogleファイルストリームとネットワークドライブ間でファイルをコピーすると、「アクセスが拒否されました」

分類Dev

グーグルクロームを使用したブートストラップモーダルでスタイルが壊れてピクセル化されていますか?

分類Dev

opencvでベクトル(ピクセルとしてラスターされていない)グラフィックをプロットする方法

分類Dev

ピボットテーブルの値がオフセットされているのはなぜですか?

分類Dev

リターンキーでアラートダイアログを閉じると、キーアップイベントがフォーカスされた入力ボックスに送信され、無限ループが発生します

分類Dev

Laravel 5.5モデルファクトリを使用したピボットテーブルのシード-mb_strtolower()は、パラメータ1が文字列であり、配列が指定されていることを想定しています

分類Dev

Angular 4:フォームが検証されていない限りボタンを無効にします

分類Dev

List.orderByが無限ループでスタックしています

分類Dev

タイルのゲームオブジェクトがオフセットされています

分類Dev

データがピボットテーブルの列でスライスされているときに、ALL関数がフィルターを無視しないのはなぜですか?

分類Dev

データがピボットテーブルの列でスライスされているときに、ALL関数がフィルターを無視しないのはなぜですか?

分類Dev

画面幅<576ピクセルでインラインフォーム入力および送信ボタンの位置がずれている

分類Dev

ファイルがターゲットディレクトリに存在しない場合にのみ、無限に実行されるバッチファイルにファイルをコピーするにはどうすればよいですか?

分類Dev

アクティビティのメニューがフラグメントで溢れていません

分類Dev

SharePoint:フォルダーおよびドキュメントセットに対するプログラムによるコピー/移動操作は、アトミックであることが保証されていますか?

分類Dev

jqueryでボタンをクリックするとフォームがキャンセルされ、ページがリダイレクトされます

分類Dev

フラッター無限スクロールは常にビューをリセットします

分類Dev

Ionic 2:フォームのラジオボタン。デフォルトでチェックされています

分類Dev

Xamarin Studioでターゲットプラットフォームが無効になっていますか?

分類Dev

Angularjsでモーダルポップアップ閉じるボタン(x)をクリックするとフォームがリセットされます

分類Dev

VBAユーザーフォーム:テキストボックスがクラスモジュールを使用してフォーマットされている場合、スピンボタンが機能しない

分類Dev

チェックボックスがすでにチェックされてデータベースに保存されている場合はフィールドセットを非表示にし、チェックされていない場合はフィールドセットを表示します

分類Dev

すべての入力フィールドにテキストが含まれるまでボタンクリックを無効にします(javascript&jquery)

Related 関連記事

  1. 1

    データフレームピボットの戻りエラー:インデックスに重複するエントリが含まれています

  2. 2

    エラー1004vbaピボットフィルターに値が含まれています

  3. 3

    スクロールではなくコードタグにテキストが溢れています

  4. 4

    コンテンツが溢れているフレックスボックスをスクロールする

  5. 5

    wglCreateContextが「ピクセルフォーマットが無効です」というエラーで失敗する

  6. 6

    消しゴム:「警告:このコンピューターでは、システムの復元またはボリュームシャドウコピーが有効になっています。」USBフラッシュドライブに保存されているファイルのコピーが含まれていますか?

  7. 7

    Robo-Windowsタスクスケジューラを使用してGoogleファイルストリームとネットワークドライブ間でファイルをコピーすると、「アクセスが拒否されました」

  8. 8

    グーグルクロームを使用したブートストラップモーダルでスタイルが壊れてピクセル化されていますか?

  9. 9

    opencvでベクトル(ピクセルとしてラスターされていない)グラフィックをプロットする方法

  10. 10

    ピボットテーブルの値がオフセットされているのはなぜですか?

  11. 11

    リターンキーでアラートダイアログを閉じると、キーアップイベントがフォーカスされた入力ボックスに送信され、無限ループが発生します

  12. 12

    Laravel 5.5モデルファクトリを使用したピボットテーブルのシード-mb_strtolower()は、パラメータ1が文字列であり、配列が指定されていることを想定しています

  13. 13

    Angular 4:フォームが検証されていない限りボタンを無効にします

  14. 14

    List.orderByが無限ループでスタックしています

  15. 15

    タイルのゲームオブジェクトがオフセットされています

  16. 16

    データがピボットテーブルの列でスライスされているときに、ALL関数がフィルターを無視しないのはなぜですか?

  17. 17

    データがピボットテーブルの列でスライスされているときに、ALL関数がフィルターを無視しないのはなぜですか?

  18. 18

    画面幅<576ピクセルでインラインフォーム入力および送信ボタンの位置がずれている

  19. 19

    ファイルがターゲットディレクトリに存在しない場合にのみ、無限に実行されるバッチファイルにファイルをコピーするにはどうすればよいですか?

  20. 20

    アクティビティのメニューがフラグメントで溢れていません

  21. 21

    SharePoint:フォルダーおよびドキュメントセットに対するプログラムによるコピー/移動操作は、アトミックであることが保証されていますか?

  22. 22

    jqueryでボタンをクリックするとフォームがキャンセルされ、ページがリダイレクトされます

  23. 23

    フラッター無限スクロールは常にビューをリセットします

  24. 24

    Ionic 2:フォームのラジオボタン。デフォルトでチェックされています

  25. 25

    Xamarin Studioでターゲットプラットフォームが無効になっていますか?

  26. 26

    Angularjsでモーダルポップアップ閉じるボタン(x)をクリックするとフォームがリセットされます

  27. 27

    VBAユーザーフォーム:テキストボックスがクラスモジュールを使用してフォーマットされている場合、スピンボタンが機能しない

  28. 28

    チェックボックスがすでにチェックされてデータベースに保存されている場合はフィールドセットを非表示にし、チェックされていない場合はフィールドセットを表示します

  29. 29

    すべての入力フィールドにテキストが含まれるまでボタンクリックを無効にします(javascript&jquery)

ホットタグ

アーカイブ