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

Evaluation HoverCard #2746

Merged
merged 9 commits into from
Mar 3, 2021
Merged

Evaluation HoverCard #2746

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
cc2701c
Evaluation HoverCard
grouma Feb 26, 2021
d44d75e
Merge branch 'master' into hover-card
grouma Feb 26, 2021
52954a2
copyright
grouma Feb 26, 2021
fc7a922
lint
grouma Feb 26, 2021
222a784
center hover
grouma Feb 26, 2021
d92ab25
remove newline
grouma Feb 26, 2021
5fb818c
review comments
grouma Mar 2, 2021
a6322cb
fix linked logic
grouma Mar 2, 2021
045db58
trailing
grouma Mar 3, 2021
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
Prev Previous commit
Next Next commit
review comments
  • Loading branch information
@grouma
grouma committed Mar 2, 2021
commit 5fb818c3aa28b86366b3a86c2ce665fd39259c15
72 changes: 34 additions & 38 deletions packages/devtools_app/lib/src/debugger/codeview.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import 'dart:math' as math;

import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:vm_service/vm_service.dart' hide Stack;

import '../auto_dispose_mixin.dart';
Expand Down Expand Up @@ -43,14 +44,10 @@ class CodeView extends StatefulWidget {
final void Function(ScriptRef scriptRef, int line) onSelected;

@override
_CodeViewState createState() => _CodeViewState(controller);
_CodeViewState createState() => _CodeViewState();
}

class _CodeViewState extends State<CodeView> with AutoDisposeMixin {
_CodeViewState(this.debuggerController);

final DebuggerController debuggerController;

Script script;
int lineCount = 0;
Set<int> executableLines = {};
Expand Down Expand Up @@ -309,7 +306,8 @@ class _CodeViewState extends State<CodeView> with AutoDisposeMixin {
child: Lines(
scrollController: textController,
lines: lines,
debuggerController: debuggerController,
debuggerController:
Provider.of<DebuggerController>(context),
pausedFrame: pausedFrame,
),
),
Expand Down Expand Up @@ -549,7 +547,6 @@ class Lines extends StatelessWidget {
final lineNum = index + 1;
return LineItem(
lineContents: lines[index],
debuggerController: debuggerController,
pausedFrame: pausedLine == lineNum ? pausedFrame : null,
);
},
Expand All @@ -561,14 +558,13 @@ class LineItem extends StatefulWidget {
const LineItem({
Key key,
@required this.lineContents,
@required this.debuggerController,
this.pausedFrame,
}) : super(key: key);

static const _hoverDelay = Duration(milliseconds: 500);
static const _hoverWidth = 250.0;

final TextSpan lineContents;
final DebuggerController debuggerController;
final StackFrameAndSourcePosition pausedFrame;

@override
Expand All @@ -595,27 +591,30 @@ class _LineItemState extends State<LineItem> {
void _onHover(PointerHoverEvent event, BuildContext context) {
_showTimer?.cancel();
_removeTimer?.cancel();
if (!widget.debuggerController.isPaused.value) return;
final debuggerController = Provider.of<DebuggerController>(context);
if (!debuggerController.isPaused.value) return;
_showTimer = Timer(LineItem._hoverDelay, () async {
final theme = Theme.of(context);
_hoverCard?.remove();
final word = wordForHover(
event.localPosition.dx, widget.lineContents, theme.fixedFontStyle);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: trailing comma

if (word != '') {
try {
final response =
await widget.debuggerController.evalAtCurrentFrame(word);
final response = await debuggerController.evalAtCurrentFrame(word);
final variable = Variable.fromRef(response);
await widget.debuggerController.buildVariablesTree(variable);
await debuggerController.buildVariablesTree(variable);
_hoverCard = HoverCard(
contents: Material(
child: ExpandableVariable(
debuggerController: widget.debuggerController,
variable: ValueNotifier(variable))),
event: event,
width: 250,
title: word,
context: context);
contents: Material(
child: ExpandableVariable(
debuggerController: debuggerController,
variable: ValueNotifier(variable),
),
),
event: event,
width: LineItem._hoverWidth,
title: word,
context: context,
);
} catch (_) {
// Silently fail and don't display a HoverCard.
}
Expand Down Expand Up @@ -667,7 +666,8 @@ class _LineItemState extends State<LineItem> {
Opacity(
opacity: 0,
child: RichText(
text: truncateTextSpan(widget.lineContents, column - 1)),
text: truncateTextSpan(widget.lineContents, column - 1),
),
),
Transform.translate(
offset: const Offset(colLeftOffset, colBottomOffset),
Expand All @@ -682,25 +682,11 @@ class _LineItemState extends State<LineItem> {
)
],
),
MouseRegion(
onExit: (_) => _onHoverExit(),
onHover: (e) => _onHover(e, context),
child: SelectableText.rich(
widget.lineContents,
scrollPhysics: const NeverScrollableScrollPhysics(),
maxLines: 1,
)),
_hoverableLine(),
],
);
} else {
child = MouseRegion(
onExit: (_) => _onHoverExit(),
onHover: (e) => _onHover(e, context),
child: SelectableText.rich(
widget.lineContents,
scrollPhysics: const NeverScrollableScrollPhysics(),
maxLines: 1,
));
child = _hoverableLine();
}

final backgroundColor = widget.pausedFrame != null
Expand All @@ -716,4 +702,14 @@ class _LineItemState extends State<LineItem> {
child: child,
);
}

Widget _hoverableLine() => MouseRegion(
onExit: (_) => _onHoverExit(),
onHover: (e) => _onHover(e, context),
child: SelectableText.rich(
widget.lineContents,
scrollPhysics: const NeverScrollableScrollPhysics(),
maxLines: 1,
),
);
}
73 changes: 39 additions & 34 deletions packages/devtools_app/lib/src/debugger/hover.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,48 +92,53 @@ class HoverCard {

_overlayEntry = OverlayEntry(builder: (context) {
return Positioned(
left: position.dx - (width / 2.0),
top: position.dy + _hoverYOffset,
child: MouseRegion(
onExit: (_) {
remove();
},
onEnter: (_) {
_hasMouseEntered = true;
},
child: Container(
padding: const EdgeInsets.fromLTRB(8, 8, 8, 8),
decoration: BoxDecoration(
color: colorScheme.defaultBackgroundColor,
border: Border.all(
color: focusColor,
width: _hoverCardBorderWidth,
left: position.dx - (width / 2.0),
top: position.dy + _hoverYOffset,
child: MouseRegion(
onExit: (_) {
remove();
},
onEnter: (_) {
_hasMouseEntered = true;
},
child: Container(
padding: const EdgeInsets.all(denseSpacing),
decoration: BoxDecoration(
color: colorScheme.defaultBackgroundColor,
border: Border.all(
color: focusColor,
width: _hoverCardBorderWidth,
),
borderRadius: BorderRadius.circular(defaultBorderRadius),
),
width: width,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
width: width,
child: Text(
title,
overflow: TextOverflow.ellipsis,
style: hoverHeading,
textAlign: TextAlign.center,
),
borderRadius: BorderRadius.circular(10.0),
),
width: width,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
width: width,
child: Text(
title,
style: hoverHeading,
textAlign: TextAlign.center,
),
),
Divider(color: colorScheme.hoverTextStyle.color),
contents,
],
),
)));
Divider(color: colorScheme.hoverTextStyle.color),
contents,
],
),
),
),
);
});
overlayState.insert(_overlayEntry);
}

OverlayEntry _overlayEntry;

bool _isRemoved = false;

bool _hasMouseEntered = false;

/// Attempts to remove the HoverCard from the screen.
Expand Down