flutter 尝试创建第一个页面(三)
新建目录 assets 存放图片
在pubspec..yaml 中添加
flutter: # The following line ensures that the Material Icons font is
# included with your application, so that you can use the icons in
# the material Icons class.
uses-material-design: true
assets:
- assets/阿尼亚.jpg
- assets/可可爱爱阿尼亚.jpg
在 目录 lib main.dart文件中添加以下代码
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
// 每个项目最外层,必须有MaterialApp
@override
Widget build(BuildContext context) {
return MaterialApp(
title: '心语航标',
theme: ThemeData(
primarySwatch: Colors.purple,
),
// 通过Home 指定首页
home: MyHome(),
);
}
}
class MyHome extends StatelessWidget{
@override
Widget build(BuildContext context) {
// 在flutter 中 ,每个控件都是一个类
return Scaffold(
appBar: AppBar(
title: Text("心语航标"),
centerTitle: true,
//右侧行为按钮
actions:<Widget>[
IconButton(
icon: Icon(Icons.search),
onPressed: () {},
)
],
),
drawer: Drawer(
child: ListView(
padding: EdgeInsets.all(0),
children:const <Widget>[
UserAccountsDrawerHeader(
accountEmail: Text('newemail@aniya.com'),
accountName: Text('阿尼亚'),
currentAccountPicture: CircleAvatar(
backgroundImage:AssetImage('assets/阿尼亚.jpg') ,),
//美化当前控件的
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/可可爱爱阿尼亚.jpg'),
fit: BoxFit.cover, // 可选的,根据需要设置图片的适应方式
),
)
),
ListTile(title:Text('用户反馈'),trailing: Icon(Icons.feedback),),
ListTile(title:Text('系统设置'),trailing: Icon(Icons.settings),),
ListTile(title:Text('我要发布'),trailing: Icon(Icons.send),),
ListTile(title:Text('注销'),trailing: Icon(Icons.exit_to_app),)
],
),
),
);
}
}
显示效果

flutter 尝试创建第一个页面(三)的更多相关文章
- 《Symfony 5全面开发》教程03、使用Controller创建第一个页面
我们使用Phpstorm打开我们的项目目录,展开项目目录文件夹. Symfony项目其实也是composer项目,如果你新拿到一个Symfony项目, 你可以在控制台中使用composer insta ...
- symfony2 安装并创建第一个页面
1.安装和配置 参考 http://symfony.cn/docs/book/installation.html 使用安装工具: windows系统 Open your command console ...
- [Umbraco] 创建第一个页面
如何创建一个页面,很简单. 进入settings,首先右键点击“Document Types”, 在出现的菜单点击"Create",在弹出的窗口中 Master Document ...
- Flask学习 1创建第一个页面
#!/usr/bin/env python # encoding: utf-8 """ @version: v1.0 @author: cxa @file: hello. ...
- SSH(三)创建包和第一个页面
在ssh web项目src下一次创建 com.ssh/ .action .dao .entity .service 四个包,example: 在entity包下创建class,name: produc ...
- javascript 中数组的创建 添加 与将数组转换成字符串 页面三种提交请求的方式
创建js数组 var array=new Array(); Java中创建数组 private String[] array=new String[3]; 两个完全不同的,js中是可变长度的 添加内容 ...
- ASP.NET MVC 5 03 - 安装MVC5并创建第一个应用程序
不知不觉 又逢年底, 穷的钞票 所剩无几. 朋友圈里 各种装逼, 抹抹眼泪 MVC 继续走起.. 本系列纯属学习笔记,如果哪里有错误或遗漏的地方,希望大家高调指出,当然,我肯定不会低调改正的.(开个小 ...
- BI之SSAS完整实战教程3 -- 创建第一个多维数据集
上一篇我们已经完成了数据源的准备工作,现在我们就开始动手,创建第一个多维数据集(Cube). 文章提纲 使用多维数据集向导创建多维数据集 总结Cube设计器简介 维度细化 总结 一.使用向导创建多维数 ...
- Ionic学习记录(一):ionic及cordova安装、创建第一个应用、项目结构
目录: 一.ionic的安装 二.创建第一个应用程序 三.浏览器中预览应用 四.项目结构 五.添加页面 一.ionic的安装 使用Ionic创建和开发应用程序主要通过Ionic命令行实用程序(“CLI ...
- 【技术博客】Flutter—使用网络请求的页面搭建流程、State生命周期、一些组件的应用
Flutter-使用网络请求的页面搭建流程.State生命周期.一些组件的应用 使用网络请求的页面搭建流程 在开发APP时,我们常常会遇到如下场景:进入一个页面后,要先进行网络调用,然后使用调用返 ...
随机推荐
- Apache Flink 在实时金融数据湖的应用
简介: 本文由京东搜索算法架构团队分享,主要介绍 Apache Flink 在京东商品搜索排序在线学习中的应用实践 一.背景 在京东的商品搜索排序中,经常会遇到搜索结果多样性不足导致系统非最优解的问题 ...
- 无缝融入 Kubernetes 生态 | 云原生网关支持 Ingress 资源
简介:Kubernetes 一贯的作风是通过定义标准来解决同一类问题,在解决集群对外流量管理的问题也不例外.Kubernetes 对集群入口点进行了进一步的统一抽象,提出了 3 种解决方案:Node ...
- dotnet C# 调用委托的 GetInvocationList 的对象分配
本文也叫跟着 Stephen Toub 大佬学性能优化系列,这是我从 Stephen Toub 大佬给 WPF 框架做性能优化学到的知识,在热路径下,也就是频繁调用的模块,如果调用了委托的 GetIn ...
- C语言程序设计-笔记5-数据类型和表达式
C语言程序设计-笔记5-数据类型和表达式 例6-1 大小写英文字母转换.输入一样字符,将其中的大写字母转换为相应的小写字母后输出,小写字母转换为相应的大写字母后输出,其他字符按原样输出. #incl ...
- 一种光电容积波PPG 转换到心电图ECG进行房颤检测的神经网络模型
具体的软硬件实现点击 http://mcu-ai.com/ MCU-AI技术网页_MCU-AI人工智能 光电体积描记法(PPG)是一种经济有效的非侵入性技术,利用光学方法测量心脏生理学. PPG 在健 ...
- Ruby on Rails Active Record数据库常用操作
目录 创建 批量插入 判断是否存在 Ruby on Rails 日期查询方法 文档地址: https://freed.gitee.io/rails-guides/active_record_query ...
- sh角本操作数据库
#!/bin/bash HOST="127.0.0.1" PORT="3306" USERNAME="root" PASSWORD=&quo ...
- 【Vue】vuex存储和本地存储(localstorage、sessionstorage)的区别
sessionStorage sessionStorage 方法针对一个 session 进行数据存储.当用户关闭浏览器窗口后,数据会被删除. 用法: 储存: 1. 点(.)运算符 sessionSt ...
- Git:如何撤销已经提交的代码
日常操作流程 本地工作区(尚未暂存) ---> add . 到暂存区 ---> commit 到本地仓库 ---> pull拉取关联远程仓库分支合并到本地的分支---> pus ...
- JOISC2019 题解
\(\text{By DaiRuiChen007}\) Contest Link A. Examination Problem Link 题目大意 有 \(n\) 个二元组 \((a,b)\) 和 \ ...