How to properly fit a CustomPainter Animation in the screen?

Actually I tried to implement a Timer. The custom painter turned out pretty good. But when I tried to put the custom painter in a row or Column it overflows. The custom paint is only displayed when I explicitly define the height and width of the container. Now I need to add a Timer String in a row with the custom paint but it doesn't work. The height and width of the container take the full size of the screen not allowing any other widget to display.

@override
  Widget build(BuildContext context) {
    double height = MediaQuery.of(context).size.height;
    double width = MediaQuery.of(context).size.width;

    return Scaffold(
      backgroundColor: Styles.primaryDarkBlue,
      body:  SafeArea(
              child: Container(
          height: height,
          width: width,
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: CustomPaint(
            painter: TimerBar(
                  animation: animation,
                )),
          ),
        ),
      ));
  }

Here is the full code.

import 'package:flutter/material.dart';


import 'package:focus7/styles.dart';

class Timer extends StatefulWidget {
  @override
  _TimerState createState() => _TimerState();
}

class _TimerState extends State<Timer> with SingleTickerProviderStateMixin {
  AnimationController controller;
  Animation animation;

  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: 7));
    animation = Tween<double>(begin: 0.1, end: 1).animate(controller);
    controller.forward();
  }

  @override
  Widget build(BuildContext context) {
    double height = MediaQuery.of(context).size.height;
    double width = MediaQuery.of(context).size.width;
    print(height);

    return Scaffold(
      backgroundColor: Styles.primaryDarkBlue,
      body:  SafeArea(
              child: Container(
          height: height,
          width: width,
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: CustomPaint(
            painter: TimerBar(
                  animation: animation,
                )),
          ),
        ),
      ));


  }
}

class TimerBar extends CustomPainter {
  final Gradient gradient = Styles.primaryGradient;
  final Color timerBarColor = Styles.primaryBlue;
  final Animation animation;

  TimerBar({this.animation}) : super(repaint: animation);

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

    Rect rect = new Rect.fromLTWH(0, 0, size.width, size.height / 25);

    RRect rrectBorder = new RRect.fromRectAndRadius(rect, Radius.circular(50));
    canvas.drawRRect(rrectBorder, paint);

    paint.style = PaintingStyle.fill;
    paint.strokeWidth = 0;
    paint.shader = gradient.createShader(rect);

    Rect rectAnim = new Rect.fromLTWH(0, 0, size.width * animation.value, size.height / 25);
    RRect rrect = new RRect.fromRectAndRadius(rectAnim, Radius.circular(50));

    canvas.drawRRect(rrect, paint);

  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) {
    // TODO: implement shouldRepaint
    return false;
  }
}

here is the output:

when I tried to nest in a row:

return Scaffold(
        backgroundColor: Styles.primaryDarkBlue,
        body: SafeArea(
          child: Row(
            children: <Widget>[
              Container(
                height: height,
                width: width,
                child: Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: CustomPaint(
                      painter: TimerBar(
                    animation: animation,
                  )),
                ),
              ),
              AnimatedBuilder(animation: controller, builder: (context, child) {
                return Text(timerString,style: TextStyle(fontSize:24 ),);
              })
            ],
          ),
        ));