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.商品的修改完成-一 ...
随机推荐
- Aure Event Hubs小白完全入门指南
refer to https://www.cnblogs.com/mysunnytime/p/11634815.html?from=groupmessage&isappinstalled=0 ...
- linux网络编程之system v信号量(二)
今天迎来元旦假期的最后一天了,过得好快~昨天跟小伙伴们在军都滑雪陪儿爽,虽说上了两回中级道都摔得异常的惨烈,但是在初级道上学习"s"转弯还是有一些小心得,可以在要往高手迈进的前提, ...
- UML之九种图
UML说是九种图吧!其实是众说纷纭,不管有几种图,我们只要能够很好的运用这几张图就好,主要有用例图.类图.对象图.状态图.活动图.序列图.协作图.构件图和部署图,至于包图是否属于这九种图,我也理不清楚 ...
- 15 webpack中使用url-loader处理字体文件
引用字体图标,bootstrap有提供字体图标 1.安装bootstrap cnpm i bootstrap -S 2.导入bootstrap //注意:如果要通过路径的形式,去引入node_modu ...
- socket.gaierror: [Errno 11001] getaddrinfo failed
- python 虚拟环境相关命令
1.总是记不住一些关于创建虚拟环境得命令,特在自己得博客里记录一下自己常用得命令: virtualenv -p C:\Python36\python D:\virtual\Envs\AssetScan ...
- jquery手机端产品列表响应式宽高检测宽度赋值给高度让宽高相同
在手机端浏览商品列表,开发人员懂得设计图片做正好的尺寸,那样浏览很好,但有人天生泛懒图片都是随手上传不管大小合适不合适,要求还是响应式的.今天就用jquery检测宽度,并赋值给高度来实现错位问题 &l ...
- XML建模实列
XML建模 建模的由来: 就是将指定的xml字符串当作对象来操作 好处在于,只需要调用指定的方法就可以完成预定的字符串获取: 建模的一个思路: 1.分析需要被建模的文件中有那几个对 ...
- SublimeCodeIntel 所有代码提示和补全插件 All Autocomplete 插件搜索所有打开的文件来寻找匹配的提示词
SublimeCodeIntelSublimeCodeIntel 作为一个代码提示和补全插件,支持 JavaScript.Mason.XBL.XUL.RHTML.SCSS.Python.HTML.Ru ...
- AC自动机1030 [JSOI2007]文本生成器
/*Description JSOI交给队员ZYX一个任务,编制一个称之为“文本生成器”的电脑软件:该软件的使用者是一些低幼人群,他们现在使用的是GW文本生成器v6版.该软件可以随机生成一些文章――― ...