004 flutter基础 初始文件讲解(3)

之前,我们正向的学习了一些flutter的基础,如MaterialApp,Scaffold之类的东西,那么接下来,我们将正式接触原代码:

import 'package:flutter/material.dart';void main() {runApp(const MyApp());
}class MyApp extends StatelessWidget {const MyApp({super.key});@overrideWidget build(BuildContext context) {return MaterialApp(title: 'Flutter Demo',theme: ThemeData(colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),),home: const MyHomePage(title: 'Flutter Demo Home Page'),);}
}class MyHomePage extends StatefulWidget {const MyHomePage({super.key, required this.title});final String title;@overrideState<MyHomePage> createState() => _MyHomePageState();
}class _MyHomePageState extends State<MyHomePage> {int _counter = 0;void _incrementCounter() {setState(() {_counter++;});}@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(backgroundColor: Theme.of(context).colorScheme.inversePrimary,title: Text(widget.title),),body: Center(child: Column(mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[const Text('You have pushed the button this many times:'),Text('$_counter',style: Theme.of(context).textTheme.headlineMedium, ),],),),floatingActionButton: FloatingActionButton(onPressed: _incrementCounter, tooltip: 'Increment', child: const Icon(Icons.add), ), );}
}

补充:为什么说在flutter里面,万物皆为widget?

widget是flutter里面的一个类,由于好多类的创建都是继承于它,可以说绝大部分都来自于widget,包括但不限于之前看见的,Text,Scaffold,所以就有了这个说法

接下来,我们将逐行讲解:

import 'package:flutter/material.dart';void main() {runApp(const MyApp());
}

与之前不同的是,这里我们直接调用了MyApp,这里并非是调用类,虽然说MyApp确实是一个类,但是实际上这里是创建了一个类的实例,MyApp并非是flutter自带的类,而是后面我们创建的,见下:

class MyApp extends StatelessWidget {const MyApp({super.key});@overrideWidget build(BuildContext context) {return MaterialApp(title: 'Flutter Demo',theme: ThemeData(colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),),home: const MyHomePage(title: 'Flutter Demo Home Page'),);}
}

这里我们可以看见,MyApp是继承了StatelessWidget的一个类,如果这个时候你按住ctrl键,然后点击StatelessWidget,你就会发现StatelessWidget就是继承自Widget类,正好印证了上面的“万物皆为widget”的说法。

第一步自然是将StatelessWidget的属性继承过来,也就是通过super方法,调用父类的构造函数,值得注意的是,由于所有的widget都继承于widget,而widget有一个key属性,所以是super.key,key可以帮助程序识别widget的身份

这里的title指的是外面的名称,不是页面内,而是指启动程序后,程序的名称(当然,要改设置,不然你看见的名称应该是文件名,或者通过其他代码来修改,这里就先不说),在theme里面,可以设置主题颜色,通过seedColor,可以根据实际情况生成合适的颜色背景,而不用每个地方都由自己设置

最后,设置主界面,当然,这里可以看见,我们通过MyHomePage创建了一个实例,而之于MyHomePage是什么,请见下方,在此之前,还有一个title,这个title指的是标题处的title,也就是主界面顶部的位置的标题

class MyHomePage extends StatefulWidget {const MyHomePage({super.key, required this.title});final String title;@overrideState<MyHomePage> createState() => _MyHomePageState();
}

这里我们可以看见,MyHomePage继承于StatefulWidget(当然,按住ctrl键点击StatefulWidget,你会发现它继承于Widget),首先我们通过super方法,继承父类的构造函数,当然,我们这里需要一个标题,因为是MyHomePage嘛,所以这里还要一个“required this.title”,required表示这个是必须的,而this.title则是将传入的参数值直接赋值给当前类的 title 属性,当然,这里面还没有title,所以需要下面的final String title来接收,值得注意的是,这里使用的是final,所以值传入后将不可修改

最后通过@override进行重写父类方法

在StatefulWidget中,有个方法叫做createState方法,这里就是重写这个方法

首先,通过State限定类型,必须是 State<具体Widget类型> 的子类,而最后的_MyHomePageState则是创建并返回状态的对象实例,要注意的是,这里的_MyHomePageState是私有的,因为前面加了“_”。

那么今天就先到这啦,祝大家天天开心!代码一遍就通!没有debug的烦恼!如果有讲的不好或者不对的地方,可以指出,博主会修正哒!

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.pswp.cn/web/82295.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Linux 系统 Docker Compose 安装

个人博客地址&#xff1a;Linux 系统 Docker Compose 安装 | 一张假钞的真实世界 本文方法是直接下载 GitHub 项目的 release 版本。项目地址&#xff1a;GitHub - docker/compose: Define and run multi-container applications with Docker。 执行以下命令将发布程序加载至…

Tree 树形组件封装

整体思路 数据结构设计 使用递归的数据结构&#xff08;TreeNode&#xff09;表示树形数据每个节点包含id、name、可选的children数组和selected状态 状态管理 使用useState在组件内部维护树状态的副本通过deepCopyTreeData函数进行深拷贝&#xff0c;避免直接修改原始数据 核…

tortoisegit 使用rebase修改历史提交

在 TortoiseGit 中使用 rebase 修改历史提交&#xff08;如修改提交信息、合并提交或删除提交&#xff09;的步骤如下&#xff1a; --- ### **一、修改最近一次提交** 1. **操作**&#xff1a; - 右键项目 → **TortoiseGit** → **提交(C)** - 勾选 **"Amend…

中科院报道铁电液晶:从实验室突破到多场景应用展望

2020年的时候&#xff0c;相信很多关注科技前沿的朋友都注意到&#xff0c;中国科学院一篇报道聚焦一项有望改写显示产业格局的新技术 —— 铁电液晶&#xff08;FeLC&#xff09;。这项被业内称为 "下一代显示核心材料" 的研究&#xff0c;究竟取得了哪些实质性进展…

论文阅读(六)Open Set Video HOI detection from Action-centric Chain-of-Look Prompting

论文来源&#xff1a;ICCV&#xff08;2023&#xff09; 项目地址&#xff1a;https://github.com/southnx/ACoLP 1.研究背景与问题 开放集场景下的泛化性&#xff1a;传统 HOI 检测假设训练集包含所有测试类别&#xff0c;但现实中存在大量未见过的 HOI 类别&#xff08;如…

74道Node.js高频题整理(附答案背诵版)

简述 Node. js 基础概念 &#xff1f; Node.js是一个基于Chrome V8引擎的JavaScript运行环境。它使得JavaScript可以在服务器端运行&#xff0c;从而进行网络编程&#xff0c;如构建Web服务器、处理网络请求等。Node.js采用事件驱动、非阻塞I/O模型&#xff0c;使其轻量且高效…

年龄是多少

有5个人坐在一起&#xff0c;问第五个人多少岁&#xff1f;他说比第四个人大两岁。问第四个人岁数&#xff0c;他说比第三个人大两岁。问第三个人&#xff0c;又说比第二个人大两岁。问第二个人&#xff0c;说比第一个人大两岁。最后问第一个人&#xff0c;他说是10岁。请问他们…

华为OD机试真题——模拟消息队列(2025A卷:100分)Java/python/JavaScript/C++/C语言/GO六种最佳实现

2025 A卷 100分 题型 本文涵盖详细的问题分析、解题思路、代码实现、代码详解、测试用例以及综合分析; 并提供Java、python、JavaScript、C++、C语言、GO六种语言的最佳实现方式! 2025华为OD真题目录+全流程解析/备考攻略/经验分享 华为OD机试真题《模拟消息队列》: 目录 题…

LangChain-结合GLM+SQL+函数调用实现数据库查询(三)

针对 LangChain-结合GLM+SQL+函数调用实现数据库查询(二)-CSDN博客 进一步简化 通过 LangChain 和大语言模型(GLM-4)实现了一个 AI 代理,能够根据自然语言提问自动生成 SQL 查询语句,并连接 MySQL 数据库执行查询,最终返回结果。 整个流程如下: 用户提问 → AI 生成 SQ…

ZLG ZCANPro,ECU刷新,bug分享

文章目录 摘要 📋问题的起因bug分享 ✨思考&反思 🤔摘要 📋 ZCANPro想必大家都不陌生,买ZLG的CAN卡,必须要用的上位机软件。在汽车行业中,有ECU软件升级的需求,通常都通过UDS协议实现程序的更新,满足UDS升级的上位机要么自己开发,要么用CANoe或者VFlash,最近…

第2期:APM32微控制器键盘PCB设计实战教程

第2期&#xff1a;APM32微控制器键盘PCB设计实战教程 一、APM32小系统介绍 使用apm32键盘小系统开源工程操作 APM32是一款与STM32兼容的微控制器&#xff0c;可以直接替代STM32进行使用。本教程基于之前开源的APM32小系统&#xff0c;链接将放在录播评论区中供大家参考。 1…

单元测试-断言常见注解

目录 1.断言 2.常见注解 3.依赖范围 1.断言 断言练习 package com.gdcp;import org.junit.jupiter.api.Assertions; import org.junit.jupiter.api.Test;//测试类 public class UserServiceTest {Testpublic void testGetGender(){UserService userService new UserService…

每日算法-250602

每日算法学习记录 - 250602 今天学习和复习了两道利用前缀和与哈希表解决的子数组问题&#xff0c;特此记录。 560. 和为 K 的子数组 题目 思路 本题的核心思想是利用 前缀和 与 哈希表 来优化查找过程。 解题过程 题目要求统计和为 k 的子数组个数。 我们首先预处理出一…

Arch安装botw-save-state

devkitPro https://blog.csdn.net/qq_39942341/article/details/148387077?spm1001.2014.3001.5501 cargo https://blog.csdn.net/qq_39942341/article/details/148387783?spm1001.2014.3001.5501 megaton https://blog.csdn.net/qq_39942341/article/details/148388164?spm…

STM32学习笔记---时钟树

目录 一、时钟树&#xff1a;M3---STM32F103 1、主要时钟来源 ​2、时钟系统线路分析 HSE时钟 HSI时钟 LSE时钟 LSI时钟 PPLCLK ---锁相环时钟 SYSCLK ---系统时钟 HCLK时钟 PCLK1时钟 PCLK2时钟 3、时钟树简图 4、构成部分作用分析 二、时钟树&#xff1a;M4-…

35.x64汇编写法(二)

免责声明&#xff1a;内容仅供学习参考&#xff0c;请合法利用知识&#xff0c;禁止进行违法犯罪活动&#xff01; 本次游戏没法给 内容参考于&#xff1a;微尘网络安全 上一个内容&#xff1a;34.x64汇编写法&#xff08;一&#xff09; 上一个内容写了&#xff0c;汇编调…

钩子函数的作用(register_hook)

钩子函数仅在backward()时才会触发。其中&#xff0c;钩子函数接受梯度作为输入&#xff0c;返回操作后的梯度&#xff0c;操作后的梯度必须要输入的梯度同类型、同形状&#xff0c;否则报错。 主要功能包括&#xff1a; 监控当前的梯度&#xff08;不返回值&#xff09;&…

【头歌实验】Keras机器翻译实战

【头歌实验】Keras机器翻译实战 第1关&#xff1a;加载原始数据 编程要求 根据提示&#xff0c;在右侧编辑器补充代码&#xff0c;实现load_data函数&#xff0c;该函数需要加载path所代表的文件中的数据&#xff0c;并将文件中所有的内容按\n分割&#xff0c;转换成一个列表…

python中使用高并发分布式队列库celery的那些坑

python中使用高并发分布式队列库celery的那些坑 &#x1f31f; 简单理解&#x1f6e0;️ 核心功能&#x1f680; 工作机制&#x1f4e6; 示例代码&#xff08;使用 Redis 作为 broker&#xff09;&#x1f517; 常见搭配&#x1f4e6; 我的环境&#x1f4e6;第一个问题&#x1…

截图工具 Snipaste V2.10.7(2025.06.2更新)

—————【下 载 地 址】——————— 【​本章下载一】&#xff1a;https://pan.xunlei.com/s/VORklK9hcuoI6n_qgx25jSq2A1?pwde7bi# 【​本章下载二】&#xff1a;https://pan.quark.cn/s/7c62f8f86735 【百款黑科技】&#xff1a;https://ucnygalh6wle.feishu.cn/wiki/…