💄 Optimize news design

This commit is contained in:
LittleSheep 2025-01-28 20:19:02 +08:00
parent 0dbb8f132a
commit 5c2804cc4d
4 changed files with 142 additions and 122 deletions

View File

@ -7,6 +7,7 @@ import 'package:go_router/go_router.dart';
import 'package:material_symbols_icons/symbols.dart'; import 'package:material_symbols_icons/symbols.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:styled_widget/styled_widget.dart'; import 'package:styled_widget/styled_widget.dart';
import 'package:surface/providers/config.dart';
import 'package:surface/providers/post.dart'; import 'package:surface/providers/post.dart';
import 'package:surface/providers/sn_network.dart'; import 'package:surface/providers/sn_network.dart';
import 'package:surface/screens/post/post_detail.dart'; import 'package:surface/screens/post/post_detail.dart';
@ -96,6 +97,8 @@ class _ExploreScreenState extends State<ExploreScreen> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final cfg = context.read<ConfigProvider>();
return AppScaffold( return AppScaffold(
floatingActionButtonLocation: ExpandableFab.location, floatingActionButtonLocation: ExpandableFab.location,
floatingActionButton: ExpandableFab( floatingActionButton: ExpandableFab(
@ -243,8 +246,10 @@ class _ExploreScreenState extends State<ExploreScreen> {
), ),
openColor: Colors.transparent, openColor: Colors.transparent,
openElevation: 0, openElevation: 0,
closedColor: Theme.of(context).colorScheme.surfaceContainerLow.withOpacity(0.75),
transitionType: ContainerTransitionType.fade, transitionType: ContainerTransitionType.fade,
closedColor: Theme.of(context).colorScheme.surfaceContainerLow.withOpacity(
cfg.prefs.getBool(kAppBackgroundStoreKey) == true ? 0.75 : 1,
),
closedShape: const RoundedRectangleBorder( closedShape: const RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(16)), borderRadius: BorderRadius.all(Radius.circular(16)),
), ),

View File

@ -51,7 +51,7 @@ class HomeScreen extends StatefulWidget {
} }
class _HomeScreenState extends State<HomeScreen> { class _HomeScreenState extends State<HomeScreen> {
static const List<HomeScreenDashEntry> kCards = [ late final List<HomeScreenDashEntry> kCards = [
HomeScreenDashEntry( HomeScreenDashEntry(
name: 'dashEntryRecommendation', name: 'dashEntryRecommendation',
child: _HomeDashRecommendationPostWidget(), child: _HomeDashRecommendationPostWidget(),
@ -69,7 +69,7 @@ class _HomeScreenState extends State<HomeScreen> {
HomeScreenDashEntry( HomeScreenDashEntry(
name: 'dashEntryTodayNews', name: 'dashEntryTodayNews',
child: _HomeDashTodayNews(), child: _HomeDashTodayNews(),
cols: 2, cols: MediaQuery.of(context).size.width >= 640 ? 3 : 2,
), ),
]; ];
@ -293,7 +293,7 @@ class _HomeDashTodayNewsState extends State<_HomeDashTodayNews> {
Text( Text(
_article!.title, _article!.title,
style: Theme.of(context).textTheme.titleMedium!.copyWith(fontSize: 18), style: Theme.of(context).textTheme.titleMedium!.copyWith(fontSize: 18),
maxLines: 2, maxLines: MediaQuery.of(context).size.width >= 640 ? 2 : 1,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
), ),
Text( Text(

View File

@ -175,6 +175,8 @@ class _NewsDetailScreenState extends State<NewsDetailScreen> {
), ),
if (_articleFragment != null && _isReadingFromReader) if (_articleFragment != null && _isReadingFromReader)
Expanded( Expanded(
child: Container(
constraints: BoxConstraints(maxWidth: 640),
child: SingleChildScrollView( child: SingleChildScrollView(
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
@ -223,6 +225,7 @@ class _NewsDetailScreenState extends State<NewsDetailScreen> {
], ],
).padding(horizontal: 12, vertical: 16), ).padding(horizontal: 12, vertical: 16),
), ),
).center(),
) )
else if (_article != null) else if (_article != null)
Expanded( Expanded(

View File

@ -70,11 +70,16 @@ class _NewsScreenState extends State<NewsScreen> {
sliver: SliverAppBar( sliver: SliverAppBar(
leading: AutoAppBarLeading(), leading: AutoAppBarLeading(),
title: Text('screenNews').tr(), title: Text('screenNews').tr(),
floating: true,
snap: true,
bottom: TabBar( bottom: TabBar(
isScrollable: true, isScrollable: true,
tabs: [ tabs: [
Tab(child: Text('newsAllSources'.tr())), Tab(child: Text('newsAllSources'.tr()).textColor(Theme.of(context).appBarTheme.foregroundColor)),
for (final source in _sources!) Tab(child: Text(source.label)), for (final source in _sources!)
Tab(
child: Text(source.label).textColor(Theme.of(context).appBarTheme.foregroundColor),
),
], ],
), ),
), ),
@ -146,6 +151,9 @@ class _NewsArticleListWidgetState extends State<_NewsArticleListWidget> {
return MediaQuery.removePadding( return MediaQuery.removePadding(
context: context, context: context,
removeTop: true, removeTop: true,
child: Center(
child: Container(
constraints: BoxConstraints(maxWidth: 640),
child: RefreshIndicator( child: RefreshIndicator(
onRefresh: _fetchArticles, onRefresh: _fetchArticles,
child: InfiniteList( child: InfiniteList(
@ -187,7 +195,9 @@ class _NewsArticleListWidgetState extends State<_NewsArticleListWidget> {
child: Container( child: Container(
color: Theme.of(context).colorScheme.surfaceContainer, color: Theme.of(context).colorScheme.surfaceContainer,
child: AutoResizeUniversalImage( child: AutoResizeUniversalImage(
article.thumbnail.startsWith('http') ? article.thumbnail : '$baseUrl/${article.thumbnail}', article.thumbnail.startsWith('http')
? article.thumbnail
: '$baseUrl/${article.thumbnail}',
), ),
), ),
), ),
@ -222,6 +232,8 @@ class _NewsArticleListWidgetState extends State<_NewsArticleListWidget> {
}, },
), ),
), ),
),
),
); );
} }
} }