337 lines
15 KiB
Dart
337 lines
15 KiB
Dart
|
import 'package:cpnav/appbar.dart';
|
||
|
|
import 'package:flutter/material.dart';
|
||
|
|
import 'package:flutter/services.dart';
|
||
|
|
import 'package:get/get.dart';
|
||
|
|
import 'pages/pass_track/view.dart';
|
||
|
|
|
||
|
|
void main() {
|
||
|
|
WidgetsFlutterBinding.ensureInitialized();
|
||
|
|
SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: []); //设置全屏
|
||
|
|
runApp(const MyApp());
|
||
|
|
}
|
||
|
|
|
||
|
|
class MyApp extends StatelessWidget {
|
||
|
|
const MyApp({super.key});
|
||
|
|
|
||
|
|
// This widget is the root of your application.
|
||
|
|
@override
|
||
|
|
Widget build(BuildContext context) {
|
||
|
|
return MaterialApp(
|
||
|
|
title: 'Flutter Demo',
|
||
|
|
theme: ThemeData(
|
||
|
|
// This is the theme of your application.
|
||
|
|
//
|
||
|
|
// TRY THIS: Try running your application with "flutter run". You'll see
|
||
|
|
// the application has a purple toolbar. Then, without quitting the app,
|
||
|
|
// try changing the seedColor in the colorScheme below to Colors.green
|
||
|
|
// and then invoke "hot reload" (save your changes or press the "hot
|
||
|
|
// reload" button in a Flutter-supported IDE, or press "r" if you used
|
||
|
|
// the command line to start the app).
|
||
|
|
//
|
||
|
|
// Notice that the counter didn't reset back to zero; the application
|
||
|
|
// state is not lost during the reload. To reset the state, use hot
|
||
|
|
// restart instead.
|
||
|
|
//
|
||
|
|
// This works for code too, not just values: Most code changes can be
|
||
|
|
// tested with just a hot reload.
|
||
|
|
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
|
||
|
|
useMaterial3: true,
|
||
|
|
),
|
||
|
|
home: const MyHomePage(title: 'Flutter Demo Home Page'),
|
||
|
|
);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
class MyHomePage extends StatefulWidget {
|
||
|
|
const MyHomePage({super.key, required this.title});
|
||
|
|
|
||
|
|
// This widget is the home page of your application. It is stateful, meaning
|
||
|
|
// that it has a State object (defined below) that contains fields that affect
|
||
|
|
// how it looks.
|
||
|
|
|
||
|
|
// This class is the configuration for the state. It holds the values (in this
|
||
|
|
// case the title) provided by the parent (in this case the App widget) and
|
||
|
|
// used by the build method of the State. Fields in a Widget subclass are
|
||
|
|
// always marked "final".
|
||
|
|
|
||
|
|
final String title;
|
||
|
|
|
||
|
|
@override
|
||
|
|
State<MyHomePage> createState() => _MyHomePageState();
|
||
|
|
}
|
||
|
|
|
||
|
|
class _MyHomePageState extends State<MyHomePage> {
|
||
|
|
late bool isPortrait;
|
||
|
|
late double appBarHeight = 34.0;
|
||
|
|
|
||
|
|
final _currentIndex = 0.obs;
|
||
|
|
final List<Widget> _pages = [
|
||
|
|
PassTrack(),
|
||
|
|
Container(
|
||
|
|
color: Colors.green,
|
||
|
|
),
|
||
|
|
Container(
|
||
|
|
color: Colors.blue,
|
||
|
|
),
|
||
|
|
Container(
|
||
|
|
color: Colors.yellow,
|
||
|
|
),
|
||
|
|
Container(
|
||
|
|
color: Colors.purple,
|
||
|
|
),
|
||
|
|
];
|
||
|
|
@override
|
||
|
|
Widget build(BuildContext context) {
|
||
|
|
// This method is rerun every time setState is called, for instance as done
|
||
|
|
// by the _incrementCounter method above.
|
||
|
|
//
|
||
|
|
// The Flutter framework has been optimized to make rerunning build methods
|
||
|
|
// fast, so that you can just rebuild anything that needs updating rather
|
||
|
|
// than having to individually change instances of widgets.
|
||
|
|
return Scaffold(
|
||
|
|
appBar: PreferredSize(
|
||
|
|
// TRY THIS: Try changing the color here to a specific color (to
|
||
|
|
// Colors.amber, perhaps?) and trigger a hot reload to see the AppBar
|
||
|
|
// change color while the other colors stay the same.
|
||
|
|
// backgroundColor: Theme.of(context).colorScheme.inversePrimary,
|
||
|
|
// Here we take the value from the MyHomePage object that was created by
|
||
|
|
// the App.build method, and use it to set our appbar title.
|
||
|
|
preferredSize: Size.fromHeight(appBarHeight),
|
||
|
|
child: CustomAppBar(appBarHeight: 56, currentIndex: _currentIndex),
|
||
|
|
),
|
||
|
|
body: OrientationBuilder(
|
||
|
|
builder: (context, orientation) {
|
||
|
|
// final size = MediaQuery.of(context).size;
|
||
|
|
appBarHeight = Orientation.portrait == orientation ? 56.0 : 34.0;
|
||
|
|
isPortrait = Orientation.portrait == orientation ? true : false;
|
||
|
|
appBarHeight = Orientation.portrait == orientation ? 56.0 : 34.0;
|
||
|
|
if (!isPortrait) {
|
||
|
|
return Row(
|
||
|
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||
|
|
children: [
|
||
|
|
Expanded(
|
||
|
|
child: _pages[_currentIndex.value],
|
||
|
|
),
|
||
|
|
const VerticalDivider(
|
||
|
|
width: 1, // 设置高度为1
|
||
|
|
thickness: 1,
|
||
|
|
),
|
||
|
|
SizedBox(
|
||
|
|
width: 48,
|
||
|
|
child: SafeArea(
|
||
|
|
child: LayoutBuilder(builder: (context, constraints) {
|
||
|
|
// 根据屏幕宽度判断横屏或竖屏
|
||
|
|
// if (!isPortrait) {
|
||
|
|
return Column(
|
||
|
|
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||
|
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||
|
|
children: [
|
||
|
|
Column(
|
||
|
|
children: [
|
||
|
|
IconButton(
|
||
|
|
onPressed: () {
|
||
|
|
setState(() {
|
||
|
|
_currentIndex.value = 0;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
icon:
|
||
|
|
const Icon(Icons.date_range_rounded),
|
||
|
|
color: _currentIndex.value == 0
|
||
|
|
? const Color.fromARGB(
|
||
|
|
255, 60, 95, 123)
|
||
|
|
: Colors.grey,
|
||
|
|
),
|
||
|
|
Align(
|
||
|
|
alignment: Alignment.center,
|
||
|
|
child: Text(
|
||
|
|
'实时',
|
||
|
|
style: TextStyle(
|
||
|
|
fontSize: 12,
|
||
|
|
color: _currentIndex.value == 0
|
||
|
|
? const Color.fromARGB(
|
||
|
|
255, 60, 95, 123)
|
||
|
|
: Colors.grey,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
const Divider(
|
||
|
|
height: 1, // 设置高度为1
|
||
|
|
thickness: 1,
|
||
|
|
),
|
||
|
|
//
|
||
|
|
Column(
|
||
|
|
children: [
|
||
|
|
IconButton(
|
||
|
|
onPressed: () {
|
||
|
|
setState(() {
|
||
|
|
_currentIndex.value = 1;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
icon: const Icon(Icons.map_outlined),
|
||
|
|
color: _currentIndex.value == 1
|
||
|
|
? const Color.fromARGB(
|
||
|
|
255, 60, 95, 123)
|
||
|
|
: Colors.grey,
|
||
|
|
),
|
||
|
|
Align(
|
||
|
|
alignment: Alignment.center,
|
||
|
|
child: Text(
|
||
|
|
'桩点',
|
||
|
|
style: TextStyle(
|
||
|
|
fontSize: 12,
|
||
|
|
color: _currentIndex.value == 1
|
||
|
|
? const Color.fromARGB(
|
||
|
|
255, 60, 95, 123)
|
||
|
|
: Colors.grey,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
const Divider(),
|
||
|
|
Column(
|
||
|
|
children: [
|
||
|
|
IconButton(
|
||
|
|
onPressed: () {
|
||
|
|
setState(() {
|
||
|
|
_currentIndex.value = 2;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
icon: const Icon(Icons.my_location_sharp),
|
||
|
|
color: _currentIndex.value == 2
|
||
|
|
? const Color.fromARGB(
|
||
|
|
255, 60, 95, 123)
|
||
|
|
: Colors.grey,
|
||
|
|
),
|
||
|
|
Align(
|
||
|
|
alignment: Alignment.center,
|
||
|
|
child: Text(
|
||
|
|
'任务',
|
||
|
|
style: TextStyle(
|
||
|
|
fontSize: 12,
|
||
|
|
color: _currentIndex.value == 2
|
||
|
|
? const Color.fromARGB(
|
||
|
|
255, 60, 95, 123)
|
||
|
|
: Colors.grey,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
const Divider(),
|
||
|
|
Column(
|
||
|
|
children: [
|
||
|
|
IconButton(
|
||
|
|
onPressed: () {
|
||
|
|
setState(() {
|
||
|
|
_currentIndex.value = 3;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
icon: const Icon(
|
||
|
|
Icons.table_chart_outlined),
|
||
|
|
color: _currentIndex.value == 3
|
||
|
|
? const Color.fromARGB(
|
||
|
|
255, 60, 95, 123)
|
||
|
|
: Colors.grey,
|
||
|
|
),
|
||
|
|
Align(
|
||
|
|
alignment: Alignment.center,
|
||
|
|
child: Text(
|
||
|
|
'历史',
|
||
|
|
style: TextStyle(
|
||
|
|
fontSize: 12,
|
||
|
|
color: _currentIndex.value == 3
|
||
|
|
? const Color.fromARGB(
|
||
|
|
255, 60, 95, 123)
|
||
|
|
: Colors.grey,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
const Divider(),
|
||
|
|
Column(
|
||
|
|
children: [
|
||
|
|
IconButton(
|
||
|
|
onPressed: () {
|
||
|
|
setState(() {
|
||
|
|
_currentIndex.value = 4;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
icon: const Icon(Icons.settings),
|
||
|
|
color: _currentIndex.value == 4
|
||
|
|
? const Color.fromARGB(
|
||
|
|
255, 60, 95, 123)
|
||
|
|
: Colors.grey,
|
||
|
|
),
|
||
|
|
Align(
|
||
|
|
alignment: Alignment.center,
|
||
|
|
child: Text(
|
||
|
|
'设置',
|
||
|
|
style: TextStyle(
|
||
|
|
fontSize: 12,
|
||
|
|
color: _currentIndex.value == 4
|
||
|
|
? const Color.fromARGB(
|
||
|
|
255, 60, 95, 123)
|
||
|
|
: Colors.grey,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
)
|
||
|
|
]);
|
||
|
|
//
|
||
|
|
}),
|
||
|
|
),
|
||
|
|
)
|
||
|
|
]);
|
||
|
|
} //
|
||
|
|
|
||
|
|
else {
|
||
|
|
// 竖屏布局，保持原有底部导航栏样式
|
||
|
|
return Column(
|
||
|
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||
|
|
children: [
|
||
|
|
Expanded(
|
||
|
|
flex: 12,
|
||
|
|
child: _pages[_currentIndex.value],
|
||
|
|
),
|
||
|
|
// VerticalDivider(),
|
||
|
|
Expanded(
|
||
|
|
flex: 1,
|
||
|
|
child: SizedBox(
|
||
|
|
height: 48,
|
||
|
|
child: BottomNavigationBar(
|
||
|
|
type: BottomNavigationBarType.fixed,
|
||
|
|
currentIndex: _currentIndex.value,
|
||
|
|
onTap: (index) {
|
||
|
|
setState(() {
|
||
|
|
_currentIndex.value = index;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
items: const [
|
||
|
|
BottomNavigationBarItem(
|
||
|
|
icon: Icon(Icons.date_range_rounded),
|
||
|
|
label: "实时"),
|
||
|
|
BottomNavigationBarItem(
|
||
|
|
icon: Icon(Icons.map_outlined), label: "计划"),
|
||
|
|
BottomNavigationBarItem(
|
||
|
|
icon: Icon(Icons.my_location_sharp),
|
||
|
|
label: "对点"),
|
||
|
|
BottomNavigationBarItem(
|
||
|
|
icon: Icon(Icons.table_chart_outlined),
|
||
|
|
label: "历史"),
|
||
|
|
BottomNavigationBarItem(
|
||
|
|
icon: Icon(Icons.settings), label: "设置"),
|
||
|
|
]),
|
||
|
|
),
|
||
|
|
)
|
||
|
|
]);
|
||
|
|
}
|
||
|
|
},
|
||
|
|
));
|
||
|
|
}
|
||
|
|
}
|