Flutter-防京东商城项目-编写个人中心UI界面-32

一直觉得自己写的不是技术，而是情怀，一个个的教程是自己这一路走来的痕迹。靠专业技能的成功是最具可复制性的，希望我的这条路能让你们少走弯路，希望我能帮你们抹去知识的蒙尘，希望我能帮你们理清知识的脉络，希望未来技术之巅上有你们也有我。

代码文档

Flutter防京东商城源码(1-10)链接

Flutter防京东商城源码(11-20)链接

Flutter防京东商城源码(21-30)链接

Flutter防京东商城源码(31-46)链接

本章学到的效果：

配置图片 把下面的图片文件复制进来

回到下面的文件配置图片

  assets:
    - images/user_bg.jpg
    - images/2.0x/user_bg.jpg
    - images/3.0x/user_bg.jpg
    - images/user.png
    - images/2.0x/user.png
    - images/3.0x/user.png

回到个人中心把内容替换掉。

import 'package:flutter_app/services/screenAdaper.dart';

@override
Widget build(BuildContext context) {
  return Scaffold(
      // appBar: AppBar(
      //   title: Text("用户中心"),
      // ),
      body: ListView(
    children: <Widget>[
      Container(
        height: ScreenAdapter.height(220),
        width: double.infinity,
        decoration: BoxDecoration(
            image: DecorationImage(
                image: AssetImage('images/user_bg.jpg'), fit: BoxFit.cover)),
        child: Row(
          children: <Widget>[
            Container(
              margin: EdgeInsets.fromLTRB(10, 0, 10, 0),
              child: ClipOval(
                child: Image.asset(
                  'images/user.png',
                  fit: BoxFit.cover,
                  width: ScreenAdapter.width(100),
                  height: ScreenAdapter.width(100),
                ),
              ),
            ),
            // Expanded(
            //   flex: 1,
            //   child: Text("登录/注册",style: TextStyle(
            //     color: Colors.white
            //   )),
            // )

            Expanded(
              flex: 1,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  Text("用户名：124124125",
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: ScreenAdapter.size(32))),
                  Text("普通会员",
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: ScreenAdapter.size(24))),
                ],
              ),
            )
          ],
        ),
      ),
      ListTile(
        leading: Icon(Icons.assignment, color: Colors.red),
        title: Text("全部订单"),
      ),
      Divider(),
      ListTile(
        leading: Icon(Icons.payment, color: Colors.green),
        title: Text("待付款"),
      ),
      Divider(),
      ListTile(
        leading: Icon(Icons.local_car_wash, color: Colors.orange),
        title: Text("待收货"),
      ),
      Container(
          width: double.infinity,
          height: 10,
          color: Color.fromRGBO(242, 242, 242, 0.9)),
      ListTile(
        leading: Icon(Icons.favorite, color: Colors.lightGreen),
        title: Text("我的收藏"),
      ),
      Divider(),
      ListTile(
        leading: Icon(Icons.people, color: Colors.black54),
        title: Text("在线客服"),
      ),
      Divider(),
    ],
  ));
}