flutter_html
flutter_html copied to clipboard
[BUG] Selection Area Does not Working on Html
Describe the bug: --- I m using flutter_html 3.0.0-beta.2 version and i need to use Special Selections Controls This is my articeture if (widget.model.description != null) SelectionArea( selectionControls: LamotsSelectionControls(), child: HtmlWidget( fixHTMLCharacters(widget.model.description!), ), ), But it doesnt work when i select an element, i see underscore on screen
import 'package:egitimapp/core/init/selecatable_components/selectable_components.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
class LamotsSelectionControls extends MaterialTextSelectionControls {
// Padding between the toolbar and the anchor.
static const double _kToolbarContentDistanceBelow = 20.0;
static const double _kToolbarContentDistance = 8.0;
/// Builder for material-style copy/paste text selection toolbar.
@override
Widget buildToolbar(
BuildContext context,
Rect globalEditableRegion,
double textLineHeight,
Offset selectionMidpoint,
List<TextSelectionPoint> endpoints,
TextSelectionDelegate delegate,
ClipboardStatusNotifier? clipboardStatus,
Offset? lastSecondaryTapDownPosition,
) {
final TextSelectionPoint startTextSelectionPoint = endpoints[0];
final TextSelectionPoint endTextSelectionPoint =
endpoints.length > 1 ? endpoints[1] : endpoints[0];
final Offset anchorAbove = Offset(
globalEditableRegion.left + selectionMidpoint.dx,
globalEditableRegion.top +
startTextSelectionPoint.point.dy -
textLineHeight -
_kToolbarContentDistance);
final Offset anchorBelow = Offset(
globalEditableRegion.left + selectionMidpoint.dx,
globalEditableRegion.top +
endTextSelectionPoint.point.dy +
_kToolbarContentDistanceBelow,
);
return MyTextSelectionToolbar(
anchorAbove: anchorAbove,
anchorBelow: anchorBelow,
clipboardStatus: clipboardStatus ?? ClipboardStatusNotifier(),
selectedText: delegate.textEditingValue.text.substring(
delegate.textEditingValue.selection.start,
delegate.textEditingValue.selection.end,
),
// ignore: deprecated_member_use
handleCopy: canCopy(delegate)
// ignore: deprecated_member_use
? () => handleCopy(delegate, clipboardStatus)
: null,
handleCustomButton: () {
delegate.userUpdateTextEditingValue(
delegate.textEditingValue.copyWith(
selection: TextSelection.collapsed(
offset: delegate.textEditingValue.selection.baseOffset,
)),
SelectionChangedCause.tap,
);
delegate.hideToolbar();
},
// ignore: deprecated_member_use
handleCut: canCut(delegate) ? () => handleCut(delegate) : null,
// ignore: deprecated_member_use
handlePaste: canPaste(delegate) ? () => handlePaste(delegate) : null,
handleSelectAll:
// ignore: deprecated_member_use
canSelectAll(delegate) ? () => handleSelectAll(delegate) : null,
);
}
}
class MyTextSelectionToolbar extends StatefulWidget {
const MyTextSelectionToolbar({
Key? key,
required this.anchorAbove,
required this.anchorBelow,
required this.clipboardStatus,
this.handleCopy,
this.handleCustomButton,
this.handleCut,
this.handlePaste,
this.handleSelectAll,
required this.selectedText,
}) : super(key: key);
final Offset anchorAbove;
final Offset anchorBelow;
final ClipboardStatusNotifier clipboardStatus;
final String selectedText;
final VoidCallback? handleCopy;
final VoidCallback? handleCustomButton;
final VoidCallback? handleCut;
final VoidCallback? handlePaste;
final VoidCallback? handleSelectAll;
@override
MyTextSelectionToolbarState createState() => MyTextSelectionToolbarState();
}
class MyTextSelectionToolbarState extends State<MyTextSelectionToolbar> {
void _onChangedClipboardStatus() {
setState(() {});
}
@override
void initState() {
super.initState();
widget.clipboardStatus.addListener(_onChangedClipboardStatus);
widget.clipboardStatus.update();
}
@override
void didUpdateWidget(MyTextSelectionToolbar oldWidget) {
super.didUpdateWidget(oldWidget);
if (widget.clipboardStatus != oldWidget.clipboardStatus) {
widget.clipboardStatus.addListener(_onChangedClipboardStatus);
oldWidget.clipboardStatus.removeListener(_onChangedClipboardStatus);
}
widget.clipboardStatus.update();
}
@override
void dispose() {
super.dispose();
if (!widget.clipboardStatus.disposed) {
widget.clipboardStatus.removeListener(_onChangedClipboardStatus);
}
}
@override
Widget build(BuildContext context) {
assert(debugCheckHasMaterialLocalizations(context));
final MaterialLocalizations localizations =
MaterialLocalizations.of(context);
// final List<_TextSelectionToolbarItemData> itemDatas =
// <_TextSelectionToolbarItemData>[
// if (widget.handleCut != null)
// _TextSelectionToolbarItemData(
// label: localizations.cutButtonLabel,
// onPressed: widget.handleCut,
// ),
// if (widget.handleCopy != null)
// _TextSelectionToolbarItemData(
// label: localizations.copyButtonLabel,
// onPressed: widget.handleCopy,
// ),
// _TextSelectionToolbarItemData(
// onPressed: () {}, label: 'Kaydet', visible: false),
// if (widget.handlePaste != null &&
// widget.clipboardStatus.value == ClipboardStatus.pasteable)
// _TextSelectionToolbarItemData(
// label: localizations.pasteButtonLabel,
// onPressed: widget.handlePaste,
// ),
// if (widget.handleSelectAll != null)
// _TextSelectionToolbarItemData(
// label: localizations.selectAllButtonLabel,
// onPressed: widget.handleSelectAll,
// ),
// ];
// int childIndex = 0;
return TextSelectionToolbar(
anchorAbove: widget.anchorAbove,
anchorBelow: widget.anchorBelow,
toolbarBuilder: (BuildContext context, Widget child) {
return Column(
mainAxisSize: MainAxisSize.min,
children: [
PdfSelectedItem(
selectedItem: widget.selectedText,
),
Container(
decoration: BoxDecoration(
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.black12.withOpacity(0.15),
blurRadius: 10,
),
],
borderRadius: BorderRadius.circular(8.r),
),
child: child,
),
],
);
},
children: [
SizedBox(
width: 222.w,
child: CupertinoButton(
padding: EdgeInsets.zero,
child: Text(localizations.copyButtonLabel),
onPressed: widget.handleCopy,
),
)
],
);
}
}
HTML to reproduce the issue:
Html widget configuration:
Expected behavior:
Screenshots:
Device details and Flutter/Dart/flutter_html versions:
Stacktrace/Logcat
Additional info:
A picture of a cute animal (not mandatory but encouraged)