修改ui设计错误
This commit is contained in:
czz
672
lib/pages/mh_page/device_share_page.dart
Normal file
672
lib/pages/mh_page/device_share_page.dart
Normal file
@@ -0,0 +1,672 @@
|
||||
import 'package:ef/ef.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutterflow_ui/flutterflow_ui.dart';
|
||||
import 'package:vbvs_app/common/color/appConstants.dart';
|
||||
import 'package:vbvs_app/common/util/CommonVariables.dart';
|
||||
import 'package:vbvs_app/common/util/FitTool.dart';
|
||||
import 'package:vbvs_app/common/util/MyUtils.dart';
|
||||
import 'package:vbvs_app/component/tool/ClickableContainer.dart';
|
||||
import 'package:vbvs_app/controller/main_bottom/global_controller.dart';
|
||||
import 'package:vbvs_app/controller/mh_controller/mhdevice_share_controller.dart';
|
||||
import 'package:vbvs_app/pages/mh_page/EmptyMessageWidget.dart';
|
||||
import 'package:vbvs_app/pages/mh_page/ShareUserWidget.dart';
|
||||
|
||||
class ShareDeviceWidget extends GetView<MHDeviceShareController> {
|
||||
final scaffoldKey = GlobalKey<ScaffoldState>();
|
||||
|
||||
final ScrollController scrollController = ScrollController();
|
||||
|
||||
// ShareDeviceWidget() {
|
||||
// controller.initData();
|
||||
// scrollController.addListener(() {
|
||||
// if (scrollController.position.pixels ==
|
||||
// scrollController.position.maxScrollExtent &&
|
||||
// controller.model.hasMore) {
|
||||
// controller.initData();
|
||||
// controller.updateAll();
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
final _formKey = GlobalKey<FormState>();
|
||||
final _phoneController = TextEditingController();
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
var deviceController = Get.find<GlobalController>();
|
||||
controller.model.msg = "";
|
||||
controller.model.show = 0;
|
||||
controller.model.type = 1;
|
||||
return GestureDetector(
|
||||
onTap: () => FocusScope.of(context).unfocus(),
|
||||
child: Container(
|
||||
decoration: const BoxDecoration(
|
||||
image: DecorationImage(
|
||||
image: AssetImage('assets/images/new_background.png'), // 本地图片
|
||||
fit: BoxFit.fill, // 填满整个 Container
|
||||
),
|
||||
),
|
||||
child: Scaffold(
|
||||
appBar: AppBar(
|
||||
backgroundColor: Colors.transparent,
|
||||
automaticallyImplyLeading: false,
|
||||
iconTheme: const IconThemeData(color: Colors.white),
|
||||
titleSpacing: 0,
|
||||
title: Container(
|
||||
width: double.infinity,
|
||||
height: 180.rpx,
|
||||
child: Stack(
|
||||
alignment: Alignment.center,
|
||||
children: [
|
||||
// 中间居中的标题
|
||||
Text(
|
||||
'分享设备',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 30.rpx,
|
||||
),
|
||||
),
|
||||
// 左侧图标
|
||||
Positioned(
|
||||
left: 20.rpx,
|
||||
child: returnIconButtomNew,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
actions: [],
|
||||
centerTitle: false,
|
||||
),
|
||||
key: scaffoldKey,
|
||||
backgroundColor: Colors.transparent,
|
||||
body: SingleChildScrollView(
|
||||
child: Container(
|
||||
width: MediaQuery.sizeOf(context).width,
|
||||
height: MediaQuery.sizeOf(context).height * 1,
|
||||
child: Padding(
|
||||
padding:
|
||||
EdgeInsetsDirectional.fromSTEB(30.rpx, 0, 30.rpx, 0),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
children: [
|
||||
Padding(
|
||||
padding:
|
||||
EdgeInsetsDirectional.fromSTEB(0, 30.rpx, 0, 0),
|
||||
child: Container(
|
||||
width: MediaQuery.sizeOf(context).width,
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xFF003058),
|
||||
borderRadius: BorderRadius.circular(16.rpx),
|
||||
),
|
||||
child: Padding(
|
||||
padding: EdgeInsetsDirectional.fromSTEB(
|
||||
30.rpx, 49.rpx, 30.rpx, 80.rpx),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
Column(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
crossAxisAlignment:
|
||||
CrossAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
'将以下设备分享给您的家人或朋友 ',
|
||||
style: FlutterFlowTheme.of(context)
|
||||
.bodyMedium
|
||||
.override(
|
||||
fontFamily: 'Readex Pro',
|
||||
color: Colors.white,
|
||||
fontSize: 30.rpx,
|
||||
letterSpacing: 0.0,
|
||||
lineHeight: 1,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'设备ID：${deviceController.model.deviceMain['mac']}',
|
||||
style: FlutterFlowTheme.of(context)
|
||||
.bodyMedium
|
||||
.override(
|
||||
fontFamily: 'Readex Pro',
|
||||
color: const Color(0xFF6BFDAC),
|
||||
fontSize: 26.rpx,
|
||||
letterSpacing: 0.0,
|
||||
lineHeight: 1),
|
||||
),
|
||||
].divide(SizedBox(height: 65.rpx)),
|
||||
),
|
||||
Padding(
|
||||
padding: EdgeInsetsDirectional.fromSTEB(
|
||||
0, 80.rpx, 0, 0),
|
||||
child: Container(
|
||||
width: MediaQuery.sizeOf(context).width,
|
||||
constraints: const BoxConstraints(
|
||||
minHeight: 46,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius:
|
||||
BorderRadius.circular(16.rpx),
|
||||
),
|
||||
child: Align(
|
||||
alignment:
|
||||
const AlignmentDirectional(0, 0),
|
||||
child: Form(
|
||||
key: _formKey,
|
||||
child: TextFormField(
|
||||
controller: _phoneController,
|
||||
decoration: InputDecoration(
|
||||
hintText: '请输入对方手机号',
|
||||
hintStyle:
|
||||
FlutterFlowTheme.of(context)
|
||||
.labelMedium
|
||||
.override(
|
||||
fontFamily:
|
||||
'Readex Pro',
|
||||
color: const Color(
|
||||
0xFF929699),
|
||||
fontSize: 36.rpx,
|
||||
),
|
||||
enabledBorder:
|
||||
const UnderlineInputBorder(
|
||||
borderSide: BorderSide(
|
||||
color: Color(0xFF929699),
|
||||
width: 0),
|
||||
),
|
||||
focusedBorder:
|
||||
const UnderlineInputBorder(
|
||||
borderSide: BorderSide(
|
||||
color: Color(0xFF929699),
|
||||
width: 0),
|
||||
),
|
||||
errorBorder:
|
||||
const UnderlineInputBorder(
|
||||
borderSide: BorderSide(
|
||||
color: Colors.red,
|
||||
width: 0),
|
||||
),
|
||||
focusedErrorBorder:
|
||||
const UnderlineInputBorder(
|
||||
borderSide: BorderSide(
|
||||
color: Colors.redAccent,
|
||||
width: 0),
|
||||
),
|
||||
contentPadding:
|
||||
const EdgeInsets.only(
|
||||
left: 10, bottom: 5),
|
||||
),
|
||||
style:
|
||||
FlutterFlowTheme.of(context)
|
||||
.bodyMedium
|
||||
.override(
|
||||
fontFamily:
|
||||
'Readex Pro',
|
||||
color: Colors.white,
|
||||
fontSize: 36.rpx,
|
||||
),
|
||||
validator: (value) {
|
||||
if (value == null ||
|
||||
value.isEmpty) {
|
||||
return '手机号不能为空';
|
||||
}
|
||||
final phoneReg =
|
||||
RegExp(r'^1[3-9]\d{9}$');
|
||||
if (!phoneReg.hasMatch(value)) {
|
||||
return '请输入正确的手机号';
|
||||
}
|
||||
return null;
|
||||
},
|
||||
onChanged: (value) {
|
||||
controller.model.phone = value;
|
||||
},
|
||||
),
|
||||
)
|
||||
// TextFormField(
|
||||
// // controller: _model.textController,
|
||||
// // focusNode: _model.textFieldFocusNode,
|
||||
// // autofocus: true,
|
||||
// obscureText: false,
|
||||
// decoration: InputDecoration(
|
||||
// hintText: '请输入对方手机号',
|
||||
// hintStyle: FlutterFlowTheme.of(
|
||||
// context)
|
||||
// .labelMedium
|
||||
// .override(
|
||||
// fontFamily: 'Readex Pro',
|
||||
// color:
|
||||
// const Color(0xFFD2D2D2),
|
||||
// fontSize: 13,
|
||||
// letterSpacing: 0.0,
|
||||
// ),
|
||||
// enabledBorder:
|
||||
// const UnderlineInputBorder(
|
||||
// borderSide: BorderSide(
|
||||
// color: Color(0xFFCCCCCC),
|
||||
// width: 1),
|
||||
// ),
|
||||
// focusedBorder:
|
||||
// const UnderlineInputBorder(
|
||||
// borderSide: BorderSide(
|
||||
// color: Color(0xFF929699),
|
||||
// width: 0),
|
||||
// ),
|
||||
// errorBorder:
|
||||
// const UnderlineInputBorder(
|
||||
// borderSide: BorderSide(
|
||||
// color: Colors.red, width: 1),
|
||||
// ),
|
||||
// focusedErrorBorder:
|
||||
// const UnderlineInputBorder(
|
||||
// borderSide: BorderSide(
|
||||
// color: Colors.redAccent,
|
||||
// width: 1.5),
|
||||
// ),
|
||||
// contentPadding:
|
||||
// const EdgeInsets.only(
|
||||
// left: 10, bottom: 5),
|
||||
// ),
|
||||
// style: FlutterFlowTheme.of(context)
|
||||
// .bodyMedium
|
||||
// .override(
|
||||
// fontFamily: 'Readex Pro',
|
||||
// fontSize: 13,
|
||||
// letterSpacing: 0.0,
|
||||
// ),
|
||||
// onChanged: (value) {
|
||||
// controller.model.phone = value;
|
||||
// },
|
||||
// // validator: _model.textControllerValidator
|
||||
// // .asValidator(context),
|
||||
// ),
|
||||
|
||||
),
|
||||
),
|
||||
),
|
||||
ClickableContainer(
|
||||
backgroundColor: Colors.transparent,
|
||||
highlightColor: Colors.transparent,
|
||||
padding: EdgeInsets.only(top: 30.rpx),
|
||||
onTap: () {},
|
||||
child: Container(
|
||||
decoration: const BoxDecoration(
|
||||
border: Border(
|
||||
bottom: BorderSide(
|
||||
color: Color(0xFF85F5FF),
|
||||
width: 0), // 下边线
|
||||
),
|
||||
),
|
||||
child: Text(
|
||||
'点击复制APP下载链接',
|
||||
style: TextStyle(
|
||||
color: Color(0xFF85F5FF), // 蓝色文字
|
||||
|
||||
fontSize: 22.rpx,
|
||||
),
|
||||
),
|
||||
)),
|
||||
// Container(
|
||||
// width: MediaQuery.sizeOf(context).width,
|
||||
// constraints: const BoxConstraints(
|
||||
// minHeight: 46,
|
||||
// ),
|
||||
// decoration: BoxDecoration(
|
||||
// borderRadius: BorderRadius.circular(0),
|
||||
// ),
|
||||
// child: Align(
|
||||
// alignment:
|
||||
// const AlignmentDirectional(0, 0),
|
||||
// child: Obx(() {
|
||||
// if (controller.model.show == 0) {
|
||||
// return Container();
|
||||
// } else {
|
||||
// return GestureDetector(
|
||||
// onTap: controller
|
||||
// .model.msg!.isNotEmpty
|
||||
// ? () {
|
||||
// Clipboard.setData(
|
||||
// ClipboardData(
|
||||
// text: CommonVariables
|
||||
// .shareText));
|
||||
// showToast(
|
||||
// "复制成功，粘贴分享APP下载链接！",
|
||||
// color: color_success);
|
||||
// }
|
||||
// : null, // 不可点击时设置为 null
|
||||
// child: RichText(
|
||||
// textAlign: TextAlign
|
||||
// .center, // 设置整个 RichText 内容居中
|
||||
// text: TextSpan(
|
||||
// children:
|
||||
// controller.model.msg!
|
||||
// .isNotEmpty
|
||||
// ? [
|
||||
// TextSpan(
|
||||
// text: controller
|
||||
// .model
|
||||
// .msg! +
|
||||
// "!", // 第一部分文本
|
||||
// style: FlutterFlowTheme.of(
|
||||
// context)
|
||||
// .bodyMedium
|
||||
// .override(
|
||||
// fontFamily:
|
||||
// 'Readex Pro',
|
||||
// color: const Color(
|
||||
// 0xFFE55E92), // 设置为粉红色
|
||||
// fontSize:
|
||||
// 26.rpx,
|
||||
// letterSpacing:
|
||||
// 0.0,
|
||||
// ),
|
||||
// ),
|
||||
// const TextSpan(
|
||||
// text:
|
||||
// '\n', // 添加换行
|
||||
// ),
|
||||
// WidgetSpan(
|
||||
// child: SizedBox(
|
||||
// height: 20
|
||||
// .rpx), // 添加间距
|
||||
// ),
|
||||
// TextSpan(
|
||||
// text:
|
||||
// '点击复制APP下载链接', // 第二部分文本
|
||||
// style: FlutterFlowTheme.of(
|
||||
// context)
|
||||
// .bodyMedium
|
||||
// .override(
|
||||
// fontFamily:
|
||||
// 'Readex Pro',
|
||||
// color: const Color(
|
||||
// 0xFF1890FF), // 设置为蓝色
|
||||
// fontSize:
|
||||
// 20.rpx,
|
||||
// letterSpacing:
|
||||
// 0.0,
|
||||
// decoration:
|
||||
// TextDecoration
|
||||
// .underline, // 添加下划线
|
||||
// ),
|
||||
// ),
|
||||
// ]
|
||||
// : [
|
||||
// TextSpan(
|
||||
// text:
|
||||
// '发送成功！', // 当 msg 为空时显示的文本
|
||||
// style: FlutterFlowTheme.of(
|
||||
// context)
|
||||
// .bodyMedium
|
||||
// .override(
|
||||
// fontFamily:
|
||||
// 'Readex Pro',
|
||||
// color: const Color(
|
||||
// 0xFF07C160), // 设置为绿色
|
||||
// fontSize:
|
||||
// 20.rpx,
|
||||
// letterSpacing:
|
||||
// 0.0,
|
||||
// ),
|
||||
// ),
|
||||
// ],
|
||||
// ),
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
// })),
|
||||
// ),
|
||||
|
||||
Obx(
|
||||
() => GestureDetector(
|
||||
onTap: () {
|
||||
// 当点击时，将 type 设置为 0（允许控制）
|
||||
controller.model.type = 1;
|
||||
controller.updateAll();
|
||||
},
|
||||
child: Container(
|
||||
margin: EdgeInsets.only(top: 76.rpx),
|
||||
width: MediaQuery.sizeOf(context).width,
|
||||
constraints: const BoxConstraints(
|
||||
minHeight: 46,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius:
|
||||
BorderRadius.circular(0),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
mainAxisAlignment:
|
||||
MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
'允许对方控制该设备',
|
||||
style:
|
||||
FlutterFlowTheme.of(context)
|
||||
.bodyMedium
|
||||
.override(
|
||||
fontFamily:
|
||||
'Readex Pro',
|
||||
color: Colors.white,
|
||||
fontSize: 26.rpx,
|
||||
letterSpacing: 0.0,
|
||||
),
|
||||
),
|
||||
Radio<int>(
|
||||
value: 1,
|
||||
groupValue: controller.model.type,
|
||||
onChanged: (value) {
|
||||
controller.model.type = value!;
|
||||
controller.updateAll();
|
||||
},
|
||||
activeColor:
|
||||
const Color(0xFF6BFDAC),
|
||||
materialTapTargetSize:
|
||||
MaterialTapTargetSize
|
||||
.shrinkWrap, // 减少内边距
|
||||
visualDensity: VisualDensity(
|
||||
horizontal: -4,
|
||||
vertical: -4), // 缩小视觉密度
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Obx(
|
||||
() => GestureDetector(
|
||||
onTap: () {
|
||||
// 当点击时，将 type 设置为 1（仅允许查看）
|
||||
controller.model.type = 2;
|
||||
controller.updateAll();
|
||||
},
|
||||
child: Container(
|
||||
width: MediaQuery.sizeOf(context).width,
|
||||
constraints: const BoxConstraints(
|
||||
minHeight: 46,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius:
|
||||
BorderRadius.circular(0),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
mainAxisAlignment:
|
||||
MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
'仅允许对方查看该设备',
|
||||
style:
|
||||
FlutterFlowTheme.of(context)
|
||||
.bodyMedium
|
||||
.override(
|
||||
fontFamily:
|
||||
'Readex Pro',
|
||||
color: Colors.white,
|
||||
fontSize: 26.rpx,
|
||||
letterSpacing: 0.0,
|
||||
),
|
||||
),
|
||||
Radio<int>(
|
||||
value: 2,
|
||||
groupValue: controller.model.type,
|
||||
onChanged: (value) {
|
||||
controller.model.type = value!;
|
||||
controller.updateAll();
|
||||
},
|
||||
activeColor:
|
||||
const Color(0xFF6BFDAC),
|
||||
materialTapTargetSize:
|
||||
MaterialTapTargetSize
|
||||
.shrinkWrap, // 减少内边距
|
||||
visualDensity: VisualDensity(
|
||||
horizontal: -4,
|
||||
vertical: -4), // 缩小视觉密度
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Align(
|
||||
alignment: const AlignmentDirectional(0, 0),
|
||||
child: Padding(
|
||||
padding: EdgeInsetsDirectional.fromSTEB(
|
||||
0, 46.rpx, 0, 0),
|
||||
child: Container(
|
||||
width: 108,
|
||||
height: 31,
|
||||
decoration: BoxDecoration(),
|
||||
child: FFButtonWidget(
|
||||
onPressed: () async {
|
||||
//todo 1:验证用户是否存在 2：发送邀请
|
||||
// controller.model.show = 1;
|
||||
// String msg =
|
||||
// await controller.sendInvite(
|
||||
// controller.model.phone,
|
||||
// deviceController
|
||||
// .model.deviceMain['mac']);
|
||||
// if (msg != null && msg.isNotEmpty) {
|
||||
// controller.model.msg = msg;
|
||||
// }
|
||||
// controller.updateAll();
|
||||
},
|
||||
text: '发送邀请',
|
||||
options: FFButtonOptions(
|
||||
height: 60.rpx,
|
||||
padding:
|
||||
EdgeInsetsDirectional.fromSTEB(
|
||||
30.rpx, 0, 30.rpx, 0),
|
||||
color: const Color(0xFF84F5FF),
|
||||
textStyle:
|
||||
FlutterFlowTheme.of(context)
|
||||
.titleSmall
|
||||
.override(
|
||||
fontFamily: 'Readex Pro',
|
||||
color: Color(0xFF011D33),
|
||||
fontSize: 26.rpx,
|
||||
letterSpacing: 0.0,
|
||||
),
|
||||
elevation: 0,
|
||||
borderRadius:
|
||||
BorderRadius.circular(50),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: EdgeInsetsDirectional.fromSTEB(
|
||||
0, 100.rpx, 0, 32.rpx),
|
||||
child: Container(
|
||||
width: MediaQuery.sizeOf(context).width,
|
||||
child: SingleChildScrollView(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
children: [
|
||||
Align(
|
||||
alignment:
|
||||
const AlignmentDirectional(-1, 0),
|
||||
child: Padding(
|
||||
padding: const EdgeInsetsDirectional
|
||||
.fromSTEB(14, 0, 0, 16),
|
||||
child: Text(
|
||||
'已分享用户',
|
||||
style: FlutterFlowTheme.of(context)
|
||||
.bodyMedium
|
||||
.override(
|
||||
fontFamily: 'Readex Pro',
|
||||
color: Colors.white,
|
||||
fontSize: 30.rpx,
|
||||
letterSpacing: 0.0,
|
||||
lineHeight: 1),
|
||||
),
|
||||
),
|
||||
),
|
||||
Obx(
|
||||
() {
|
||||
// 检查 shareUser 是否为空或数量为 0
|
||||
if (controller.model.shareUser ==
|
||||
null ||
|
||||
controller
|
||||
.model.shareUser!.isEmpty) {
|
||||
// return Container(
|
||||
// alignment: AlignmentDirectional
|
||||
// .centerStart, // 确保文字靠左对齐
|
||||
// padding: EdgeInsets.symmetric(
|
||||
// horizontal: 16.0), // 根据需要设置内边距
|
||||
// child: Text(
|
||||
// "暂无分享！",
|
||||
// textAlign: TextAlign.left, // 文字左对齐
|
||||
// style: FlutterFlowTheme.of(context)
|
||||
// .bodyMedium, // 可根据需要自定义样式
|
||||
// ),
|
||||
// );
|
||||
return EmptyMessageWidget(
|
||||
imagePath:
|
||||
"assets/images/emptyUser.png",
|
||||
);
|
||||
}
|
||||
|
||||
// 否则显示正常的 ListView
|
||||
return ListView(
|
||||
controller:
|
||||
scrollController, // 绑定 ScrollController
|
||||
shrinkWrap: true,
|
||||
scrollDirection: Axis.vertical,
|
||||
children: (controller.model.shareUser!
|
||||
.asMap()
|
||||
.entries
|
||||
.map((e) => ShareUserWidget(
|
||||
index: e.key,
|
||||
repairListController:
|
||||
controller))
|
||||
.toList() as List<Widget>)
|
||||
// .divide(const SizedBox(
|
||||
// height: 13,
|
||||
// ))
|
||||
.addToEnd(const SizedBox(
|
||||
height:
|
||||
AppConstants.list_end_height,
|
||||
)),
|
||||
);
|
||||
},
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
)),
|
||||
));
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user