32Flutter仿京东商城项目 用户中心页面布局
import 'package:flutter/material.dart';
import 'package:flutter_jdshop/services/ScreenAdapter.dart'; class UserPage extends StatefulWidget {
UserPage({Key key}) : super(key: key); _UserPageState createState() => _UserPageState();
} class _UserPageState extends State<UserPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("用户中心"),
),
body: ListView(
children: <Widget>[
Container(
height: ScreenAdapter.height(),
width: double.infinity,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('images/user_bg.jpg'),
fit: BoxFit.cover)),
child: Row(
children: <Widget>[
Container(
margin: EdgeInsets.fromLTRB(, , , ),
child: ClipOval(
child: Image.asset(
'images/user.png',
fit: BoxFit.cover,
width: ScreenAdapter.width(),
height: ScreenAdapter.width(),
),
),
),
// Expanded(
// flex: 1,
// child: Text('登录/注册',style: TextStyle(
// color: Colors.white
// )),
// )
Expanded(
flex: ,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("用户名:123456789",
style: TextStyle(
color: Colors.white,
fontSize: ScreenAdapter.size())),
Text("普通会员",
style: TextStyle(
color: Colors.white,
fontSize: ScreenAdapter.size()))
],
),
)
],
),
),
ListTile(
leading: Icon(Icons.home, color: Colors.red), title: Text('首页')),
Divider(),
ListTile(leading: Icon(Icons.home), title: Text('首页')),
ListTile(leading: Icon(Icons.home), title: Text('首页')),
ListTile(leading: Icon(Icons.home), title: Text('首页'))
],
),
);
}
}
pubspec.yaml
assets:
- images/user_bg.jpg
- images/.0x/user_bg.jpg
- images/.0x/user_bg.jpg
- images/user.png
- images/.0x/user.png
- images/.0x/user.png
32Flutter仿京东商城项目 用户中心页面布局的更多相关文章
- 14 Flutter仿京东商城项目 头部搜索导航布局 修改主题 修正ScreenAdapter类
main.dart import 'package:flutter/material.dart'; import 'routes/router.dart'; void main() => run ...
- 36 Flutter仿京东商城项目 用户登录 退出登录 事件广播更新状态
Login.dart import 'dart:convert'; import 'package:dio/dio.dart'; import 'package:flutter/material.da ...
- 12 Flutter仿京东商城项目 商品列表页面请求数据、封装Loading Widget、上拉分页加载更多
ProductList.dart import 'package:flutter/material.dart'; import '../services/ScreenAdaper.dart'; imp ...
- 38 Flutter仿京东商城项目 渲染结算页面商品数据
加群452892873 下载对应38课文件,运行方法,建好项目,直接替换lib目录 CartServices.dart import 'dart:convert'; import 'Storage.d ...
- 11 Flutter仿京东商城项目 商品列表页面二级筛选导航布局
ProductList.dart import 'package:flutter/material.dart'; import '../services/ScreenAdaper.dart'; imp ...
- 04Flutter仿京东商城项目 首页商品列表布局
Home.dart import 'package:flutter/material.dart'; import 'package:flutter_swiper/flutter_swiper.dart ...
- 01-02 Flutter仿京东商城项目 功能分析、底部导航Tab切换以及路由配置、架构搭建:(Flutter仿京东商城项目 首页布局以及不同终端屏幕适配方案)
Flutter和Dart交流学习群:交流群:452892873 01Flutter仿京东商城项目 功能分析.底部导航Tab切换以及路由配置.架构搭建 02Flutter仿京东商城项目 首页布局以及不同 ...
- 16 Flutter仿京东商城项目 跳转到搜索页面实现搜索功能 以及搜索筛选
ProductList.dart import 'package:flutter/material.dart'; import '../services/ScreenAdaper.dart'; imp ...
- ThinkPHP3.2开发仿京东商城项目实战视频教程
ThinkPHP3.2仿京东商城视频教程实战课程,ThinkPHP3.2开发大型商城项目实战视频 第一天 1.项目说明 2.时间插件.XSS过滤.在线编辑器使用 3.商品的删除 4.商品的修改完成-一 ...
随机推荐
- [原创]extjs htmleditor增加截图快速粘贴功能 插件
因客户需求,需要QQ截图后,能直接粘贴到htmleditor编辑器中,不要保存本地文件再上传,再插入到编辑器,太过麻烦. 常规做法:QQ截图-->选择保存路径-->确定保存文件--> ...
- 【清北学堂】广州OI学习游记
\(Day~0\) 早上\(9\)点多才爬起来,然后水了道题. 下午从[数据删除]出发,颠簸了将近\(5\)个小时终于抵达广州. 一出地铁站--卧槽这天,卧槽这风,要下雨的节奏? 没过两分钟倾盆大雨. ...
- Mybatis的简单搭建
1.官方网址 http://www.mybatis.org/mybatis-3/zh/getting-started.html 2.导入jar包 3.根据官方文档,首先写mybatis-config. ...
- redis 事务 & 锁
参考:https://www.cnblogs.com/DeepInThought/p/10720132.html Redis不保证原子性:Redis中,单条命令是原子性执行的,但事务不保证原子性,且没 ...
- 阿里云轻量级服务器和NGINX部署Django项目
部署条件: 1.一台阿里云服务器(本人的是CentOS系统的服务器) 2.已经构建好的项目 3.服务器上安装并配置Nginx 首先第一步:在服务器上安装并配置Nginx 进入服务器 $ ssh roo ...
- socket.gaierror: [Errno 11001] getaddrinfo failed
- git的优点跟缺点?
优点: 1.分布式开发时,可以git clone克隆一个本地版本,然后在本地进行操作提交,本地可以完成一个完整的版本控制.在发布的时 候,使用git push来推送到远程即可. 2.git分支的本质是 ...
- 关于Maven打包
Maven打包构建完全指南和最佳实践 Maven最佳实践:划分模块 IDEA一个项目引用另一个项目 IDEA创建多个模块MavenSpringBoot项目 这个简单明了,基础知识
- luogu 3919
主席树 #include <iostream> #include <cstdio> #include <algorithm> #include <cmath& ...
- Spring Cloud Gateway(四):路由定义定位器 RouteDefinitionLocator
本文基于 spring cloud gateway 2.0.1 1.简介 RouteDefinitionLocator 是路由定义定位器的顶级接口,它的主要作用就是读取路由的配置信息(org.spri ...