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. Nginx四层负载均衡1

    1.Nginx负载均衡Redis 服务器 IP地址 作用 系统版本 Nginx代理服务器 10.0.0.38 负载均衡服务器 Rocky8.6 Redis服务器1 10.0.0.18 Redis服务器 ...

  2. 利用xtrabackup8完全,增量备份及还原MySQL8

    利用xtrabackup8完全,增量备份及还原MySQL8 1.环境准备 服务器 作用 数据库版本 xtrabackup版本 10.0.0.8 数据备份 mysql8.0.26 8.0.28 10.0 ...

  3. 嵌入式学习-c语言篇01:搭建C语言环境

    使用NotePad++和gcc编译器来搭建c语言环境 NotePad++:C语言编码器 gcc:C语言编译器 这两个软甲可以去官网下载 下载好进入该文件夹,如图: 添加环境变量:直接cmd,运行gcc ...

  4. 【云原生 · DevOps】DevOps 解决方案

    DevOps 解决方案 1.1 容器化 CI/CD 1.2 容器化流水线 1.3 深度集成 Jenkins 1.4 灰度发布 1.5 制品库设计 1.6 DevOps 安全 1.6.1 CI/CD 安 ...

  5. AArch32/AArch64应用程序级内存模型(五)

    本文主要为了记录在学习armv8的过程中的一些感悟.由于原文部分章节晦涩难懂,作者参考了网上很多优秀博主的部分章节(可能是直接摘录)并结合自己的理解重新整理了当前这个版本.文中不免有部分章节讲解很浅, ...

  6. python仿写js算法二

    前言 之前写过一篇用python 仿写 js 算法,当时以为大部分语法都已经能很好的在python找到对应的语法结构,直到前几天我用 python 仿写了 慕课网解析视频加密的算法,我发现很多之前没遇 ...

  7. Mybatis SQL 对应Oracle中javaType和jdbcType对应

    <resultMap type="java.util.Map" id="resultjcm"> <result property=" ...

  8. mybatis中xml的sql之test中文报错

    在mybatis中sql,test中文报错( java.lang.NumberFormatException 这句话明确告诉了我们是数字格式异常).需加.tostring(). <if test ...

  9. MICCAI 论文投稿须知翻译

    MICCAI 论文投稿须知翻译 以MICCAI 2021 PAPER SUBMISSION AND REBUTTAL GUIDELINES为例,每年投稿须知类似 作者信息和rebuttal 本文件包含 ...

  10. Datawhale组队学习_Task02:详读西瓜书+南瓜书第3章

    第3章 线性模型 家人们又来吃瓜了! 3.1 基本形式 线性模型的本质是通过一个所有属性的线性组合进行预测的函数,即 $\mathcal{f(x)=w_1x_1+w_2x_2+...+w_dx_d+b ...