提交 51e319bb authored 作者: yueweilu's avatar yueweilu

结算界面

上级 a5ca16e2
part of book_pay;
\ No newline at end of file
library book_pay;
import 'package:flutter/material.dart';
import 'package:flutter_book/theme.dart';
import '../book_shop/index.dart';
part 'controller.dart';
part 'view.dart';
\ No newline at end of file
part of book_pay;
enum PayType {
wechat(label: '微信',icon: ''),
alipay(label: '支付宝',icon: ''),
zijin(label: '紫荆币',icon: ''),;
final String label;
final String icon;
const PayType({
required this.label,
required this.icon
});
}
class BookPayPage extends StatefulWidget {
const BookPayPage({Key? key}) : super(key: key);
@override
State<BookPayPage> createState() => _BookPayPageState();
}
class _BookPayPageState extends State<BookPayPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('支付'),),
body: Column(
children: [
Expanded(
child: SingleChildScrollView(
child: Column(
children: [
const BookCell(type: BookCellType.pay,),
const SizedBox(height: 10,),
Container(
height: 100,
color: Colors.lime,
),
const SizedBox(height: 10,),
Container(
margin: EdgeInsets.symmetric(horizontal: 10),
color: Colors.white,
child: Column(
children: [
_creatPayItem(PayType.wechat),
Container(margin: EdgeInsets.symmetric(horizontal: 10),color: Color(0xFFF0F0F0),height: 1,),
_creatPayItem(PayType.alipay),
Container(margin: EdgeInsets.symmetric(horizontal: 10),color: Color(0xFFF0F0F0),height: 1,),
_creatPayItem(PayType.zijin)
],
),
)
],
),
),
),
SafeArea(
child: _creatPayWidget()
)
],
),
);
}
/// 确认支付组件
Widget _creatPayWidget(){
return Container(
padding: const EdgeInsets.symmetric(horizontal: 15),
height: 50,
// color: Colors.cyan,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const Row(
children: [
Text('应付:',style: TextStyle(fontSize:11,color: Color(0xFF333333) ),),
Text('¥98.9',style: TextStyle(fontSize:13,color:AppTheme.primary,fontWeight: FontWeight.w500 ),)
],
),
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(15),
color: Colors.indigo
),
padding: const EdgeInsets.symmetric(horizontal:13.5,vertical: 5),
child: const Text('确认支付',style: TextStyle(fontSize: 12,fontWeight: FontWeight.w500,color: Colors.white),),
)
],
),
);
}
/// 支付小组件
Widget _creatPayItem(PayType type){
return Container(
padding: EdgeInsets.symmetric(horizontal: 14),
// color: Colors.red,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
child: Row(
children: [
Container(
margin: EdgeInsets.symmetric(vertical: 10),
color: Colors.cyan,
width:20,
height:20,
),
SizedBox(width: 7,),
Text('${type.label}',style: TextStyle(fontSize: 12,color: Color(0xFF333333)))
],
),
),
Container(
color: Colors.cyan,
width:15,
height:15,
)
],
)
);
}
}
library book_shop;
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:go_router/go_router.dart';
import '../../routes/index.dart';
import '../../theme.dart';
......
......@@ -33,47 +33,50 @@ class _BookShopPageState extends State<BookShopPage> {
Widget createCounter() {
return Container(
color: Colors.white,
padding: EdgeInsets.only(left: 20,right: 15),
padding: const EdgeInsets.only(left: 20,right: 15),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
child: Row(
children: [
Container(
height: 17,
width: 17,
color: Colors.yellow,
),
SizedBox(width: 11),
Text('全选',style: TextStyle(color: Color(0xFF333333),fontSize: 12,fontWeight: FontWeight.w500)),
SizedBox(width: 15,),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('合计 ¥98.9',style: TextStyle(color: AppTheme.primary,fontSize: 12,fontWeight: FontWeight.w500)),
Text('已选 2 件',style: TextStyle(color: Color(0xFF9999999),fontSize: 10,))
],
)
],
),
Row(
children: [
Container(
height: 17,
width: 17,
color: Colors.yellow,
),
const SizedBox(width: 11),
const Text('全选',style: TextStyle(color: Color(0xFF333333),fontSize: 12,fontWeight: FontWeight.w500)),
const SizedBox(width: 15,),
const Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('合计 ¥98.9',style: TextStyle(color: AppTheme.primary,fontSize: 12,fontWeight: FontWeight.w500)),
Text('已选 2 件',style: TextStyle(color: Color(0xFF999999),fontSize: 10,))
],
)
],
),
Container(
margin: EdgeInsets.symmetric(vertical: 9),
decoration: BoxDecoration(
color: AppTheme.primary,
borderRadius: BorderRadius.circular(15),
GestureDetector(
onTap: (){
context.pushNamed(Routes.bookPay);
},
child: Container(
margin: const EdgeInsets.symmetric(vertical: 9),
decoration: BoxDecoration(
color: AppTheme.primary,
borderRadius: BorderRadius.circular(15),
),
padding: const EdgeInsets.symmetric(vertical: 5,horizontal: 18),
child: const Text('结算(2)',style: TextStyle(color: Colors.white,fontSize: 12,fontWeight: FontWeight.w500),),
),
padding: EdgeInsets.symmetric(vertical: 5,horizontal: 18),
child: Text('结算(2)',style: TextStyle(color: Colors.white,fontSize: 12,fontWeight: FontWeight.w500),),
)
],
),
Container(
height: 1,
color: Color(0xFFF9F9F9),
color: const Color(0xFFF9F9F9),
)
],
),
......
part of book_shop;
enum BookCellType {
normal,
pay,
}
class BookCell extends StatelessWidget {
const BookCell({Key? key}) : super(key: key);
final BookCellType? type;
const BookCell({
super.key,
this.type = BookCellType.normal,
});
@override
Widget build(BuildContext context) {
......@@ -28,19 +37,13 @@ class BookCell extends StatelessWidget {
margin: const EdgeInsets.only(left: 12,right: 11),
child: Row(
children: [
Container(
type == BookCellType.normal?Container(
height: 17,
width: 17,
color: Colors.cyan,
),
const SizedBox(width: 12,),
):const SizedBox(),
type == BookCellType.normal?const SizedBox(width: 12,):const SizedBox(),
Container(
child: Container(
padding: EdgeInsets.all(2),
child: Container(
color: Colors.cyan,
),
),
decoration: BoxDecoration(
color: Colors.cyan,
borderRadius: BorderRadius.circular(3),
......@@ -56,6 +59,12 @@ class BookCell extends StatelessWidget {
// color: Colors.white,
height: 86,
width: 72,
child: Container(
padding: EdgeInsets.all(2),
child: Container(
color: Colors.cyan,
),
),
)
],
......
......@@ -4,6 +4,7 @@ import 'package:flutter/cupertino.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter_book/pages/about/index.dart';
import 'package:flutter_book/pages/ad/index.dart';
import 'package:flutter_book/pages/book_pay/index.dart';
import 'package:flutter_book/pages/login/index.dart';
import 'package:flutter_book/pages/main/index.dart';
import 'package:flutter_book/pages/splash/index.dart';
......
......@@ -10,6 +10,7 @@ abstract class Routes {
static const login = 'login';
static const web = 'web';
static const about = 'about';
static const bookPay = 'book_pay';
static final GoRouter config = GoRouter(
......@@ -70,6 +71,15 @@ abstract class Routes {
key: state.pageKey,
child: const AboutPage()
)
),
GoRoute(
path: '/$bookPay',
name: bookPay,
pageBuilder: (context, state) =>CupertinoPage(
name: state.uri.toString(),
key: state.pageKey,
child: const BookPayPage()
)
)
]
);
......
......@@ -183,7 +183,7 @@ abstract class AppTheme {
bottomNavigationBarTheme: BottomNavigationBarThemeData(
type: BottomNavigationBarType.fixed,
elevation: 0,
backgroundColor: scheme.background,
backgroundColor: Colors.white,
unselectedItemColor: scheme.onBackground.withOpacity(0.5),
selectedItemColor: scheme.primary,
unselectedLabelStyle: TextStyle(fontSize: 10.w, height: 1.6),
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论