Added split view

This commit is contained in:
Juan Gilsanz Polo 2024-09-08 19:03:57 +02:00
parent 7d1845f806
commit d6b16b230c
6 changed files with 144 additions and 63 deletions

View file

@ -237,7 +237,8 @@ class _LogsListClientState extends State<LogsListClient> {
context: context,
builder: (context) => LogDetailsScreen(
log: log,
dialog: true
dialog: true,
twoColumns: widget.splitView,
)
)
}
@ -246,7 +247,8 @@ class _LogsListClientState extends State<LogsListClient> {
MaterialPageRoute(
builder: (context) => LogDetailsScreen(
log: log,
dialog: false
dialog: false,
twoColumns: widget.splitView,
)
)
)

View file

@ -1,6 +1,5 @@
// ignore_for_file: use_build_context_synchronously
import 'package:adguard_home_manager/functions/copy_clipboard.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
@ -11,6 +10,7 @@ import 'package:adguard_home_manager/screens/logs/details/log_list_tile.dart';
import 'package:adguard_home_manager/functions/desktop_mode.dart';
import 'package:adguard_home_manager/functions/open_url.dart';
import 'package:adguard_home_manager/functions/copy_clipboard.dart';
import 'package:adguard_home_manager/constants/urls.dart';
import 'package:adguard_home_manager/classes/process_modal.dart';
import 'package:adguard_home_manager/functions/get_filtered_status.dart';
@ -24,11 +24,13 @@ import 'package:adguard_home_manager/providers/app_config_provider.dart';
class LogDetailsScreen extends StatelessWidget {
final Log log;
final bool dialog;
final bool twoColumns;
const LogDetailsScreen({
super.key,
required this.log,
required this.dialog
required this.dialog,
required this.twoColumns,
});
@override
@ -137,6 +139,7 @@ class LogDetailsScreen extends StatelessWidget {
);
}
else {
print(twoColumns);
return Scaffold(
body: NestedScrollView(
headerSliverBuilder: (context, innerBoxIsScrolled) => [
@ -148,6 +151,7 @@ class LogDetailsScreen extends StatelessWidget {
centerTitle: false,
forceElevated: innerBoxIsScrolled,
surfaceTintColor: isDesktop(width) ? Colors.transparent : null,
automaticallyImplyLeading: twoColumns != true,
title: Text(AppLocalizations.of(context)!.logDetails),
actions: [
IconButton(

View file

@ -0,0 +1,90 @@
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:adguard_home_manager/screens/logs/log_tile.dart';
import 'package:adguard_home_manager/screens/logs/details/log_details_screen.dart';
import 'package:adguard_home_manager/models/logs.dart';
import 'package:adguard_home_manager/providers/live_logs_provider.dart';
class LiveLogsList extends StatelessWidget {
final Log? selectedLog;
final void Function(Log) onLogSelected;
final bool twoColumns;
const LiveLogsList({
super.key,
required this.selectedLog,
required this.onLogSelected,
required this.twoColumns,
});
@override
Widget build(BuildContext context) {
final liveLogsProvider = Provider.of<LiveLogsProvider>(context);
return NestedScrollView(
headerSliverBuilder: (context, innerBoxIsScrolled) => [
SliverOverlapAbsorber(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
sliver: SliverAppBar.large(
title: Text(AppLocalizations.of(context)!.liveLogs),
)
)
],
body: SafeArea(
top: false,
bottom: false,
child: Builder(
builder: (context) => CustomScrollView(
slivers: [
SliverOverlapInjector(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
),
if (liveLogsProvider.logs.isEmpty) SliverFillRemaining(
child: Center(
child: Padding(
padding: const EdgeInsets.all(16),
child: Text(
AppLocalizations.of(context)!.hereWillAppearRealtimeLogs,
textAlign: TextAlign.center,
style: TextStyle(
color: Theme.of(context).colorScheme.onSurfaceVariant,
fontSize: 24
),
),
),
),
),
if (liveLogsProvider.logs.isNotEmpty) SliverList.builder(
itemCount: liveLogsProvider.logs.length,
itemBuilder: (context, index) => LogTile(
log: liveLogsProvider.logs[index],
length: liveLogsProvider.logs.length,
index: index,
onLogTap: (log) {
if (!twoColumns) {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => LogDetailsScreen(
log: log,
dialog: false,
twoColumns: twoColumns,
)
)
);
}
onLogSelected(log);
},
isLogSelected: selectedLog == liveLogsProvider.logs[index],
twoColumns: twoColumns
),
)
],
),
)
)
);
}
}

View file

@ -3,8 +3,10 @@ import 'package:provider/provider.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:adguard_home_manager/screens/logs/details/log_details_screen.dart';
import 'package:adguard_home_manager/screens/logs/live/live_logs_list.dart';
import 'package:adguard_home_manager/screens/logs/log_tile.dart';
import 'package:adguard_home_manager/models/logs.dart';
import 'package:adguard_home_manager/providers/live_logs_provider.dart';
class LiveLogsScreen extends StatefulWidget {
@ -15,6 +17,8 @@ class LiveLogsScreen extends StatefulWidget {
}
class _LiveLogsScreenState extends State<LiveLogsScreen> {
Log? _selectedLog;
@override
void initState() {
Provider.of<LiveLogsProvider>(context, listen: false).startFetchLogs();
@ -24,65 +28,44 @@ class _LiveLogsScreenState extends State<LiveLogsScreen> {
@override
Widget build(BuildContext context) {
final liveLogsProvider = Provider.of<LiveLogsProvider>(context);
return Scaffold(
body: NestedScrollView(
headerSliverBuilder: (context, innerBoxIsScrolled) => [
SliverOverlapAbsorber(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
sliver: SliverAppBar.large(
title: Text(AppLocalizations.of(context)!.liveLogs),
body: LayoutBuilder(
builder: (context, constraints) {
if (constraints.maxWidth > 800) {
return Material(
color: Colors.transparent,
child: Row(
children: [
Expanded(
flex: 2,
child: LiveLogsList(
twoColumns: true,
selectedLog: _selectedLog,
onLogSelected: (log) => setState(() => _selectedLog = log),
)
)
],
body: SafeArea(
top: false,
bottom: false,
child: Builder(
builder: (context) => CustomScrollView(
slivers: [
SliverOverlapInjector(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
),
if (liveLogsProvider.logs.isEmpty) SliverFillRemaining(
child: Center(
child: Padding(
padding: const EdgeInsets.all(16),
child: Text(
AppLocalizations.of(context)!.hereWillAppearRealtimeLogs,
textAlign: TextAlign.center,
style: TextStyle(
color: Theme.of(context).colorScheme.onSurfaceVariant,
fontSize: 24
),
),
),
),
),
if (liveLogsProvider.logs.isNotEmpty) SliverList.builder(
itemCount: liveLogsProvider.logs.length,
itemBuilder: (context, index) => LogTile(
log: liveLogsProvider.logs[index],
length: liveLogsProvider.logs.length,
index: index,
onLogTap: (log) {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => LogDetailsScreen(
log: log,
Expanded(
flex: 3,
child: _selectedLog != null
? LogDetailsScreen(
log: _selectedLog!,
dialog: false,
twoColumns: true,
)
)
);
},
twoColumns: false
),
: const SizedBox()
)
],
),
)
)
);
}
else {
return LiveLogsList(
twoColumns: false,
selectedLog: _selectedLog,
onLogSelected: (log) => setState(() => _selectedLog = log),
);
}
},
),
);
}

View file

@ -48,6 +48,7 @@ class _LogsState extends State<Logs> {
? LogDetailsScreen(
log: _selectedLog!,
dialog: false,
twoColumns: true,
)
: const SizedBox()
)

View file

@ -188,6 +188,7 @@ class _LogsListWidgetState extends State<LogsListWidget> {
builder: (context) => LogDetailsScreen(
log: log,
dialog: false,
twoColumns: widget.twoColumns,
)
)
);