From 51b1b542ef15f0040ffb81ea7c3f062651fca36d Mon Sep 17 00:00:00 2001 From: lowrt Date: Wed, 24 Dec 2025 15:18:12 +0800 Subject: [PATCH] fix: width --- lib/app/home/_widgets/date_timeline_item.dart | 131 ++++++++--------- .../home/_widgets/history_timeline_item.dart | 137 +++++++++--------- lib/app/home/page.dart | 53 +++---- 3 files changed, 159 insertions(+), 162 deletions(-) diff --git a/lib/app/home/_widgets/date_timeline_item.dart b/lib/app/home/_widgets/date_timeline_item.dart index 5df5ad1ef..c5a50baae 100644 --- a/lib/app/home/_widgets/date_timeline_item.dart +++ b/lib/app/home/_widgets/date_timeline_item.dart @@ -1,6 +1,5 @@ import 'package:dpip/app/home/_widgets/mode_toggle_button.dart'; import 'package:dpip/utils/extensions/build_context.dart'; -import 'package:dpip/widgets/responsive/responsive_container.dart'; import 'package:flutter/material.dart'; class DateTimelineItem extends StatelessWidget { @@ -72,84 +71,82 @@ class DateTimelineItem extends StatelessWidget { @override Widget build(BuildContext context) { - return ResponsiveContainer( - child: IntrinsicHeight( - child: Row( - crossAxisAlignment: CrossAxisAlignment.stretch, - children: [ - Padding( - padding: const EdgeInsets.symmetric(horizontal: 16), - child: Stack( - alignment: Alignment.centerLeft, - children: [ - Positioned( - left: 0, - top: first ? 21 : 0, - bottom: last ? null : 0, - height: last ? 21 : null, - child: Stack( - alignment: Alignment.center, - children: [ - Positioned(top: 0, bottom: 0, width: 1, child: Container(color: context.colors.outlineVariant)), - SizedBox( - width: 42, - child: Container( - height: 8, - width: 8, - decoration: BoxDecoration(shape: BoxShape.circle, color: context.colors.outlineVariant), - ), + return IntrinsicHeight( + child: Row( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + Padding( + padding: const EdgeInsets.symmetric(horizontal: 16), + child: Stack( + alignment: Alignment.centerLeft, + children: [ + Positioned( + left: 0, + top: first ? 21 : 0, + bottom: last ? null : 0, + height: last ? 21 : null, + child: Stack( + alignment: Alignment.center, + children: [ + Positioned(top: 0, bottom: 0, width: 1, child: Container(color: context.colors.outlineVariant)), + SizedBox( + width: 42, + child: Container( + height: 8, + width: 8, + decoration: BoxDecoration(shape: BoxShape.circle, color: context.colors.outlineVariant), ), - ], - ), + ), + ], ), - Padding( - padding: const EdgeInsets.only(top: 16, bottom: 8), - child: InkWell( - onTap: mode != null && onModeChanged != null ? () => _showModeMenu(context) : null, - borderRadius: BorderRadius.circular(8), - child: Container( - padding: const EdgeInsets.all(8), - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(8), - color: context.colors.secondaryContainer, - ), - child: Row( - mainAxisSize: MainAxisSize.min, - spacing: 6, - children: [ - if (mode != null) ...[ - Icon(mode!.icon, size: 16, color: context.colors.onSecondaryContainer), - Text( - mode!.label, - style: context.theme.textTheme.labelMedium?.copyWith( - height: 1, - color: context.colors.onSecondaryContainer, - fontWeight: FontWeight.bold, - ), - ), - Container( - width: 1, - height: 12, - color: context.colors.onSecondaryContainer.withValues(alpha: 0.3), - ), - ], + ), + Padding( + padding: const EdgeInsets.only(top: 16, bottom: 8), + child: InkWell( + onTap: mode != null && onModeChanged != null ? () => _showModeMenu(context) : null, + borderRadius: BorderRadius.circular(8), + child: Container( + padding: const EdgeInsets.all(8), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(8), + color: context.colors.secondaryContainer, + ), + child: Row( + mainAxisSize: MainAxisSize.min, + spacing: 6, + children: [ + if (mode != null) ...[ + Icon(mode!.icon, size: 16, color: context.colors.onSecondaryContainer), Text( - date, - style: context.theme.textTheme.labelLarge?.copyWith( + mode!.label, + style: context.theme.textTheme.labelMedium?.copyWith( height: 1, color: context.colors.onSecondaryContainer, + fontWeight: FontWeight.bold, ), ), + Container( + width: 1, + height: 12, + color: context.colors.onSecondaryContainer.withValues(alpha: 0.3), + ), ], - ), + Text( + date, + style: context.theme.textTheme.labelLarge?.copyWith( + height: 1, + color: context.colors.onSecondaryContainer, + ), + ), + ], ), ), ), - ], - ), + ), + ], ), - ], - ), + ), + ], ), ); } diff --git a/lib/app/home/_widgets/history_timeline_item.dart b/lib/app/home/_widgets/history_timeline_item.dart index 4973f30fe..0c7e7f0e4 100644 --- a/lib/app/home/_widgets/history_timeline_item.dart +++ b/lib/app/home/_widgets/history_timeline_item.dart @@ -2,7 +2,6 @@ import 'package:dpip/api/model/history/history.dart'; import 'package:dpip/utils/extensions/build_context.dart'; import 'package:dpip/utils/list_icon.dart'; import 'package:dpip/widgets/home/event_list_route.dart'; -import 'package:dpip/widgets/responsive/responsive_container.dart'; import 'package:flutter/material.dart'; import 'package:intl/intl.dart'; import 'package:material_symbols_icons/symbols.dart'; @@ -25,83 +24,81 @@ class HistoryTimelineItem extends StatelessWidget { Widget build(BuildContext context) { final hasDetail = shouldShowArrow(history); - return ResponsiveContainer( - child: InkWell( - onTap: hasDetail ? () => handleEventList(context, history) : null, - child: IntrinsicHeight( - child: Row( - crossAxisAlignment: CrossAxisAlignment.stretch, - children: [ - Padding( - padding: const EdgeInsets.symmetric(horizontal: 16), - child: Stack( - alignment: Alignment.topCenter, - children: [ - Positioned( - top: first ? 42 : 0, - bottom: last ? 0 : 0, - width: 1, - child: Container(color: context.colors.outlineVariant), - ), - Padding( - padding: const EdgeInsets.symmetric(vertical: 20), - child: Container( - height: 42, - width: 42, - decoration: BoxDecoration( - shape: BoxShape.circle, - color: expired ? context.colors.surface : context.colors.primaryContainer, - border: expired ? Border.all(color: context.colors.outlineVariant) : null, - ), - child: Icon( - getListIcon(history.icon), - color: expired ? context.colors.outline : context.colors.onPrimaryContainer, - ), + return InkWell( + onTap: hasDetail ? () => handleEventList(context, history) : null, + child: IntrinsicHeight( + child: Row( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + Padding( + padding: const EdgeInsets.symmetric(horizontal: 16), + child: Stack( + alignment: Alignment.topCenter, + children: [ + Positioned( + top: first ? 42 : 0, + bottom: last ? 0 : 0, + width: 1, + child: Container(color: context.colors.outlineVariant), + ), + Padding( + padding: const EdgeInsets.symmetric(vertical: 20), + child: Container( + height: 42, + width: 42, + decoration: BoxDecoration( + shape: BoxShape.circle, + color: expired ? context.colors.surface : context.colors.primaryContainer, + border: expired ? Border.all(color: context.colors.outlineVariant) : null, + ), + child: Icon( + getListIcon(history.icon), + color: expired ? context.colors.outline : context.colors.onPrimaryContainer, ), ), - ], - ), + ), + ], ), - Expanded( - child: Padding( - padding: const EdgeInsets.symmetric(vertical: 12), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text( - DateFormat('HH:mm:ss').format(history.time.send), - style: context.theme.textTheme.labelMedium?.copyWith( - color: context.colors.outline.withValues(alpha: expired ? 0.6 : 1), - ), + ), + Expanded( + child: Padding( + padding: const EdgeInsets.symmetric(vertical: 12), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + DateFormat('HH:mm:ss').format(history.time.send), + style: context.theme.textTheme.labelMedium?.copyWith( + color: context.colors.outline.withValues(alpha: expired ? 0.6 : 1), ), - Text( - history.text.content['all']!.subtitle, - style: context.theme.textTheme.titleMedium?.copyWith( - color: context.colors.onSurface.withValues(alpha: expired ? 0.6 : 1), - ), - maxLines: 1, - overflow: TextOverflow.ellipsis, + ), + Text( + history.text.content['all']!.subtitle, + style: context.theme.textTheme.titleMedium?.copyWith( + color: context.colors.onSurface.withValues(alpha: expired ? 0.6 : 1), ), - Text( - history.text.description['all']!, - style: context.theme.textTheme.bodyMedium?.copyWith( - color: context.colors.onSurface.withValues(alpha: expired ? 0.6 : 1), - ), - textAlign: TextAlign.justify, - maxLines: 3, - overflow: TextOverflow.ellipsis, + maxLines: 1, + overflow: TextOverflow.ellipsis, + ), + Text( + history.text.description['all']!, + style: context.theme.textTheme.bodyMedium?.copyWith( + color: context.colors.onSurface.withValues(alpha: expired ? 0.6 : 1), ), - ], - ), + textAlign: TextAlign.justify, + maxLines: 3, + overflow: TextOverflow.ellipsis, + ), + ], ), ), - if (hasDetail) - Padding( - padding: const EdgeInsets.only(left: 4), - child: Icon(Symbols.chevron_right_rounded, color: context.colors.outline), - ), - ], - ), + ), + if (hasDetail) + Padding( + padding: const EdgeInsets.only(left: 4), + child: Icon(Symbols.chevron_right_rounded, color: context.colors.outline), + ), + ], ), ), ); diff --git a/lib/app/home/page.dart b/lib/app/home/page.dart index f652833c1..073bd6808 100644 --- a/lib/app/home/page.dart +++ b/lib/app/home/page.dart @@ -32,6 +32,7 @@ import 'package:dpip/models/settings/ui.dart'; import 'package:dpip/utils/extensions/build_context.dart'; import 'package:dpip/utils/extensions/datetime.dart'; import 'package:dpip/utils/log.dart'; +import 'package:dpip/widgets/responsive/responsive_container.dart'; import 'package:maplibre_gl/maplibre_gl.dart'; import 'home_display_mode.dart'; @@ -383,34 +384,36 @@ class _HomePageState extends State with WidgetsBindingObserver { } Widget _buildHistoryTimeline() { - return Builder( - builder: (context) { - final history = _history; + return ResponsiveContainer( + child: Builder( + builder: (context) { + final history = _history; + + if (history == null || history.isEmpty) { + return Column( + children: [ + DateTimelineItem( + TZDateTime.now(UTC).toLocaleFullDateString(context), + first: true, + last: true, + mode: _currentMode, + onModeChanged: _onModeChanged, + isOutOfService: _isOutOfService, + ), + ], + ); + } + + final grouped = groupBy(history, (e) => e.time.send.toLocaleFullDateString(context)); - if (history == null || history.isEmpty) { return Column( - children: [ - DateTimelineItem( - TZDateTime.now(UTC).toLocaleFullDateString(context), - first: true, - last: true, - mode: _currentMode, - onModeChanged: _onModeChanged, - isOutOfService: _isOutOfService, - ), - ], + children: grouped.entries + .sorted((a, b) => b.key.compareTo(a.key)) + .mapIndexed((index, entry) => _buildHistoryGroup(entry, index, history)) + .toList(), ); - } - - final grouped = groupBy(history, (e) => e.time.send.toLocaleFullDateString(context)); - - return Column( - children: grouped.entries - .sorted((a, b) => b.key.compareTo(a.key)) - .mapIndexed((index, entry) => _buildHistoryGroup(entry, index, history)) - .toList(), - ); - }, + }, + ), ); }