Flutter开发：将指定时区选择的日期转换为本地时间

1. 添加依赖 #

在pubspec.yaml中加入以下依赖：

dependencies:
  flutter:
    sdk: flutter
  timezone: ^0.9.2
  flutter_native_timezone: ^2.0.0

执行flutter pub get完成依赖安装。

2. 初始化时区数据 #

在应用启动时初始化时区数据库，并获取设备本地时区：

import 'package:flutter/material.dart';
import 'package:timezone/timezone.dart' as tz;
import 'package:timezone/data/latest.dart' as tz;
import 'package:flutter_native_timezone/flutter_native_timezone.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  // 加载时区数据库
  tz.initializeTimeZones();
  // 获取本地时区ID
  final String localTimeZoneId = await FlutterNativeTimezone.getLocalTimezone();
  // 设置应用本地时区
  tz.setLocalLocation(tz.getLocation(localTimeZoneId));
  runApp(const MyApp());
}

3. 完整功能实现 #

以下是包含时区选择、日期选择和转换逻辑的完整页面代码：

class TimezoneDateConverter extends StatefulWidget {
  const TimezoneDateConverter({super.key});

  @override
  State<TimezoneDateConverter> createState() => _TimezoneDateConverterState();
}

class _TimezoneDateConverterState extends State<TimezoneDateConverter> {
  tz.Location? _selectedTimeZone;
  DateTime? _selectedTargetDate;
  DateTime? _convertedLocalDate;

  @override
  void initState() {
    super.initState();
    // 默认选中本地时区
    _selectedTimeZone = tz.local;
  }

  // 执行日期转换
  void _convertDate() {
    if (_selectedTargetDate == null || _selectedTimeZone == null) return;

    // 将用户选择的日期转为目标时区的当天0点时间
    final tz.TZDateTime targetZoneDateTime = tz.TZDateTime(
      _selectedTimeZone!,
      _selectedTargetDate!.year,
      _selectedTargetDate!.month,
      _selectedTargetDate!.day,
    );

    // 转换为本地时区时间并提取日期部分
    final DateTime localDateTime = targetZoneDateTime.toLocal();
    setState(() {
      _convertedLocalDate = DateTime(localDateTime.year, localDateTime.month, localDateTime.day);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('时区日期转换')),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // 时区选择下拉框
            DropdownButtonFormField<tz.Location>(
              value: _selectedTimeZone,
              decoration: const InputDecoration(labelText: '选择目标时区'),
              items: tz.timeZoneDatabase.locations.values.map((location) {
                return DropdownMenuItem(
                  value: location,
                  child: Text(location.name),
                );
              }).toList(),
              onChanged: (value) => setState(() => _selectedTimeZone = value),
            ),
            const SizedBox(height: 16),
            // 日期选择按钮
            ElevatedButton(
              onPressed: () async {
                final pickedDate = await showDatePicker(
                  context: context,
                  initialDate: DateTime.now(),
                  firstDate: DateTime(2000),
                  lastDate: DateTime(2100),
                );
                if (pickedDate != null) {
                  setState(() => _selectedTargetDate = pickedDate);
                  _convertDate();
                }
              },
              child: const Text('选择目标时区日期'),
            ),
            const SizedBox(height: 16),
            // 显示转换结果
            if (_convertedLocalDate != null)
              Text(
                '本地时区等效日期：${_convertedLocalDate!.toString().split(' ')[0]}',
                style: const TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
              ),
          ],
        ),
      ),
    );
  }
}

核心逻辑说明 #

1. 用户选择的日期是目标时区的本地日期，我们将其包装为目标时区当天0点的TZDateTime对象，确保时间基准统一
2. 通过toLocal()方法将目标时区时间转换为设备本地时区的时间
3. 最终提取本地时区的日期部分，得到等效日期

内容的提问来源于stack exchange，提问作者Mahmoud Adel Fawzy Abdel salam