Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Make NetworkLoggerButton draggable #9

Merged
merged 8 commits into from
Sep 8, 2022
Merged

Make NetworkLoggerButton draggable #9

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
39dc7fd
Add no overlay handling
FranMaric Sep 7, 2022
f0520c3
Make logger button draggable
FranMaric Sep 7, 2022
fe7755b
flutter pub get
FranMaric Sep 7, 2022
596f229
Use long press first to drag the button
FranMaric Sep 7, 2022
b0b7074
Update dio
FranMaric Sep 7, 2022
fb41fa8
Revert "Update dio"
FranMaric Sep 8, 2022
1907f77
Add draggable option
FranMaric Sep 8, 2022
c11e830
Add default parameter values
FranMaric Sep 8, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 6 additions & 6 deletions example/pubspec.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ packages:
name: characters
url: "https://pub.dartlang.org"
source: hosted
version: "1.2.0"
version: "1.2.1"
charcode:
dependency: transitive
description:
Expand All @@ -21,7 +21,7 @@ packages:
name: collection
url: "https://pub.dartlang.org"
source: hosted
version: "1.15.0"
version: "1.16.0"
dio:
dependency: "direct main"
description:
Expand All @@ -47,14 +47,14 @@ packages:
name: material_color_utilities
url: "https://pub.dartlang.org"
source: hosted
version: "0.1.3"
version: "0.1.5"
meta:
dependency: transitive
description:
name: meta
url: "https://pub.dartlang.org"
source: hosted
version: "1.7.0"
version: "1.8.0"
network_logger:
dependency: "direct main"
description:
Expand Down Expand Up @@ -108,7 +108,7 @@ packages:
name: vector_math
url: "https://pub.dartlang.org"
source: hosted
version: "2.1.1"
version: "2.1.2"
sdks:
dart: ">=2.14.0 <3.0.0"
dart: ">=2.17.0-0 <3.0.0"
flutter: ">=2.0.1"
132 changes: 105 additions & 27 deletions lib/src/ui.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,29 +10,119 @@ import 'network_event.dart';
import 'network_logger.dart';

/// Overlay for [NetworkLoggerButton].
class NetworkLoggerOverlay extends StatelessWidget {
NetworkLoggerOverlay._({Key? key}) : super(key: key);
class NetworkLoggerOverlay extends StatefulWidget {
NetworkLoggerOverlay._({
required this.right,
required this.bottom,
required this.draggable,
Key? key,
}) : super(key: key);

final double bottom;
final double right;

final bool draggable;

/// Attach overlay to specified [context].
static OverlayEntry attachTo(
BuildContext context, {
bool rootOverlay = true,

/// Initial distance from [NetworkLoggerButton] to bottom edge of screen
double bottom = 30,

/// Initial distance from [NetworkLoggerButton] to right edge of screen
double right = 30,
bool draggable = true,
}) {
// create overlay entry
var entry = OverlayEntry(
builder: (context) => NetworkLoggerOverlay._(),
final entry = OverlayEntry(
builder: (context) => NetworkLoggerOverlay._(
bottom: bottom,
right: right,
draggable: draggable,
),
);
// insert on next frame
Future.delayed(Duration.zero, () {
Overlay.of(context, rootOverlay: rootOverlay)?.insert(entry);
final overlay = Overlay.of(context, rootOverlay: rootOverlay);

if (overlay == null) {
throw Exception(
'FlutterNetworkLogger: No Overlay widget found. '
' The most common way to add an Overlay to an application is to include a MaterialApp or Navigator above widget that calls NetworkLoggerOverlay.attachTo()',
);
}

overlay.insert(entry);
});
// return
return entry;
}

@override
State<NetworkLoggerOverlay> createState() => _NetworkLoggerOverlayState();
}

class _NetworkLoggerOverlayState extends State<NetworkLoggerOverlay> {
late double bottom = widget.bottom;
late double right = widget.right;

late Size screenSize;
static const Size buttonSize = Size(57, 57);

@override
void didChangeDependencies() {
super.didChangeDependencies();
screenSize = MediaQuery.of(context).size;
}

Offset? lastPosition;

void onPanUpdate(LongPressMoveUpdateDetails details) {
final delta = lastPosition! - details.localPosition;

bottom += delta.dy;
right += delta.dx;

lastPosition = details.localPosition;

/// Checks if the button went of screen
if (bottom < 0) {
bottom = 0;
}

if (right < 0) {
right = 0;
}

if (bottom + buttonSize.height > screenSize.height) {
bottom = screenSize.height - buttonSize.height;
}

if (right + buttonSize.width > screenSize.width) {
right = screenSize.width - buttonSize.width;
}

setState(() {});
}

@override
Widget build(BuildContext context) {
return Positioned(right: 30, bottom: 100, child: NetworkLoggerButton());
return Positioned(
right: right,
bottom: bottom,
child: GestureDetector(
onLongPressMoveUpdate: widget.draggable ? onPanUpdate : null,
onLongPressDown: (details) => widget.draggable ? setState(() => lastPosition = details.localPosition) : null,
onLongPressUp: () => widget.draggable ? setState(() => lastPosition = null) : null,
child: Material(
elevation: lastPosition == null ? 0 : 30,
borderRadius: BorderRadius.all(Radius.circular(buttonSize.width)),
child: NetworkLoggerButton(),
),
),
);
}
}

Expand Down Expand Up @@ -151,17 +241,14 @@ class NetworkLoggerScreen extends StatelessWidget {
);
}

final TextEditingController searchController =
TextEditingController(text: null);
final TextEditingController searchController = TextEditingController(text: null);

/// filte events with search keyword
List<NetworkEvent> getEvents() {
if (searchController.text.isEmpty) return eventList.events;

final query = searchController.text.toLowerCase();
return eventList.events
.where((it) => it.request?.uri.toLowerCase().contains(query) ?? false)
.toList();
return eventList.events.where((it) => it.request?.uri.toLowerCase().contains(query) ?? false).toList();
themisir marked this conversation as resolved.
Show resolved Hide resolved
}

@override
Expand Down Expand Up @@ -197,9 +284,8 @@ class NetworkLoggerScreen extends StatelessWidget {
prefixIcon: const Icon(Icons.search, color: Colors.black26),
suffix: ValueListenableBuilder<TextEditingValue>(
valueListenable: searchController,
builder: (context, value, child) => value.text.isNotEmpty
? Text(getEvents().length.toString() + ' results')
: const SizedBox(),
builder: (context, value, child) =>
value.text.isNotEmpty ? Text(getEvents().length.toString() + ' results') : const SizedBox(),
),
hintText: "enter keyword to search",
),
Expand All @@ -221,16 +307,11 @@ class NetworkLoggerScreen extends StatelessWidget {
overflow: TextOverflow.ellipsis,
),
leading: Icon(
item.error == null
? (item.response == null
? Icons.hourglass_empty
: Icons.done)
: Icons.error,
item.error == null ? (item.response == null ? Icons.hourglass_empty : Icons.done) : Icons.error,
),
trailing: _AutoUpdate(
duration: Duration(seconds: 1),
builder: (context) =>
Text(_timeDifference(item.timestamp!)),
builder: (context) => Text(_timeDifference(item.timestamp!)),
),
onTap: () => NetworkLoggerEventScreen.open(
context,
Expand Down Expand Up @@ -265,8 +346,7 @@ final _jsonEncoder = JsonEncoder.withIndent(' ');

/// Screen that displays log entry details.
class NetworkLoggerEventScreen extends StatelessWidget {
const NetworkLoggerEventScreen({Key? key, required this.event})
: super(key: key);
const NetworkLoggerEventScreen({Key? key, required this.event}) : super(key: key);

static Route<void> route({
required NetworkEvent event,
Expand Down Expand Up @@ -491,8 +571,7 @@ class NetworkLoggerEventScreen extends StatelessWidget {

/// Widget builder that re-builds widget repeatedly with [duration] interval.
class _AutoUpdate extends StatefulWidget {
const _AutoUpdate({Key? key, required this.duration, required this.builder})
: super(key: key);
const _AutoUpdate({Key? key, required this.duration, required this.builder}) : super(key: key);

/// Re-build interval.
final Duration duration;
Expand Down Expand Up @@ -541,8 +620,7 @@ class _AutoUpdateState extends State<_AutoUpdate> {
}

class _DebugOnly extends StatelessWidget {
const _DebugOnly({Key? key, required this.enabled, required this.child})
: super(key: key);
const _DebugOnly({Key? key, required this.enabled, required this.child}) : super(key: key);

final bool enabled;
final Widget child;
Expand Down
30 changes: 15 additions & 15 deletions pubspec.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ packages:
name: async
url: "https://pub.dartlang.org"
source: hosted
version: "2.8.2"
version: "2.9.0"
boolean_selector:
dependency: transitive
description:
Expand All @@ -21,7 +21,7 @@ packages:
name: characters
url: "https://pub.dartlang.org"
source: hosted
version: "1.2.0"
version: "1.2.1"
charcode:
dependency: transitive
description:
Expand All @@ -35,14 +35,14 @@ packages:
name: clock
url: "https://pub.dartlang.org"
source: hosted
version: "1.1.0"
version: "1.1.1"
collection:
dependency: transitive
description:
name: collection
url: "https://pub.dartlang.org"
source: hosted
version: "1.15.0"
version: "1.16.0"
dio:
dependency: "direct main"
description:
Expand All @@ -56,7 +56,7 @@ packages:
name: fake_async
url: "https://pub.dartlang.org"
source: hosted
version: "1.2.0"
version: "1.3.1"
flutter:
dependency: "direct main"
description: flutter
Expand All @@ -80,28 +80,28 @@ packages:
name: matcher
url: "https://pub.dartlang.org"
source: hosted
version: "0.12.11"
version: "0.12.12"
material_color_utilities:
dependency: transitive
description:
name: material_color_utilities
url: "https://pub.dartlang.org"
source: hosted
version: "0.1.3"
version: "0.1.5"
meta:
dependency: transitive
description:
name: meta
url: "https://pub.dartlang.org"
source: hosted
version: "1.7.0"
version: "1.8.0"
path:
dependency: transitive
description:
name: path
url: "https://pub.dartlang.org"
source: hosted
version: "1.8.0"
version: "1.8.2"
sky_engine:
dependency: transitive
description: flutter
Expand All @@ -113,7 +113,7 @@ packages:
name: source_span
url: "https://pub.dartlang.org"
source: hosted
version: "1.8.1"
version: "1.9.0"
stack_trace:
dependency: transitive
description:
Expand All @@ -134,21 +134,21 @@ packages:
name: string_scanner
url: "https://pub.dartlang.org"
source: hosted
version: "1.1.0"
version: "1.1.1"
term_glyph:
dependency: transitive
description:
name: term_glyph
url: "https://pub.dartlang.org"
source: hosted
version: "1.2.0"
version: "1.2.1"
test_api:
dependency: transitive
description:
name: test_api
url: "https://pub.dartlang.org"
source: hosted
version: "0.4.8"
version: "0.4.12"
typed_data:
dependency: transitive
description:
Expand All @@ -162,7 +162,7 @@ packages:
name: vector_math
url: "https://pub.dartlang.org"
source: hosted
version: "2.1.1"
version: "2.1.2"
sdks:
dart: ">=2.14.0 <3.0.0"
dart: ">=2.17.0-0 <3.0.0"
flutter: ">=2.0.1"