wip: shortcut listener widget.

app/lib/constants/constants.dart

@@ -20,6 +20,21 @@ const double defaultBorderRadius = 8;
 
 const double defaultButtonHeight = 36;
 
+const List<String> builtInCommands = [
+  'ShowWorkspace',
+  'ToggleMaximize',
+  'Minimize',
+  'ShowWindow',
+  'ShowAllWindow',
+  'SwitchApplication',
+  'ReverseSwitchApplication',
+  'SwitchWorkspace',
+  'ReverseSwitchWorkspace',
+  'SplitWindowLeft',
+  'SplitWindowRight',
+  'MoveWindow',
+];
+
 enum PanelType {
   local_manager,
   market,

app/lib/pages/gesture_editor.dart

@@ -8,6 +8,7 @@ import 'package:dde_gesture_manager/models/settings.provider.dart';
 import 'package:dde_gesture_manager/utils/helper.dart';
 import 'package:dde_gesture_manager/widgets/dde_button.dart';
 import 'package:dde_gesture_manager/widgets/dde_data_table.dart';
+import 'package:dde_gesture_manager/widgets/table_cell_shortcut_listener.dart';
 import 'package:dde_gesture_manager/widgets/table_cell_text_field.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
@@ -46,7 +47,8 @@ class GestureEditor extends StatelessWidget {
                       visible: layoutProvider.localManagerOpened == false,
                       child: DButton(
                         width: defaultButtonHeight,
-                        onTap: () => H.openPanel(context, PanelType.local_manager),
+                        onTap: () =>
+                            H.openPanel(context, PanelType.local_manager),
                         child: Icon(
                           CupertinoIcons.square_list,
                         ),
@@ -75,11 +77,14 @@ class GestureEditor extends StatelessWidget {
                 Expanded(
                   child: GestureDetector(
                     onTap: () {
-                      context.read<GesturePropProvider>().setProps(editMode: false);
+                      context
+                          .read<GesturePropProvider>()
+                          .setProps(editMode: false);
                     },
                     child: Container(
                       decoration: BoxDecoration(
-                        borderRadius: BorderRadius.circular(defaultBorderRadius),
+                        borderRadius:
+                            BorderRadius.circular(defaultBorderRadius),
                         border: Border.all(
                           width: .2,
                           color: context.t.dividerColor,
@@ -87,16 +92,19 @@ class GestureEditor extends StatelessWidget {
                       ),
                       width: double.infinity,
                       clipBehavior: Clip.antiAlias,
-                      child: LayoutBuilder(builder: (BuildContext context, BoxConstraints constraints) {
+                      child: LayoutBuilder(builder:
+                          (BuildContext context, BoxConstraints constraints) {
                         return AdaptiveScrollbar(
                           controller: verticalCtrl,
                           underColor: Colors.transparent,
                           sliderDecoration: BoxDecoration(
-                            borderRadius: BorderRadius.circular(_scrollBarWidth / 2),
+                            borderRadius:
+                                BorderRadius.circular(_scrollBarWidth / 2),
                             color: Colors.grey.withOpacity(.4),
                           ),
                           sliderActiveDecoration: BoxDecoration(
-                            borderRadius: BorderRadius.circular(_scrollBarWidth / 2),
+                            borderRadius:
+                                BorderRadius.circular(_scrollBarWidth / 2),
                             color: Colors.grey.withOpacity(.6),
                           ),
                           position: ScrollbarPosition.right,
@@ -106,11 +114,13 @@ class GestureEditor extends StatelessWidget {
                             width: _scrollBarWidth,
                             underColor: Colors.transparent,
                             sliderDecoration: BoxDecoration(
-                              borderRadius: BorderRadius.circular(_scrollBarWidth / 2),
+                              borderRadius:
+                                  BorderRadius.circular(_scrollBarWidth / 2),
                               color: Colors.grey.withOpacity(.4),
                             ),
                             sliderActiveDecoration: BoxDecoration(
-                              borderRadius: BorderRadius.circular(_scrollBarWidth / 2),
+                              borderRadius:
+                                  BorderRadius.circular(_scrollBarWidth / 2),
                               color: Colors.grey.withOpacity(.6),
                             ),
                             controller: horizontalCtrl,
@@ -119,28 +129,58 @@ class GestureEditor extends StatelessWidget {
                               scrollDirection: Axis.horizontal,
                               controller: horizontalCtrl,
                               child: ConstrainedBox(
-                                constraints: BoxConstraints(minWidth: constraints.maxWidth),
+                                constraints: BoxConstraints(
+                                    minWidth: constraints.maxWidth),
                                 child: DDataTable(
                                   showBottomBorder: true,
                                   headingRowHeight: _headingRowHeight,
                                   showCheckboxColumn: true,
-                                  headerBackgroundColor: context.t.dialogBackgroundColor,
+                                  headerBackgroundColor:
+                                      context.t.dialogBackgroundColor,
                                   verticalScrollController: verticalCtrl,
-                                  dataRowColor: MaterialStateProperty.resolveWith<Color?>((Set<MaterialState> states) {
+                                  dataRowColor:
-                                    if (states.contains(MaterialState.hovered)) return context.t.dialogBackgroundColor;
+                                      MaterialStateProperty.resolveWith<Color?>(
+                                          (Set<MaterialState> states) {
+                                    if (states.contains(MaterialState.hovered))
+                                      return context.t.dialogBackgroundColor;
                                     if (states.contains(MaterialState.selected))
-                                      return context.read<SettingsProvider>().currentActiveColor;
+                                      return context
+                                          .read<SettingsProvider>()
+                                          .currentActiveColor;
                                     return null;
                                   }),
                                   columns: [
-                                    DDataColumn(label: Text(LocaleKeys.gesture_editor_fingers.tr()), center: true),
+                                    DDataColumn(
-                                    DDataColumn(label: Text(LocaleKeys.gesture_editor_gesture.tr()), center: true),
+                                        label: Text(LocaleKeys
-                                    DDataColumn(label: Text(LocaleKeys.gesture_editor_direction.tr()), center: true),
+                                            .gesture_editor_fingers
-                                    DDataColumn(label: Text(LocaleKeys.gesture_editor_type.tr()), center: true),
+                                            .tr()),
-                                    DDataColumn(label: Text(LocaleKeys.gesture_editor_command.tr())),
+                                        center: true),
-                                    DDataColumn(label: Text(LocaleKeys.gesture_editor_remark.tr())),
+                                    DDataColumn(
+                                        label: Text(LocaleKeys
+                                            .gesture_editor_gesture
+                                            .tr()),
+                                        center: true),
+                                    DDataColumn(
+                                        label: Text(LocaleKeys
+                                            .gesture_editor_direction
+                                            .tr()),
+                                        center: true),
+                                    DDataColumn(
+                                        label: Text(LocaleKeys
+                                            .gesture_editor_type
+                                            .tr()),
+                                        center: true),
+                                    DDataColumn(
+                                        label: Text(LocaleKeys
+                                            .gesture_editor_command
+                                            .tr())),
+                                    DDataColumn(
+                                        label: Text(LocaleKeys
+                                            .gesture_editor_remark
+                                            .tr())),
                                   ],
-                                  rows: _buildDataRows(schemeProvider.gestures, context),
+                                  rows: _buildDataRows(
+                                      schemeProvider.gestures, context),
                                 ),
                               ),
                             ),
@@ -170,9 +210,12 @@ class GestureEditor extends StatelessWidget {
   }
 }
 
-List<DDataRow> _buildDataRows(List<GestureProp>? gestures, BuildContext context) => (gestures ?? []).map((gesture) {
+List<DDataRow> _buildDataRows(
+        List<GestureProp>? gestures, BuildContext context) =>
+    (gestures ?? []).map((gesture) {
       var gesturePropProvider = context.watch<GesturePropProvider>();
-      bool editing = gesturePropProvider == gesture && gesturePropProvider.editMode == true;
+      bool editing = gesturePropProvider == gesture &&
+          gesturePropProvider.editMode == true;
       bool selected = gesturePropProvider == gesture && !editing;
       return DDataRow(
         onSelectChanged: (selected) {
@@ -200,11 +243,15 @@ List<DDataRow> _buildDataRows(List<GestureProp>? gestures, BuildContext context)
           }
         },
         selected: selected,
-        cells: editing ? _buildRowCellsEditing(context, gesture) : _buildRowCellsNormal(context, selected, gesture),
+        cells: editing
+            ? _buildRowCellsEditing(context, gesture)
+            : _buildRowCellsNormal(context, selected, gesture),
       );
     }).toList();
 
-List<DDataCell> _buildRowCellsEditing(BuildContext context, GestureProp gesture) => [
+List<DDataCell> _buildRowCellsEditing(
+        BuildContext context, GestureProp gesture) =>
+    [
       DButton.dropdown(
         enabled: true,
         child: DropdownButton<int>(
@@ -297,14 +344,7 @@ List<DDataCell> _buildRowCellsEditing(BuildContext context, GestureProp gesture)
           isExpanded: true,
         ),
       ),
-      TableCellTextField(
+      _buildCommandCellsEditing(context),
-        initText: gesture.command,
-        hint: 'pls input cmd',
-        onComplete: (value) => context.read<GesturePropProvider>().setProps(
-              command: value,
-              editMode: true,
-            ),
-      ),
       TableCellTextField(
         initText: gesture.remark,
         hint: 'pls input cmd',
@@ -315,7 +355,63 @@ List<DDataCell> _buildRowCellsEditing(BuildContext context, GestureProp gesture)
       ),
     ].map((e) => DDataCell(e)).toList();
 
-List<DDataCell> _buildRowCellsNormal(BuildContext context, bool selected, GestureProp gesture) => [
+Widget _buildCommandCellsEditing(BuildContext context) {
+  'build cmd cell'.sout();
+  var gesture = context.read<GesturePropProvider>();
+  switch (gesture.type) {
+    case GestureType.commandline:
+      return TableCellTextField(
+        initText: gesture.command,
+        hint: 'pls input cmd',
+        onComplete: (value) => context.read<GesturePropProvider>().setProps(
+              command: value,
+              editMode: true,
+            ),
+      );
+    case GestureType.built_in:
+      return DButton.dropdown(
+        enabled: true,
+        width: 250.0,
+        child: DropdownButton<String>(
+          icon: Icon(Icons.keyboard_arrow_down_rounded),
+          items: builtInCommands
+              .map(
+                (e) => DropdownMenuItem<String>(
+                  child: Text(
+                    e,
+                    textScaleFactor: .8,
+                  ),
+                  value: e,
+                ),
+              )
+              .toList(),
+          value: builtInCommands.contains(gesture.command)
+              ? gesture.command
+              : builtInCommands.first,
+          onChanged: (value) => context.read<GesturePropProvider>().setProps(
+                command: value,
+                editMode: true,
+              ),
+          isExpanded: true,
+        ),
+      );
+    case GestureType.shortcut:
+      return TableCellShortcutListener(
+        width: 150.0,
+        initShortcut: gesture.command ?? '',
+        onComplete: (value) => context.read<GesturePropProvider>().setProps(
+              command: value,
+              editMode: true,
+            ),
+      );
+    default:
+      throw Exception('Unknown gesture command type.');
+  }
+}
+
+List<DDataCell> _buildRowCellsNormal(
+        BuildContext context, bool selected, GestureProp gesture) =>
+    [
       Center(
         child: Text(
           '${gesture.fingers}',

app/lib/widgets/table_cell_shortcut_listener.dart

@@ -0,0 +1,105 @@
+import 'package:dde_gesture_manager/constants/constants.dart';
+import 'package:dde_gesture_manager/models/settings.provider.dart';
+import 'package:flutter/material.dart';
+import 'package:dde_gesture_manager/extensions.dart';
+
+class TableCellShortcutListener extends StatefulWidget {
+  final double width;
+  final String initShortcut;
+  final Function(String shortcut) onComplete;
+
+  const TableCellShortcutListener({
+    Key? key,
+    this.width = 150.0,
+    required this.initShortcut,
+    required this.onComplete,
+  }) : super(key: key);
+
+  @override
+  _TableCellShortcutListenerState createState() =>
+      _TableCellShortcutListenerState();
+}
+
+class _TableCellShortcutListenerState extends State<TableCellShortcutListener> {
+  List<String> _shortcut = [];
+
+  @override
+  void initState() {
+    _shortcut = widget.initShortcut.split('+');
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return RawKeyboardListener(
+      focusNode: FocusNode(),
+      onKey: (evt) {
+        evt.sout();
+      },
+      child: GestureDetector(
+        onTap: () {},
+        child: Focus(
+          autofocus: true,
+          onKeyEvent: (_, __) => KeyEventResult.skipRemainingHandlers,
+          child: Container(
+            height: kMinInteractiveDimension * .86,
+            width: widget.width,
+            decoration: BoxDecoration(
+              borderRadius: BorderRadius.circular(defaultBorderRadius),
+              color: Colors.grey.withOpacity(.3),
+              border: Border.all(
+                  width: 2,
+                  color: Focus.of(context).hasFocus
+                      ? context.watch<SettingsProvider>().activeColor ??
+                          Color(0xff565656)
+                      : Color(0xff565656)),
+            ),
+            child: Align(
+              alignment: Alignment.centerLeft,
+              child: Padding(
+                padding: EdgeInsets.only(left: 5),
+                child: Row(
+                  mainAxisAlignment: MainAxisAlignment.start,
+                  children: _shortcut
+                      .map(
+                        (e) => Padding(
+                          padding: const EdgeInsets.symmetric(horizontal: 2.0),
+                          child: Container(
+                            decoration: BoxDecoration(
+                              borderRadius: BorderRadius.circular(
+                                  defaultBorderRadius / 2),
+                              color: context.t.dialogBackgroundColor,
+                              border: Border.all(
+                                  width: 1,
+                                  color: Focus.of(context).hasFocus
+                                      ? context
+                                              .watch<SettingsProvider>()
+                                              .activeColor ??
+                                          Color(0xff565656)
+                                      : Color(0xff565656)),
+                            ),
+                            child: Padding(
+                              padding:
+                                  const EdgeInsets.symmetric(horizontal: 5.0),
+                              child: Text(
+                                e,
+                                style: TextStyle(
+                                  color: context
+                                      .watch<SettingsProvider>()
+                                      .activeColor,
+                                ),
+                              ),
+                            ),
+                          ),
+                        ),
+                      )
+                      .toList(),
+                ),
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}

app/lib/widgets/table_cell_text_field.dart

@@ -20,7 +20,9 @@ class TableCellTextField extends StatefulWidget {
 }
 
 class _TableCellTextFieldState extends State<TableCellTextField> {
-  final FocusNode _focusNode = FocusNode();
+  final FocusNode _focusNode = FocusNode(
+    onKeyEvent: (_, __) => KeyEventResult.skipRemainingHandlers,
+  );
   final TextEditingController _controller = TextEditingController();
 
   @override