Files
flutter_common/example/lib/main.dart

208 lines
6.2 KiB
Dart

import 'package:flutter/material.dart';
import 'package:flutter_common/flutter_common.dart';
import 'package:get/get.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return GetMaterialApp(
title: 'flutter_common Demo',
debugShowCheckedModeBanner: false,
theme: ThemeData(
scaffoldBackgroundColor: const Color(0xFFF5F7FB),
colorScheme: ColorScheme.fromSeed(seedColor: const Color(0xFF4D6FD5)),
cardTheme: const CardThemeData(
color: Colors.white,
margin: EdgeInsets.zero,
elevation: 0,
),
),
home: const MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key});
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String _singleDateText = '未选择';
String _rangeDateText = '未选择';
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('flutter_common 示例首页'),
centerTitle: true,
),
body: SafeArea(
child: ListView(
padding: const EdgeInsets.all(16),
children: [
_buildIntroCard(),
const SizedBox(height: 16),
_buildDemoCard(
title: '单日选择组件',
description: '使用 `CalendarChooseWidget` 的单选模式,适合筛选某一天的数据。',
child: CalendarChooseWidget(
chooseIndex: 1,
selectedDate: DateTime.now(),
dateTimeUtilsType: DateTimeUtilsType.yearMonthDayWord,
fontSize: 18,
fontWeight: FontWeight.w600,
tapAction: (value) {
final startTime = value['startTime'] as DateTime?;
setState(() {
_singleDateText = _formatDateWithWeekday(startTime);
});
},
),
resultText: _singleDateText,
),
const SizedBox(height: 16),
_buildDemoCard(
title: '区间选择组件',
description: '默认展示开始和结束日期,适合做报表、订单或运营时间筛选。',
child: CalendarChooseWidget(
selectedDate: DateTime.now(),
dateTimeUtilsType: DateTimeUtilsType.yearMonthDay,
fontSize: 18,
fontWeight: FontWeight.w600,
tapAction: (value) {
final startTime = value['startTime'] as DateTime?;
final endTime = value['endTime'] as DateTime?;
setState(() {
_rangeDateText =
'${_formatDate(startTime)}${_formatDate(endTime)}';
});
},
),
resultText: _rangeDateText,
),
],
),
),
);
}
Widget _buildIntroCard() {
return Card(
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
child: Padding(
padding: const EdgeInsets.all(20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: const [
Text(
'项目结构速览',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.w700,
color: Color(0xFF1A1A1A),
),
),
SizedBox(height: 12),
Text(
'lib/calendarcalendar 里提供了日期选择相关组件,'
'lib/upload_image 聚合图片上传与预览能力,'
'lib/utils 则放了日期、弹窗等通用工具。',
style: TextStyle(
fontSize: 15,
height: 1.6,
color: Color(0xFF4F5B67),
),
),
],
),
),
);
}
Widget _buildDemoCard({
required String title,
required String description,
required Widget child,
required String resultText,
}) {
return Card(
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
child: Padding(
padding: const EdgeInsets.all(20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
style: const TextStyle(
fontSize: 18,
fontWeight: FontWeight.w700,
color: Color(0xFF1A1A1A),
),
),
const SizedBox(height: 8),
Text(
description,
style: const TextStyle(
fontSize: 14,
height: 1.6,
color: Color(0xFF5C6670),
),
),
const SizedBox(height: 16),
Container(
width: double.infinity,
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 18),
decoration: BoxDecoration(
color: const Color(0xFFF7F9FC),
borderRadius: BorderRadius.circular(16),
border: Border.all(color: const Color(0xFFD9E1F2)),
),
child: child,
),
const SizedBox(height: 14),
Text(
'当前结果:$resultText',
style: const TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
color: Color(0xFF4D6FD5),
),
),
],
),
),
);
}
String _formatDate(DateTime? date) {
if (date == null) {
return '未选择';
}
return DateTimeUtils.dateTimeUtilsTool(
dateTime: date.toIso8601String(),
dateTimeUtilsType: DateTimeUtilsType.yearMonthDay,
);
}
String _formatDateWithWeekday(DateTime? date) {
if (date == null) {
return '未选择';
}
return '${DateTimeUtils.dateTimeUtilsTool(
dateTime: date.toIso8601String(),
dateTimeUtilsType: DateTimeUtilsType.yearMonthDayWord,
)} ${DateTimeUtils.getWeekDay(date)}';
}
}