Flutter里有个很好用的东西，可以方便我们来进行页面组件的布局调试，话不多说，上代码

1.找到main.dart引入rendering.dart

import 'package:flutter/rendering.dart';

2.添加main入口页面调试代码

void main() {

  // 调试布局重点代码

  debugPaintSizeEnabled=true;

  runApp(new MyApp());

}

3.如下图所示

4.使用restart，如果你用的VSCODE编辑器，在编辑器终端中，按大写的R就可以了

另外再说一下哦，如果你是用的是VSCODE的话，在终端里按p键，可以隐藏这些调试，再按一下又出来了

总之啦，大功告成~~

Flutter2.X学习之路--调试页面布局好用的办法的更多相关文章

  1. ie、firefox、chrome中关于style="display:block" 引发的页面布局错乱的解决办法

    ie.firefox.chrome中关于style="display:block" 引发的页面布局错乱的解决办法: table中tr 添加style="display:b ...

  2. Qt 学习之路：元素布局

    上一章我们介绍了 QML 中用于定位的几种元素,被称为定位器.除了定位器,QML 还提供了另外一种用于布局的机制.我们将这种机制成为锚点(anchor).锚点允许我们灵活地设置两个元素的相对位置.它使 ...

  3. Day7前端学习之路——多栏布局

    该文章主要讨论两栏布局和三栏布局,三栏布局包括很著名的圣杯布局和双飞翼布局 一.两栏布局的七种方法(左边固定,右边自适应) 原理: block水平元素宽度能够跟随父容器调节的流动特性,block级别的 ...

  4. Qt学习之路

      Qt学习之路_14(简易音乐播放器)   Qt学习之路_13(简易俄罗斯方块)   Qt学习之路_12(简易数据管理系统)   Qt学习之路_11(简易多文档编辑器)   Qt学习之路_10(Qt ...

  5. 学习android开发之路（一）页面布局

    Android页面布局 1.Android页面布局一共分为6种: LinearLayout(线性布局).RelativeLayout(相对布局).TableLayout(表格布局).FrameLayo ...

  6. CSS3与页面布局学习总结（四）——页面布局大全

    一.负边距与浮动布局 1.1.负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的功能 ...

  7. CSS3与页面布局学习笔记（四）——页面布局大全(负边距、双飞翼、多栏、弹性、流式、瀑布流、响应式布局)

    一.负边距与浮动布局 1.1.负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的功能 ...

  8. CSS3与页面布局学习总结（四）——页面布局大全BFC、定位、浮动、7种垂直居中方法

    目录 一.BFC与IFC 1.1.BFC与IFC概要 1.2.如何产生BFC 1.3.BFC的作用与特点 二.定位 2.2.relative 2.3.absolute 2.4.fixed 2.5.z- ...

  9. CSS3与页面布局学习总结（四）——页面布局的多种方法

    一.负边距与浮动布局   1.1.负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的 ...

随机推荐

  1. 题解 CF327A Flipping Game

    前言 数据水的一批,\(\mathcal{O}(n^3)\) 给过我觉得是不应该的. 题意 有一个由 \(0\) 和 \(1\) 组成的序列 \(a_1,a_2,a_3,a_4....,a_n\) . ...

  2. Android 跨进程渲染

    本项目用于验证 Android 是否能够跨进程渲染 View,最终实现了在子进程创建WebView,主进程显示的功能. 一.跨进程渲染的意义 有一些组件比如 WebView 如果在主进程初始化,会大大 ...

  3. 微信DAT文件解密（dat转图像）

    微信电脑版现在已经是日常工作生活必不可少的工具,有时候删除了聊天记录或者被系统清理软件清理了,但还想查看曾经的微信聊天图片. 这个时候辛辛苦苦找到了文件,却发现无法查看,因为微信电脑版为了保护我们的隐 ...

  4. 2022春每日一题：Day 35

    题目:[NOI Online #1 提高组] 冒泡排序 看到范围这么大,求逆序对,有修改,估计也只能树状数组了,考查冒泡排序性质,排第i次冒泡排序,总逆序对个数会减少i的逆序对个数,然后交换两个数,他 ...

  5. JUC-学习笔记

    传统的多线程开发方式 implements Runnable public class oldThreadDev implements Runnable { @Override public void ...

  6. 【每日一题】【动态规划&二分】2022年2月9日-NC91 最长上升子序列(三)

    描述给定数组 arr ,设长度为 n ,输出 arr 的最长上升子序列.(如果有多个答案,请输出其中 按数值(注:区别于按单个字符的ASCII码值)进行比较的 字典序最小的那个) 方法1:双层循环实现 ...

  7. 【每日一题】【直接循环&二分查找】2022年2月10日-NC32 求平方根

    描述实现函数 int sqrt(int x).计算并返回 x 的平方根(向下取整) 方法1:直接循环 import java.util.*; public class Solution { /** * ...

  8. 解读JVM级别本地缓存Caffeine青出于蓝的要诀 —— 缘何会更强、如何去上手

    大家好,又见面了. 本文是笔者作为掘金技术社区签约作者的身份输出的缓存专栏系列内容,将会通过系列专题,讲清楚缓存的方方面面.如果感兴趣,欢迎关注以获取后续更新. 在前面的几篇文章中,我们一起聊了下本地 ...

  9. 跨机房ES同步实战

    作者:谢泽华 背景 众所周知单个机房在出现不可抗拒的问题(如断电.断网等因素)时,会导致无法正常提供服务,会对业务造成潜在的损失.所以在协同办公领域,一种可以基于同城或异地多活机制的高可用设计,在保障 ...

  10. jQuery类库

    jQuery介绍 1. jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2. jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行A ...