From b0769fe37da63e989c17096da34271c1416c0cd7 Mon Sep 17 00:00:00 2001 From: tanlinxing Date: Tue, 20 Aug 2024 17:44:39 +0800 Subject: [PATCH] =?UTF-8?q?=E5=BA=95=E9=83=A8=E9=83=A8=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .flutter-plugins-dependencies | 2 +- lib/pages/pass_track/bottomMenu.dart | 437 ------------------------ lib/pages/pass_track/iconContainer.dart | 153 +++++++++ lib/pages/pass_track/view.dart | 261 +++++++------- 4 files changed, 275 insertions(+), 578 deletions(-) delete mode 100644 lib/pages/pass_track/bottomMenu.dart create mode 100644 lib/pages/pass_track/iconContainer.dart diff --git a/.flutter-plugins-dependencies b/.flutter-plugins-dependencies index e518847..7bd5548 100644 --- a/.flutter-plugins-dependencies +++ b/.flutter-plugins-dependencies @@ -1 +1 @@ -{"info":"This is a generated file; do not edit or check into version control.","plugins":{"ios":[{"name":"path_provider_foundation","path":"C:\\\\Users\\\\Administrator\\\\AppData\\\\Local\\\\Pub\\\\Cache\\\\hosted\\\\pub.dev\\\\path_provider_foundation-2.4.0\\\\","shared_darwin_source":true,"native_build":true,"dependencies":[]}],"android":[{"name":"path_provider_android","path":"C:\\\\Users\\\\Administrator\\\\AppData\\\\Local\\\\Pub\\\\Cache\\\\hosted\\\\pub.dev\\\\path_provider_android-2.2.10\\\\","native_build":true,"dependencies":[]}],"macos":[{"name":"path_provider_foundation","path":"C:\\\\Users\\\\Administrator\\\\AppData\\\\Local\\\\Pub\\\\Cache\\\\hosted\\\\pub.dev\\\\path_provider_foundation-2.4.0\\\\","shared_darwin_source":true,"native_build":true,"dependencies":[]}],"linux":[{"name":"path_provider_linux","path":"C:\\\\Users\\\\Administrator\\\\AppData\\\\Local\\\\Pub\\\\Cache\\\\hosted\\\\pub.dev\\\\path_provider_linux-2.2.1\\\\","native_build":false,"dependencies":[]}],"windows":[{"name":"path_provider_windows","path":"C:\\\\Users\\\\Administrator\\\\AppData\\\\Local\\\\Pub\\\\Cache\\\\hosted\\\\pub.dev\\\\path_provider_windows-2.3.0\\\\","native_build":false,"dependencies":[]}],"web":[]},"dependencyGraph":[{"name":"path_provider","dependencies":["path_provider_android","path_provider_foundation","path_provider_linux","path_provider_windows"]},{"name":"path_provider_android","dependencies":[]},{"name":"path_provider_foundation","dependencies":[]},{"name":"path_provider_linux","dependencies":[]},{"name":"path_provider_windows","dependencies":[]}],"date_created":"2024-08-19 18:27:32.051943","version":"3.24.0","swift_package_manager_enabled":false} \ No newline at end of file +{"info":"This is a generated file; do not edit or check into version control.","plugins":{"ios":[{"name":"path_provider_foundation","path":"C:\\\\Users\\\\Administrator\\\\AppData\\\\Local\\\\Pub\\\\Cache\\\\hosted\\\\pub.dev\\\\path_provider_foundation-2.4.0\\\\","shared_darwin_source":true,"native_build":true,"dependencies":[]}],"android":[{"name":"path_provider_android","path":"C:\\\\Users\\\\Administrator\\\\AppData\\\\Local\\\\Pub\\\\Cache\\\\hosted\\\\pub.dev\\\\path_provider_android-2.2.10\\\\","native_build":true,"dependencies":[]}],"macos":[{"name":"path_provider_foundation","path":"C:\\\\Users\\\\Administrator\\\\AppData\\\\Local\\\\Pub\\\\Cache\\\\hosted\\\\pub.dev\\\\path_provider_foundation-2.4.0\\\\","shared_darwin_source":true,"native_build":true,"dependencies":[]}],"linux":[{"name":"path_provider_linux","path":"C:\\\\Users\\\\Administrator\\\\AppData\\\\Local\\\\Pub\\\\Cache\\\\hosted\\\\pub.dev\\\\path_provider_linux-2.2.1\\\\","native_build":false,"dependencies":[]}],"windows":[{"name":"path_provider_windows","path":"C:\\\\Users\\\\Administrator\\\\AppData\\\\Local\\\\Pub\\\\Cache\\\\hosted\\\\pub.dev\\\\path_provider_windows-2.3.0\\\\","native_build":false,"dependencies":[]}],"web":[]},"dependencyGraph":[{"name":"path_provider","dependencies":["path_provider_android","path_provider_foundation","path_provider_linux","path_provider_windows"]},{"name":"path_provider_android","dependencies":[]},{"name":"path_provider_foundation","dependencies":[]},{"name":"path_provider_linux","dependencies":[]},{"name":"path_provider_windows","dependencies":[]}],"date_created":"2024-08-20 16:40:54.130946","version":"3.24.0","swift_package_manager_enabled":false} \ No newline at end of file diff --git a/lib/pages/pass_track/bottomMenu.dart b/lib/pages/pass_track/bottomMenu.dart deleted file mode 100644 index c2ab619..0000000 --- a/lib/pages/pass_track/bottomMenu.dart +++ /dev/null @@ -1,437 +0,0 @@ -import 'package:cpnav/pages/pass_track/view.dart'; -import 'package:flutter/material.dart'; -import 'package:flutter/widgets.dart'; - -class BottomMenu extends StatefulWidget { - @override - _BottomMenuState createState() => _BottomMenuState(); -} - -class _BottomMenuState extends State { - int _selectedIndex = -1; - void _temporarilySelectContainer(int index) { - setState(() { - _selectedIndex = index; - }); - Future.delayed(Duration(milliseconds: 200), () { - setState(() { - _selectedIndex = -1; - }); - }); - } - - @override - Widget build(BuildContext context) { - var isPortrait = MediaQuery.of(context).orientation == Orientation.portrait; - return isPortrait - ? Positioned( - right: 10, - bottom: 130, - child: Column( - mainAxisSize: MainAxisSize.min, - children: [ - Container( - width: 36, - decoration: BoxDecoration( - color: Colors.transparent, // 设置背景为透明 - border: Border.all( - color: Color.fromARGB(255, 54, 52, 52), - width: 1.0, // 设置边框宽度 - ), - borderRadius: BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: Column(children: [ - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - ), - borderRadius: BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.article, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - ), - borderRadius: BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.speed, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - ), - borderRadius: BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.thermostat, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - width: 2.0, // 设置边框宽度 - ), - borderRadius: BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.zoom_in, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - width: 2.0, // 设置边框宽度 - ), - borderRadius: BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.zoom_out, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - ), - borderRadius: BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.refresh, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - ), - borderRadius: BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.place, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - ]), - ), - ], - )) - : Positioned( - right: 10, - bottom: 15, - child: Column( - mainAxisSize: MainAxisSize.min, - children: [ - Container( - height: 36, - decoration: BoxDecoration( - color: Colors.transparent, // 设置背景为透明 - border: Border.all( - color: Color.fromARGB(255, 54, 52, 52), - width: 1.0, // 设置边框宽度 - ), - borderRadius: BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: Center( - // 使用 Center 小部件将子容器居中 - child: Row( - mainAxisSize: MainAxisSize.min, - children: [ - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - ), - borderRadius: - BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.article, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - ), - borderRadius: - BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.speed, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - ), - borderRadius: - BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.thermostat, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - width: 2.0, // 设置边框宽度 - ), - borderRadius: - BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.zoom_in, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - width: 2.0, // 设置边框宽度 - ), - borderRadius: - BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.zoom_out, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - ), - borderRadius: - BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.refresh, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - Container( - width: 30, - height: 30, - decoration: BoxDecoration( - color: Colors.green, // 设置背景颜色为绿色 - border: Border.all( - color: Colors.white, // 设置边框颜色为白色 - ), - borderRadius: - BorderRadius.circular(5.0), // 可选：设置圆角边框 - ), - child: InkWell( - child: const Icon( - Icons.place, - color: Colors.white, - ), - onTap: () { - mapcontroller.scale = 1.0; - mapcontroller.rotation.value = 0.0; - mapcontroller.updateCount.value++; - // onUpdate?.call( - // mapcontroller.centerXY, 1.0, 0.0); - // sight.reset(); - }, - ), - ), - ], - ), - ), - ), - ], - )); - } -} diff --git a/lib/pages/pass_track/iconContainer.dart b/lib/pages/pass_track/iconContainer.dart new file mode 100644 index 0000000..da818b3 --- /dev/null +++ b/lib/pages/pass_track/iconContainer.dart @@ -0,0 +1,153 @@ +import 'package:cpnav/pages/pass_track/view.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter/widgets.dart'; + +class IconContainer extends StatefulWidget { + @override + _IconContainerState createState() => _IconContainerState(); +} + +class _IconContainerState extends State { + final Map _iconColors = { + Icons.article: Colors.green, + Icons.speed: Colors.green, + Icons.thermostat: Colors.green, + Icons.zoom_in: Colors.green, + Icons.zoom_out: Colors.green, + Icons.refresh: Colors.green, + Icons.place: Colors.green, + }; + + void _handleTap(IconData icon, VoidCallback onTap) { + setState(() { + _iconColors[icon] = const Color.fromARGB(255, 166, 182, 149); // 点击后变浅的颜色 + }); + onTap(); + Future.delayed(Duration(milliseconds: 200), () { + setState(() { + _iconColors[icon] = Colors.green; // 恢复原色 + }); + }); + } + + @override + Widget build(BuildContext context) { + var isPortrait = MediaQuery.of(context).orientation == Orientation.portrait; + return isPortrait + ? Positioned( + right: 10, + bottom: 130, + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + Container( + width: 36, + decoration: BoxDecoration( + color: Colors.transparent, + border: Border.all( + color: Color.fromARGB(255, 54, 52, 52), + width: 1.0, + ), + borderRadius: BorderRadius.circular(5.0), + ), + child: Column( + children: [ + _buildIcon(Icons.article, () { + mapcontroller.scale = 1.0; + mapcontroller.rotation.value = 0.0; + mapcontroller.updateCount.value++; + }), + _buildIcon(Icons.speed, () { + // 处理 speed 图标的点击事件 + }), + _buildIcon(Icons.thermostat, () { + // 处理 thermostat 图标的点击事件 + }), + _buildIcon(Icons.zoom_in, () { + // 处理 zoom_in 图标的点击事件 + }), + _buildIcon(Icons.zoom_out, () { + // 处理 zoom_out 图标的点击事件 + }), + _buildIcon(Icons.refresh, () { + // 处理 refresh 图标的点击事件 + }), + _buildIcon(Icons.place, () { + // 处理 place 图标的点击事件 + }), + ], + ), + ) + ], + )) + : Positioned( + right: 10, + bottom: 15, + child: Row( + mainAxisSize: MainAxisSize.min, + children: [ + Container( + height: 36, + decoration: BoxDecoration( + color: Colors.transparent, + border: Border.all( + color: Color.fromARGB(255, 54, 52, 52), + width: 1.0, + ), + borderRadius: BorderRadius.circular(5.0), + ), + child: Row( + children: [ + _buildIcon(Icons.article, () { + mapcontroller.scale = 1.0; + mapcontroller.rotation.value = 0.0; + mapcontroller.updateCount.value++; + }), + _buildIcon(Icons.speed, () { + // 处理 speed 图标的点击事件 + }), + _buildIcon(Icons.thermostat, () { + // 处理 thermostat 图标的点击事件 + }), + _buildIcon(Icons.zoom_in, () { + // 处理 zoom_in 图标的点击事件 + }), + _buildIcon(Icons.zoom_out, () { + // 处理 zoom_out 图标的点击事件 + }), + _buildIcon(Icons.refresh, () { + // 处理 refresh 图标的点击事件 + }), + _buildIcon(Icons.place, () { + // 处理 place 图标的点击事件 + }), + ], + ), + ) + ], + )); + } + + Widget _buildIcon(IconData icon, VoidCallback onTap) { + return Container( + width: 30, + height: 30, + margin: EdgeInsets.symmetric(vertical: 2.0), + decoration: BoxDecoration( + color: _iconColors[icon], + border: Border.all( + color: Colors.white, + ), + borderRadius: BorderRadius.circular(5.0), + ), + child: InkWell( + child: Icon( + icon, + color: Colors.white, + ), + onTap: () => _handleTap(icon, onTap), + ), + ); + } +} + diff --git a/lib/pages/pass_track/view.dart b/lib/pages/pass_track/view.dart index ecc7527..df2c0a1 100644 --- a/lib/pages/pass_track/view.dart +++ b/lib/pages/pass_track/view.dart @@ -9,7 +9,7 @@ import 'package:scence_map/controller.dart'; import 'package:scence_map/scence_map.dart'; import 'package:bottom_picker/bottom_picker.dart'; import 'package:syncfusion_flutter_sliders/sliders.dart'; -import 'bottomMenu.dart'; +import 'iconContainer.dart'; import "controller.dart"; // import '../login_in/connect/bluetooth_page.dart'; // import '../login_in/connect/config.dart'; @@ -32,8 +32,6 @@ class PassTrack extends StatefulWidget { State createState() => _PasstrackState(); } -// FileHandle fileHandle = FileHandle(); - class _PasstrackState extends State { final controller = Get.put(PassTrackController("WXLMB", "cp_orad")); String str = "播放"; @@ -42,9 +40,8 @@ class _PasstrackState extends State { int speed = 50; List speedList = [1, 2, 10, 20, 50, 100, 200, 500]; int maxLength = 200; - // int _value = 0; SfRangeValues _rangevalues = const SfRangeValues(0.0, 200.0); - // late final ScenceMapScaleMoveCallback? onUpdate; + @override initState() { super.initState(); @@ -102,51 +99,48 @@ class _PasstrackState extends State { Widget build(BuildContext context) { final size = MediaQuery.of(context).size; var isPortrait = MediaQuery.of(context).orientation == Orientation.portrait; - return Stack( - children: [ - ScenceMapView( - children: [], - onUpdate: (Offset center, double scale, double rotation) { - print("center:$center scale:$scale rotation:$rotation"); - }, - ), - Positioned( - width: isPortrait ? size.width * .63 : size.width * .42, - left: isPortrait ? 190 : 200, - bottom: 30, - child: Container( - padding: EdgeInsets.only(bottom: 5), - child: SfRangeSlider( - // 双向 - min: 0.0, - max: maxLength, - values: _rangevalues, - // interval: 5, - showTicks: false, - showLabels: false, - enableTooltip: true, - minorTicksPerInterval: 1, - stepSize: 1, - onChanged: (SfRangeValues values) { - setState(() { - _rangevalues = SfRangeValues( - values.start.roundToDouble(), values.end.roundToDouble()); - }); - }, + return OrientationBuilder(builder: (context, orientation) { + return Stack( + children: [ + ScenceMapView( + children: [], + onUpdate: (Offset center, double scale, double rotation) { + print("center:$center scale:$scale rotation:$rotation"); + }, + ), + Positioned( + width: isPortrait ? size.width * .63 : size.width * .42, + left: isPortrait ? 190 : 200, + bottom: 30, + child: Container( + padding: const EdgeInsets.only(bottom: 5), + child: SfRangeSlider( + min: 0.0, + max: maxLength, + values: _rangevalues, + showTicks: false, + showLabels: false, + enableTooltip: true, + minorTicksPerInterval: 1, + stepSize: 1, + onChanged: (SfRangeValues values) { + setState(() { + _rangevalues = SfRangeValues(values.start.roundToDouble(), + values.end.roundToDouble()); + }); + }, + ), ), ), - ), - Positioned( - left: isPortrait ? 190 : 200, - bottom: 0, - child: Row( - children: [ - const SizedBox( - width: 18, - ), - SizedBox( - width: 74, // 设置按钮的宽度 - child: ElevatedButton( + Positioned( + left: isPortrait ? 190 : 200, + bottom: 0, + child: Row( + children: [ + const SizedBox(width: 18), + SizedBox( + width: 74, + child: ElevatedButton( style: ButtonStyle( backgroundColor: MaterialStateProperty.all( str == "播放" ? Colors.blue : Colors.red, @@ -154,107 +148,94 @@ class _PasstrackState extends State { ), onPressed: () { setState(() { - if (str == "播放") { - str = "暂停"; - } else { - str = "播放"; - } + str = str == "播放" ? "暂停" : "播放"; }); }, child: Text( str, - style: TextStyle(fontSize: 12, color: Colors.black), - )), - ), - const SizedBox( - width: 5, - ), - ElevatedButton( - style: ButtonStyle( - backgroundColor: MaterialStateProperty.all( - Colors.transparent, + style: const TextStyle(fontSize: 12, color: Colors.black), + ), ), ), - onPressed: () { - _openSpeedPicker(context, speedList); - }, - child: Text(speed.toString()), - ), - const SizedBox( - width: 15, - ), - Column(children: [ - Text("此处遍数：0"), - StreamBuilder( - stream: Stream.periodic( - Duration(seconds: 1), (_) => DateTime.now()), - builder: (context, snapshot) { - if (snapshot.hasData) { - final dateTime = snapshot.data!.toLocal(); - final formattedDate = - "${dateTime.year % 100}-${dateTime.month.toString().padLeft(2, '0')}-${dateTime.day.toString().padLeft(2, '0')}"; - final formattedTime = - "${dateTime.hour.toString().padLeft(2, '0')}:${dateTime.minute.toString().padLeft(2, '0')}:${dateTime.second.toString().padLeft(2, '0')}"; - return Text( - "$formattedDate $formattedTime", - style: const TextStyle( - fontSize: 16, - fontWeight: FontWeight.bold, + const SizedBox(width: 5), + Container( + width: 82, + height: 35, + padding: const EdgeInsets.symmetric(horizontal: 1.0), + decoration: BoxDecoration( + color: const Color.fromARGB(255, 255, 255, 255), + border: Border.all(color: Colors.black), + ), + child: Row( + mainAxisSize: MainAxisSize.min, + children: [ + Center( + child: Text( + "$speed X", + style: const TextStyle( + fontSize: 11, color: Colors.black), ), - ); - } else { - return const Text( - "加载中...", - style: TextStyle( - fontSize: 16, fontWeight: FontWeight.bold), - ); - } - }, + ), + PopupMenuButton( + padding: const EdgeInsets.all(1.0), + icon: const Icon(Icons.arrow_drop_up, + color: Color.fromARGB(255, 47, 48, 47)), + onSelected: (int value) { + setState(() { + speed = value; + }); + }, + itemBuilder: (BuildContext context) { + return speedList.map((int speed) { + return PopupMenuItem( + height: 30, + value: speed, + child: Text("$speed X速度"), + ); + }).toList(); + }, + ), + ], + ), ), - ]) - ], - ), - ), - BottomMenu(), - ], - ); - } - - void _openSpeedPicker(BuildContext context, List items) { - List list = items.map((speed) => Text("$speed 速度")).toList(); - showModalBottomSheet( - context: context, - builder: (BuildContext context) { - return Container( - width: MediaQuery.of(context).size.width * 0.5, // 设置宽度为屏幕宽度的 80% - child: BottomPicker( - items: list, - pickerTitle: Text('选择播放速度'), - titleAlignment: Alignment.center, - titlePadding: const EdgeInsets.all(8.0), - dismissable: true, - onSubmit: (index) { - setState(() { - speed = items[index]; - }); - }, - bottomPickerTheme: BottomPickerTheme.morningSalad, - backgroundColor: Colors.white, - pickerTextStyle: const TextStyle( - fontSize: 14, - color: Colors.black, + const SizedBox(width: 12), + Column( + children: [ + const Text("此处遍数：0"), + StreamBuilder( + stream: Stream.periodic( + const Duration(seconds: 1), (_) => DateTime.now()), + builder: (context, snapshot) { + if (snapshot.hasData) { + final dateTime = snapshot.data!.toLocal(); + final formattedDate = + "${dateTime.year % 100}-${dateTime.month.toString().padLeft(2, '0')}-${dateTime.day.toString().padLeft(2, '0')}"; + final formattedTime = + "${dateTime.hour.toString().padLeft(2, '0')}:${dateTime.minute.toString().padLeft(2, '0')}:${dateTime.second.toString().padLeft(2, '0')}"; + return Text( + "$formattedDate $formattedTime", + style: const TextStyle( + fontSize: 16, + fontWeight: FontWeight.bold, + ), + ); + } else { + return const Text( + "加载中...", + style: TextStyle( + fontSize: 16, fontWeight: FontWeight.bold), + ); + } + }, + ), + ], + ) + ], ), - itemExtent: 35.0, - displayCloseIcon: true, - closeIconColor: Colors.black, - closeIconSize: 20, - layoutOrientation: TextDirection.ltr, - buttonAlignment: MainAxisAlignment.end, - displaySubmitButton: true, - buttonContent: Text("确认"), ), - ); - }, - ); + IconContainer() + ], + ); + }); } }