Question

我正在尝试在底部绘制一个矩形，只有Rect对象Rect.fromLTRB没有绘制。

我不知道我是以错误的方式解释Rect对象还是错误地写了drawRect对象。

你能帮我在底部画一个矩形吗？

import 'package:flutter/material.dart';

void main() {
  runApp(new MaterialApp(home: new HomePage()));
}

class HomePage extends StatefulWidget {
  @override
  HomePageState createState() => new HomePageState();
}

class HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new Stack(
        children: <Widget>[
          new Positioned(
            bottom: 0.0,
            left: 0.0,
            right: 0.0,
            top: 0.0,
            child: new CustomPaint(
              painter: new Sky(),
            )
          ),
        ]
      )
    );
  }
}

class Sky extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    canvas.drawRect(
      new Rect.fromLTRB(
        0.0, 100.0, 0.0, 0.0
      ),
      new Paint()..color = new Color(0xFF0099FF),
    );
  }

  @override
  bool shouldRepaint(Sky oldDelegate) {
    return false;
  }
}

Answer 1

你的左右是相同的（0.0）所以它绘制一个空的矩形。坐标也从顶部开始，因此底部应该>最佳;试试这个

new Rect.fromLTRB（ 0.0,0.0,20.0,100.0 ）

Answer 2

按照矩形位于屏幕底部的代码：

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

void main() {
  runApp(new MaterialApp(home: new HomePage()));
}

class HomePage extends StatefulWidget {
  @override
  HomePageState createState() => new HomePageState();
}

class HomePageState extends State<HomePage> {

  @override
  Widget build(BuildContext context) {
    final ui.Size logicalSize = MediaQuery.of(context).size;
    final double _width = logicalSize.width;
    final double _height = logicalSize.height;
    double _rectHeight = 50.0;
    return new Scaffold(
      body: new Stack(
        children: <Widget>[
          new Positioned(
            bottom: 0.0,
            left: 0.0,
            top: _height - _rectHeight,
            right: 0.0,
            child: new CustomPaint(
              painter: new Sky(_width, _rectHeight),
              child: new Text('$_width'),
            )
          ),
        ]
      )
    );
  }
}

class Sky extends CustomPainter {
  final double _width;
  final double _rectHeight;
  Sky(this._width, this._rectHeight);

  @override
  void paint(Canvas canvas, Size size) {
    canvas.drawRect(
      new Rect.fromLTRB(
        0.0, 0.0, this._width, _rectHeight
      ),
      new Paint()..color = new Color(0xFF0099FF),
    );
  }

  @override
  bool shouldRepaint(Sky oldDelegate) {
    return false;
  }
}

颤动 - 在底部绘制一个矩形

2 个答案: