39 Flutter仿京东商城项目 收货地址列表、增加 修改收货地址布局、弹出省市区选择器
加群452892873 下载对应39课文件,运行方法,建好项目,直接替换lib目录
pubspec.yaml
city_pickers: ^0.1.
AddressAdd.dart
import 'package:flutter/material.dart';
import 'package:flutter_jdshop/services/ScreenAdapter.dart';
import 'package:flutter_jdshop/widget/JdButton.dart';
import 'package:flutter_jdshop/widget/JdText.dart';
import 'package:city_pickers/city_pickers.dart'; class AddressAddPage extends StatefulWidget {
AddressAddPage({Key key}) : super(key: key); _AddressAddPageState createState() => _AddressAddPageState();
} class _AddressAddPageState extends State<AddressAddPage> {
String area = '';
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('增加收货地址'),
),
body: Container(
child: ListView(
children: <Widget>[
JdText(
text: "收货人姓名",
),
SizedBox(height: ),
JdText(
text: "收货人电话",
),
SizedBox(height: ),
Container(
padding: EdgeInsets.only(left: ),
height: ScreenAdapter.height(),
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(width: , color: Colors.black12))),
child: InkWell(
child: Row(
children: <Widget>[
Icon(Icons.add_location),
this.area.length >
? Text("${this.area}",
style: TextStyle(color: Colors.black54))
: Text("省/市/区",
style: TextStyle(color: Colors.black54))
],
),
onTap: () async {
Result result = await CityPickers.showCityPicker(
context: context,
cancelWidget:
Text('取消', style: TextStyle(color: Colors.black54)),
confirmWidget:
Text("确定", style: TextStyle(color: Colors.blue))); setState(() {
this.area =
"${result.provinceName}/${result.cityName}/${result.areaName}";
});
},
),
),
SizedBox(height: ),
JdText(
text: "详细地址",
maxLines: ,
height: ,
),
SizedBox(height: ),
RaisedButton(
child: Text("弹出省市区"),
onPressed: () async {
Result result = await CityPickers.showCityPicker(
context: context,
cancelWidget:
Text('取消', style: TextStyle(color: Colors.black54)),
confirmWidget:
Text("确定", style: TextStyle(color: Colors.blue)));
},
),
SizedBox(height: ),
JdButton(
text: "增加",
color: Colors.red,
)
],
),
));
}
}
AddressEdit.dart
import 'package:flutter/material.dart';
class AddressEditPage extends StatefulWidget {
AddressEditPage({Key key}) : super(key: key); _AddressEditPageState createState() => _AddressEditPageState();
} class _AddressEditPageState extends State<AddressEditPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('修改收货地址'),
),
body: Text('增加说活地址'),
);
}
}
AddressList.dart
import 'package:flutter/material.dart';
import 'package:flutter_jdshop/services/ScreenAdapter.dart'; class AddressListPage extends StatefulWidget {
AddressListPage({Key key}) : super(key: key); _AddressListPageState createState() => _AddressListPageState();
} class _AddressListPageState extends State<AddressListPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('收货列表地址'),
),
body: Container(
child: Stack(
children: <Widget>[
ListView(
children: <Widget>[
ListTile(
leading: Icon(Icons.check, color: Colors.red),
title: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("张三 13325187796"),
SizedBox(height: ),
Text('北京')
]),
trailing: Icon(Icons.edit, color: Colors.blue),
)
],
),
Positioned(
bottom: ,
width: ScreenAdapter.width(),
height: ScreenAdapter.height(),
child: Container(
padding: EdgeInsets.all(),
width: ScreenAdapter.width(),
height: ScreenAdapter.height(),
decoration: BoxDecoration(
color: Colors.red,
border: Border(
top: BorderSide(width: , color: Colors.black26))),
child: InkWell(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(Icons.add, color: Colors.white),
Text('增加收货地址', style: TextStyle(color: Colors.white))
],
),
onTap: (){
Navigator.pushNamed(context,'/addressAdd');
},
)),
)
],
)),
);
}
}
JdText.dart
import 'package:flutter/material.dart';
import 'package:flutter_jdshop/services/ScreenAdapter.dart';
class JdText extends StatelessWidget {
final String text;
final bool password;
final Object onChanged;
final int maxLines;
final double height;
JdText({Key key,this.text="输入内容",this.password=false,this.onChanged=null,this.maxLines=,this.height=}) : super(key: key); @override
Widget build(BuildContext context) {
return Container(
child: TextField(
maxLines: this.maxLines,
obscureText: this.password,
decoration: InputDecoration(
hintText: this.text,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(),
borderSide: BorderSide.none
)
),
onChanged:this.onChanged,
),
height: ScreenAdapter.height(this.height),
decoration: BoxDecoration(
// color: Color.fromRGBO(233,233,233,0.8),
// borderRadius: BorderRadius.circular(30)
border: Border(
bottom:BorderSide(
width: ,
color: Colors.black12
)
)
), );
}
}
39 Flutter仿京东商城项目 收货地址列表、增加 修改收货地址布局、弹出省市区选择器的更多相关文章
- 01-02 Flutter仿京东商城项目 功能分析、底部导航Tab切换以及路由配置、架构搭建:(Flutter仿京东商城项目 首页布局以及不同终端屏幕适配方案)
Flutter和Dart交流学习群:交流群:452892873 01Flutter仿京东商城项目 功能分析.底部导航Tab切换以及路由配置.架构搭建 02Flutter仿京东商城项目 首页布局以及不同 ...
- 41 Flutter 仿京东商城项目签名验证 增加收货地址、显示收货地址 事件广播
加群452892873 下载对应41课文件,运行方法,建好项目,直接替换lib目录 AddressAdd.dart import 'package:dio/dio.dart'; import 'pac ...
- 42 Flutter仿京东商城项目 修改默认收货地址 显示默认收货地址
CheckOut.dart import 'package:flutter/material.dart'; import '../services/ScreenAdapter.dart'; impor ...
- 37 Flutter仿京东商城项目 结算页面布局
加群452892873 下载对应34课文件,运行方法,建好项目,直接替换lib目录 CheckOut.dart import 'package:flutter/material.dart'; impo ...
- 07-08 Flutter仿京东商城项目 商品分类页面布局:Flutter仿京东商城项目 商品分类页面数据渲染
Flutter实战(交流群:452892873) 本项目是一个实战项目,根据目录建文件,并复制从第一节到最新更新的文章,可以构成完整的一个请求后台数据的项目: CateModel.dart class ...
- 38 Flutter仿京东商城项目 渲染结算页面商品数据
加群452892873 下载对应38课文件,运行方法,建好项目,直接替换lib目录 CartServices.dart import 'dart:convert'; import 'Storage.d ...
- 36 Flutter仿京东商城项目 用户登录 退出登录 事件广播更新状态
Login.dart import 'dart:convert'; import 'package:dio/dio.dart'; import 'package:flutter/material.da ...
- 34 Flutter仿京东商城项目 用户注册 注册流程 POST发送验证码 倒计时功能 验证验证码
加群452892873 下载对应34课文件,运行方法,建好项目,直接替换lib目录 以下列出的是本课涉及的文件. RegisterFirst.dart import 'package:flutter/ ...
- 26 Flutter仿京东商城项目 购物车之 event_bus事件广播 事件监听
event_bus 介绍 在前面的课程我们给大家讲过状态管理 Provider 的使用. 通俗的讲状态管理就是:当我们想在多个页面(组件/Widget)之间共享状态(数据),或 者一个页面(组件/Wi ...
随机推荐
- 2019-ACM-ICPC-沈阳区网络赛-K. Guanguan's Happy water-高斯消元+矩阵快速幂
2019-ACM-ICPC-沈阳区网络赛-K. Guanguan's Happy water-高斯消元+矩阵快速幂 [Problem Description] 已知前\(2k\)个\(f(i)\),且 ...
- 3D Experience — 产品协同研发平台
随着产品复杂程度的提升,市场竞争愈加激烈,基于模型的正向研发已经作为有效的应对手段被广泛接受.但研发流程中仍然存在复杂功能架构定义困难.多方案难以权衡.多系统难以联合仿真,仿真效率低,验证不充分等问题 ...
- TAITherm — 专业热管理工具
TAITherm 是美国ThermoAnalytics 公司开发的专业三维热仿真分析工具RadTherm 的升级产品,在继承RadTherm特征的基础上,开发了新型高效求解器Multigrid Sol ...
- k8s的etcd
etcd是一个高可用的分布式键值(key-value)数据库.etcd内部采用raft协议作为一致性算法,etcd基于Go语言实现. etcd是一个服务发现系统,具备以下的特点: 简单:安装配置简单, ...
- 用CSS 实现 浮动元素的 水平居中
问题描述: 基本的html结构: <div> <!-- <span>1</span> <span>2</span> <span& ...
- unordered_map初用
unordered_map,顾名思义,就是无序map,STL内部实现了Hash 所以使用时可以当做STL的Hash表使用,时间复杂度可做到O(1)查询 在C++11前,使用unordered_map要 ...
- BZOJ 2277 strongbox (gcd)
题意 有一个密码箱,0到n-1中的某些整数是它的密码. 且满足,如果a和b都是它的密码,那么(a+b)%n也是它的密码(a,b可以相等) 某人试了k次密码,前k-1次都失败了,最后一次成功了. 问:该 ...
- 学到了林海峰,武沛齐讲的Day17-5 内置函数
zip print(list(zip(('a','n','c','d'),(1,2,3)))) =====[('a', 1), ('n', 2), ('c', 3)] 一一对应====元组变列表 ...
- span标签
<span>在行内定义一个区域,也就是一行内可以被<span>划分成好几个区域,从而实现某种特定效果.<span>本身没有任何属性. <span> 与& ...
- zabbix的日志监控
前提条件是该日志文件对于启动zabbix agent进程的用户开启了可读权限,而且该日志的路径对该用户开方x权限,让能取到这个日志文件 第一个参数可以不用引号,前提是zabbix用户可以进入文件路径, ...