flutter 写个简单的界面

起因, 目的:

来源: 客户需求。 着急要,我随便写的,应付一下。

过程:

略,直接看代码,看注释。

代码 1 xxx
import 'package:flutter/material.dart';void main() {runApp(const MyApp());
}// #
class MyApp extends StatelessWidget {const MyApp({super.key});// This widget is the root of your application.@overrideWidget build(BuildContext context) {return MaterialApp(title: 'Flutter Demo',// 隐藏调试模式横幅debugShowCheckedModeBanner: false,theme: ThemeData(colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),useMaterial3: true,),home: TicTacToeHomePage(), // title: 'Flutter Demo Home Page');}
}// 这部分就是一个占位的。  是个初步版本。
// TicTacToeHomePage
// class TicTacToeHomePage extends StatelessWidget {
//   @override
//   Widget build(BuildContext context) {
//     return Scaffold(
//       appBar: AppBar(
//         title: Text('Tic Tac Toe'),
//       ),
//       body: Center(
//         child: Text('hey!!!'),
//       ),
//     );
//   }
// }class TicTacToeHomePage extends StatelessWidget {@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Row(children: <Widget>[Image(image: AssetImage('assets/images/face.jpg'), // 替换为你的图片路径width: 30.0, // Image style),SizedBox(width: 10.0), // 间距Text('123456 someone@who',style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20.0)), // Text style],),backgroundColor: Colors.blue, // AppBar style),// body: Center(//   child: Text('hey!!!'),// ),body: Center(child: Column(mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[Text('Welcome to the game Tic Tac Toe',style: TextStyle(fontSize: 24.0,color: Colors.orange,fontWeight: FontWeight.bold)),// Welcome message with stylesSizedBox(height: 20.0),// 间距Image(image: AssetImage('assets/images/game_img.jpg'), // 替换为你的图片路径width: 300.0, // Image style),SizedBox(height: 20.0),// 间距ElevatedButton(style: ElevatedButton.styleFrom(backgroundColor: Colors.red, // 按钮背景颜色foregroundColor: Colors.white, // 按钮前景色padding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 20.0), // 按钮内边距),child: Text('Start Game', style: TextStyle(fontSize: 18.0)),// Button text styleonPressed: () {print('Key pressed!');},),],),),);}
}

效果图

在这里插入图片描述

结论 + todo

  • 最近写的这个几个 flutter:
  • 前面2篇,是用 vscode 写的
  • 这次是用的是 andriod studio,环境配置差不多用了1个小时。
  • andriod studio 很久不用,各种更新。 其实,andriod studio 也挺好的。

老哥留步,支持一下。

请求支持

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

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

相关文章

.NET 8 中 Entity Framework Core 的使用

本文代码&#xff1a;https://download.csdn.net/download/hefeng_aspnet/89935738 概述 Entity Framework Core (EF Core) 已成为 .NET 开发中数据访问的基石工具&#xff0c;为开发人员提供了强大而多功能的解决方案。随着 .NET 8 和 C# 10 中引入的改进&#xff0c;开发人…

推荐一款可视化和检查原始数据的工具:RawDigger

RawDigger是一款强大的工具&#xff0c;旨在可视化和检查相机记录的原始数据。它被称为一种“显微镜”&#xff0c;使用户能够深入分析原始图像数据&#xff0c;而不对其进行任何更改。RawDigger并不是一个原始转换器&#xff0c;而是一个帮助用户查看将由转换器使用的数据的工…

第三十三章 Vue路由进阶路由模块封装

目录 一、引言 二、完整代码 main.js index.js App.vue Find.vue My.vue 一、引言 在上一个章节中&#xff0c;我们将所有的路由配置都堆在main.js中来实现路径组件的路由&#xff0c;这样做的话非常不利于我们后期对项目的维护。因此正确的做法是将路由模块抽离出来&a…

基于java+SpringBoot+Vue的新闻推荐系统设计与实现

项目运行 环境配置&#xff1a; Jdk1.8 Tomcat7.0 Mysql HBuilderX&#xff08;Webstorm也行&#xff09; Eclispe&#xff08;IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持&#xff09;。 项目技术&#xff1a; Springboot mybatis Maven mysql5.7或8.0等等组成&#x…

指派问题的求解

实验类型&#xff1a;◆验证性实验 ◇综合性实验 ◇设计性实验 实验目的&#xff1a;学会使用Matlab求解指派问题。 实验内容&#xff1a;利用Matlab编程实现枚举法求解指派问题。 实验例题&#xff1a;有5人分别对应完成5项工作&#xff0c;其各自的耗费如下表所示&#…

商品满减、限时活动、折扣活动的计算最划算 golang

可以对商品的不同活动&#xff08;如满减、限时价和折扣&#xff09;进行分组&#xff0c;并在购物车中显示各个活动标签下的最优价格组合。以下代码将商品按活动类别进行分组计算&#xff0c;并输出在购物车中的显示信息。 package mainimport ("fmt""math&qu…

AWS RDS Oracle hit ORA-39405

报错信息&#xff1a; ORA-39405: Oracle Data Pump does not support importing from a source database with TSTZ version 42 into a target database with TSTZ version 35. 分析过程&#xff1a; 这个报错是由于timezone_file的版本&#xff0c;源端比目标端高&#xf…

显卡服务器和普通服务器之间的区别有哪些?

显卡服务器也被称之为GPU服务器&#xff0c;显卡服务器与普通的服务器之间有着很明显的区别&#xff0c;下面就让我们共同来了解一下吧&#xff01; 普通服务器的主要处理器通常都是配备的中央处理器&#xff0c;可以用于执行大部分通用计算任务和操作系统的管理&#xff1b;而…

下载安装COPT+如何在jupyter中使用(安装心得,windows,最新7.2版本)

目录 1.到杉树科技官网申请下载COPT 2.安装COPT&配置许可文件 3.在jupyter中使用COPT的python接口 最近看到一本和数学建模有关的新书&#xff1a;《数学建模与数学规划&#xff1a;方法、案例及编程实战》&#xff0c;作为数学建模老手&#xff0c;肯定要学习一下&…

Python自动化运维:技能掌握与快速入门指南

#编程小白如何成为大神&#xff1f;大学生的最佳入门攻略# 在当今快速发展的IT行业中&#xff0c;Python自动化运维已经成为了一个不可或缺的技能。本文将为您详细介绍Python自动化运维所需的技能&#xff0c;并提供快速入门的资源&#xff0c;帮助您迅速掌握这一领域。 必备…

深入理解跨域资源共享(CORS)安全问题原理及解决思路

目录 引言 CORS 基础 CORS 安全问题原理 解决思路 结论 引言 跨域资源共享&#xff08;CORS, Cross-Origin Resource Sharing&#xff09;是现代Web应用中不可或缺的一部分&#xff0c;特别是在前后端分离的架构中。CORS允许一个域上的Web应用请求另一个域上的资源&#…

基于“互联网+”医养结合的智慧养老实训室建设方案

一、建设背景 根据国家统计局的数据&#xff0c;截至2023年末&#xff0c;我国60岁及以上的老年人口已达到29,697万人&#xff0c;占总人口的21.1%&#xff1b;其中&#xff0c;65岁及以上的人口为21,676万人&#xff0c;占总人口的15.4%。这一数据表明&#xff0c;我国正面临…

为什么需要MQ消息系统,mysql 不能满足需求吗?

大家好&#xff0c;我是锋哥。今天分享关于【为什么需要MQ消息系统&#xff0c;mysql 不能满足需求吗&#xff1f;】面试题&#xff1f;希望对大家有帮助&#xff1b; 为什么需要MQ消息系统&#xff0c;mysql 不能满足需求吗&#xff1f; 1000道 互联网大厂Java工程师 精选面试…

C++编程法则365天一天一条(303)异步编程之std::promise和std::future

文章目录 主要特点基本用法示例代码使用场景注意事项std::promise 是 C++11 引入的一个模板类,位于 <future> 头文件,用于实现异步操作中的值传递和异常传递。它与 std::future 一起使用,提供了一种机制,使得一个线程可以将结果或异常传递给另一个线程。 主要特点 异…

计算机网络-以太网小结

前导码与帧开始分界符有什么区别? 前导码--解决帧同步/时钟同步问题 帧开始分界符-解决帧对界问题 集线器 集线器通过双绞线连接终端, 学校机房的里面就有集线器 这种方式仍然属于共享式以太网, 传播方式依然是广播 网桥: 工作特点: 1.如果转发表中存在数据接收方的端口信息…

C/C++常用编译工具链:GCC,Clang

目录 GNU Compiler Collection GCC的优势 编译产生的中间文件 Clang Clang的特点 什么是LLVM&#xff1f; Clang编译过程中产生的中间表示文件 关于Clang的调试 C 编译工具链中有几个主要的编译工具&#xff0c;包括&#xff1a; GNU Compiler Collection (GCC…

NNLM——预测下一个单词

一、原理篇 NNLM&#xff08;Neural Network Language Model&#xff0c;神经网络语言模型&#xff09;是一种通过神经网络进行语言建模的技术&#xff0c;通常用于预测序列中的下一个词。 NNLM的核心思想是使用词嵌入&#xff08;word embedding&#xff09;将词转换为低维向…

【C++】类和对象(十二):实现日期类

大家好&#xff0c;我是苏貝&#xff0c;本篇博客带大家了解C的实现日期类&#xff0c;如果你觉得我写的还不错的话&#xff0c;可以给我一个赞&#x1f44d;吗&#xff0c;感谢❤️ 目录 1 /!/>/</>/<运算符重载2 /-//-运算符重载(A) 先写&#xff0c;再通过写(B…

KTHREAD--InitialStack和KernelStack和TSS的esp0

InitialStack和TSS.esp0的关系,在这里可以看到 mov ecx, [esi_KTHREAD.InitialStack] ; esi: newthread lea eax, [ecx-210h] ; 越过FPXSAVE指令存储地址 test byte ptr [eax-1Ah], 2 ; 判断efalgs寄存器的VIF位是否为1 jnz short loc_458743 sub eax, 10h…

xlrd.biffh.XLRDError: Excel xlsx file; not supported

文章目录 一、问题报错二、报错原因三、解决思路四、解决方法 一、问题报错 在处理Excel文件时&#xff0c;特别是当我们使用Python的xlrd库来读取.xlsx格式的文件&#xff0c;偶尔会遇到这样一个错误&#xff1a;“xlrd.biffh.XLRDError: Excel xlsx file; not supported”。…