Skip to content

feat: support for xiaomi smart pen #1132

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

Open
arpandaze wants to merge 4 commits into
base: main
Choose a base branch
from
+162 −85
Open

feat: support for xiaomi smart pen #1132

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
9131bdb
feat(stylus): xiaomi smart pen keybinds added
arpandaze Feb 20, 2024
bec4440
feat: function to toggle between primary and secondary colors
arpandaze Feb 20, 2024
a5eedfd
fix: workaround for enabling keyboard stream after refocus
arpandaze Feb 20, 2024
f4317ed
fix(ci): visibility_detector error on tests fixed
arpandaze Feb 20, 2024
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
42 changes: 42 additions & 0 deletions lib/components/toolbar/toolbar.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -107,6 +107,8 @@ class _ToolbarState extends State<Toolbar> {
Keybinding? _ctrlShiftS;
Keybinding? _f11;
Keybinding? _ctrlV;
Keybinding? _pageUp;
Keybinding? _pageDown;
void _assignKeybindings() {
_ctrlF = Keybinding([KeyCode.ctrl, KeyCode.from(LogicalKeyboardKey.keyF)],
inclusive: true);
Expand All @@ -120,13 +122,19 @@ class _ToolbarState extends State<Toolbar> {
_f11 = Keybinding([KeyCode.from(LogicalKeyboardKey.f11)], inclusive: true);
_ctrlV = Keybinding([KeyCode.ctrl, KeyCode.from(LogicalKeyboardKey.keyV)],
inclusive: true);
_pageUp =
Keybinding([KeyCode.from(LogicalKeyboardKey.pageUp)], inclusive: true);
_pageDown = Keybinding([KeyCode.from(LogicalKeyboardKey.pageDown)],
inclusive: true);

Keybinder.bind(_ctrlF!, widget.toggleFingerDrawing);
Keybinder.bind(_ctrlE!, toggleEraser);
Keybinder.bind(_ctrlC!, toggleColorOptions);
Keybinder.bind(_ctrlShiftS!, toggleExportBar);
Keybinder.bind(_f11!, toggleFullscreen);
Keybinder.bind(_ctrlV!, widget.paste);
Keybinder.bind(_pageUp!, togglePrimarySecondaryColor);
Keybinder.bind(_pageDown!, toggleEraser);
}

void _removeKeybindings() {
Expand All @@ -136,6 +144,8 @@ class _ToolbarState extends State<Toolbar> {
if (_ctrlShiftS != null) Keybinder.remove(_ctrlShiftS!);
if (_f11 != null) Keybinder.remove(_f11!);
if (_ctrlV != null) Keybinder.remove(_ctrlV!);
if (_pageUp != null) Keybinder.remove(_pageUp!);
if (_pageDown != null) Keybinder.remove(_pageDown!);
}

void toggleEraser() {
Expand All @@ -147,6 +157,38 @@ class _ToolbarState extends State<Toolbar> {
showColorOptions.value = !showColorOptions.value;
}

void togglePrimarySecondaryColor() {
Copy link
Member

@adil192 adil192 Jan 27, 2026

Choose a reason for hiding this comment

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

The primary/secondary color switching is out-of-scope for this PR. Additional stylus button functionalities are something we'd need to properly design in the future.

For now, please just make either button switch to the eraser like with other styluses.

toolOptionsType.value = ToolOptions.hide;
widget.setTool(Pen.currentPen);

if (Prefs.pinnedColors.value.isEmpty) {
ScaffoldMessenger.of(context).showSnackBar(const SnackBar(
content: Text('No pinned colors available!'),
));
return;
}

if (Prefs.pinnedColors.value.length < 2) {
ScaffoldMessenger.of(context).showSnackBar(const SnackBar(
content:
Text('Pin at least two colors to toggle primary and secondary!'),
));
return;
}

var primaryColorString = Prefs.pinnedColors.value[0];
var secondaryColorString = Prefs.pinnedColors.value[1];

var primary = Color(int.parse(primaryColorString));
var secondary = Color(int.parse(secondaryColorString));

if (Pen.currentPen.color != primary) {
widget.setColor(primary);
} else {
widget.setColor(secondary);
}
}

void toggleExportBar() {
showExportOptions.value = !showExportOptions.value;
}
Expand Down
181 changes: 96 additions & 85 deletions lib/pages/editor/editor.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import 'package:flutter/foundation.dart' show kDebugMode;
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_quill/flutter_quill.dart' as flutter_quill;
import 'package:focus_detector/focus_detector.dart';
import 'package:keybinder/keybinder.dart';
import 'package:logging/logging.dart';
import 'package:printing/printing.dart';
Expand Down Expand Up @@ -1555,96 +1556,106 @@ class EditorState extends State<Editor> {
child: child!,
);
},
child: Scaffold(
appBar: DynamicMaterialApp.isFullscreen
? null
: AppBar(
toolbarHeight: kToolbarHeight,
title: widget.customTitle != null
? Text(widget.customTitle!)
: Form(
key: _filenameFormKey,
autovalidateMode: AutovalidateMode.onUserInteraction,
child: TextFormField(
decoration: const InputDecoration(
border: InputBorder.none,
child: FocusDetector(
onFocusGained: () {
// Key bindings won't work until keyboard is shown at least once for some reason.
// This is a workaround to fix that. It should be unnoticable to the user.
if (Platform.isAndroid) {
SystemChannels.textInput.invokeMethod('TextInput.show');
SystemChannels.textInput.invokeMethod('TextInput.hide');
}
},
Comment on lines +1560 to +1567
Copy link
Member

@adil192 adil192 Jan 27, 2026

Choose a reason for hiding this comment

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

This solution seems a bit hacky.
I'm willing to accept it, but to reduce the impact of any potential side effects, please limit this to Xiaomi devices.

Copy link

@Vojtak42 Vojtak42 Jan 27, 2026

Choose a reason for hiding this comment

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

This solution seems a bit hacky. I'm willing to accept it, but to reduce the impact of any potential side effects, please limit this to Xiaomi devices.

And Redmi (if it makes a difference), please.

child: Scaffold(
appBar: DynamicMaterialApp.isFullscreen
? null
: AppBar(
toolbarHeight: kToolbarHeight,
title: widget.customTitle != null
? Text(widget.customTitle!)
: Form(
key: _filenameFormKey,
autovalidateMode: AutovalidateMode.onUserInteraction,
child: TextFormField(
decoration: const InputDecoration(
border: InputBorder.none,
),
controller: filenameTextEditingController,
onChanged: renameFile,
autofocus: needsNaming,
validator: _validateFilenameTextField,
),
controller: filenameTextEditingController,
onChanged: renameFile,
autofocus: needsNaming,
validator: _validateFilenameTextField,
),
),
leading: SaveIndicator(
savingState: savingState,
triggerSave: saveToFile,
),
actions: [
IconButton(
icon: const AdaptiveIcon(
icon: Icons.insert_page_break,
cupertinoIcon: CupertinoIcons.add,
),
tooltip: t.editor.menu.insertPage,
onPressed: () => setState(() {
final currentPageIndex = this.currentPageIndex;
insertPageAfter(currentPageIndex);
CanvasGestureDetector.scrollToPage(
pageIndex: currentPageIndex + 1,
pages: coreInfo.pages,
screenWidth: MediaQuery.sizeOf(context).width,
transformationController: _transformationController,
);
}),
leading: SaveIndicator(
savingState: savingState,
triggerSave: saveToFile,
),
IconButton(
icon: const AdaptiveIcon(
icon: Icons.grid_view,
cupertinoIcon: CupertinoIcons.rectangle_grid_2x2,
actions: [
IconButton(
icon: const AdaptiveIcon(
icon: Icons.insert_page_break,
cupertinoIcon: CupertinoIcons.add,
),
tooltip: t.editor.menu.insertPage,
onPressed: () => setState(() {
final currentPageIndex = this.currentPageIndex;
insertPageAfter(currentPageIndex);
CanvasGestureDetector.scrollToPage(
pageIndex: currentPageIndex + 1,
pages: coreInfo.pages,
screenWidth: MediaQuery.sizeOf(context).width,
transformationController: _transformationController,
);
}),
),
tooltip: t.editor.pages,
onPressed: () {
showDialog(
context: context,
builder: (context) => AdaptiveAlertDialog(
title: Text(t.editor.pages),
content: pageManager(context),
actions: const [],
),
);
},
),
IconButton(
icon: const AdaptiveIcon(
icon: Icons.more_vert,
cupertinoIcon: CupertinoIcons.ellipsis_vertical,
IconButton(
icon: const AdaptiveIcon(
icon: Icons.grid_view,
cupertinoIcon: CupertinoIcons.rectangle_grid_2x2,
),
tooltip: t.editor.pages,
onPressed: () {
showDialog(
context: context,
builder: (context) => AdaptiveAlertDialog(
title: Text(t.editor.pages),
content: pageManager(context),
actions: const [],
),
);
},
),
onPressed: () {
showModalBottomSheet(
context: context,
builder: (context) => bottomSheet(context),
isScrollControlled: true,
showDragHandle: true,
backgroundColor: colorScheme.surface,
constraints: const BoxConstraints(
maxWidth: 500,
),
);
},
)
],
),
body: body,
floatingActionButton: (DynamicMaterialApp.isFullscreen &&
!Prefs.editorToolbarShowInFullscreen.value)
? FloatingActionButton(
shape: cupertino ? const CircleBorder() : null,
onPressed: () {
DynamicMaterialApp.setFullscreen(false, updateSystem: true);
},
child: const Icon(Icons.fullscreen_exit),
)
: null,
IconButton(
icon: const AdaptiveIcon(
icon: Icons.more_vert,
cupertinoIcon: CupertinoIcons.ellipsis_vertical,
),
onPressed: () {
showModalBottomSheet(
context: context,
builder: (context) => bottomSheet(context),
isScrollControlled: true,
showDragHandle: true,
backgroundColor: colorScheme.surface,
constraints: const BoxConstraints(
maxWidth: 500,
),
);
},
)
],
),
body: body,
floatingActionButton: (DynamicMaterialApp.isFullscreen &&
!Prefs.editorToolbarShowInFullscreen.value)
? FloatingActionButton(
shape: cupertino ? const CircleBorder() : null,
onPressed: () {
DynamicMaterialApp.setFullscreen(false, updateSystem: true);
},
child: const Icon(Icons.fullscreen_exit),
)
: null,
),
),
);
}
Expand Down
16 changes: 16 additions & 0 deletions pubspec.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -531,6 +531,14 @@ packages:
description: flutter
source: sdk
version: "0.0.0"
focus_detector:
dependency: "direct main"
description:
name: focus_detector
sha256: "05e32d9dd378cd54f1a3f9ce813c05156f28eb83f8e68f5bf1a37e9cdb21af1c"
url: "https://pub.dev"
source: hosted
version: "2.0.1"
font_awesome_flutter:
dependency: "direct main"
description:
Expand Down Expand Up @@ -1431,6 +1439,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "3.0.2"
visibility_detector:
dependency: "direct main"
description:
name: visibility_detector
sha256: ec932527913f32f65aa01d3a393504240b9e9021ecc77123f017755605e48832
url: "https://pub.dev"
source: hosted
version: "0.2.2"
vm_service:
dependency: transitive
description:
Expand Down
4 changes: 4 additions & 0 deletions pubspec.yaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -138,6 +138,10 @@ dependencies:

one_dollar_unistroke_recognizer: ^1.0.0

focus_detector: ^2.0.1

visibility_detector: ^0.2.2

meta: ^1.0.0

mutex: ^3.1.0
Expand Down
4 changes: 4 additions & 0 deletions test/editor_undo_redo_test.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import 'package:saber/data/flavor_config.dart';
import 'package:saber/data/prefs.dart';
import 'package:saber/i18n/strings.g.dart';
import 'package:saber/pages/editor/editor.dart';
import 'package:visibility_detector/visibility_detector.dart';

import 'utils/test_mock_channel_handlers.dart';

Expand Down Expand Up @@ -77,6 +78,9 @@ void main() {

// draw something
await drawOnEditor(tester);

// visibility detector triggers error withour this
VisibilityDetectorController.instance.updateInterval = Duration.zero;
await tester.pumpAndSettle();
expect(getUndoBtn().onPressed, isNotNull,
reason: 'Undo button should be enabled after first draw');
Expand Down