feat: add operation buttons and tooltip background.

app/lib/models/scheme.dart

@@ -6,6 +6,9 @@ import 'package:dde_gesture_manager/utils/helper.dart';
 
 @ProviderModel(copyable: true)
 class Scheme {
+  @ProviderModelProp()
+  String? id;
+
   @ProviderModelProp()
   String? name;
 
@@ -18,6 +21,7 @@ class Scheme {
   Scheme.parse(scheme) {
     if (scheme is String) scheme = json.decode(scheme);
     assert(scheme is Map);
+    id = scheme['id'];
     name = scheme['name'];
     description = scheme['desc'];
     gestures = (scheme['gestures'] as List? ?? []).map<GestureProp>((ele) => GestureProp.parse(ele)).toList();

app/lib/pages/local_manager.dart

@@ -21,11 +21,14 @@ class LocalManager extends StatefulWidget {
 class _LocalManagerState extends State<LocalManager> {
   late ScrollController _scrollController;
   int? _hoveringIndex;
-  int? _selectedIndex;
+  late int _selectedIndex;
 
   @override
   void initState() {
     super.initState();
+
+    /// todo: load from sp
+    _selectedIndex = 0;
     _scrollController = ScrollController();
   }
 
@@ -83,20 +86,27 @@ class _LocalManagerState extends State<LocalManager> {
                   ],
                 ),
                 Flexible(
+                  child: Padding(
+                    padding: EdgeInsets.only(top: 5),
                     child: Column(
                       mainAxisAlignment: MainAxisAlignment.spaceBetween,
                       children: [
                         Flexible(
+                          child: Container(
+                            decoration: BoxDecoration(
+                              border: Border.all(
+                                width: .3,
+                                color: context.t.dividerColor,
+                              ),
+                              borderRadius: BorderRadius.circular(defaultBorderRadius),
+                            ),
+                            child: Padding(
+                              padding: EdgeInsets.symmetric(horizontal: 1, vertical: 2),
                               child: ListView.builder(
                                 controller: _scrollController,
                                 itemBuilder: (context, index) => GestureDetector(
-                            onDoubleTap: () {
-                              context.read<SchemeProvider>().copyFrom(localSchemes[index].scheme);
-                              setState(() {
-                                _selectedIndex = index;
-                              });
-                            },
                                   onTap: () {
+                                    context.read<SchemeProvider>().copyFrom(localSchemes[index].scheme);
                                     setState(() {
                                       _selectedIndex = index;
                                     });
@@ -111,7 +121,7 @@ class _LocalManagerState extends State<LocalManager> {
                                     child: Container(
                                       color: _getItemBackgroundColor(index),
                                       child: Padding(
-                                  padding: const EdgeInsets.only(right: 12.0),
+                                        padding: const EdgeInsets.only(left: 6, right: 12.0),
                                         child: Row(
                                           mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                           children: [
@@ -126,13 +136,29 @@ class _LocalManagerState extends State<LocalManager> {
                                 itemCount: localSchemes.length,
                               ),
                             ),
+                          ),
+                        ),
+                        Container(height: 5),
                         Container(
-                        height: 150,
+                          child: Row(
-                        color: Colors.black,
+                            mainAxisAlignment: MainAxisAlignment.end,
+                            children: [
+                              DButton.add(enabled: true),
+                              DButton.delete(enabled: _selectedIndex > 0),
+                              DButton.duplicate(enabled: _selectedIndex > 0),
+                              DButton.apply(enabled: _selectedIndex > 0),
+                            ]
+                                .map((e) => Padding(
+                                      padding: const EdgeInsets.only(right: 4),
+                                      child: e,
+                                    ))
+                                .toList(),
+                          ),
                         ),
                       ],
                     ),
                   ),
+                ),
               ],
             ),
           ),

app/lib/themes/dark.dart

@@ -23,4 +23,15 @@ var darkTheme = ThemeData.dark().copyWith(
         ),
       ),
   dialogBackgroundColor: Color(0xff202020),
+  tooltipTheme: ThemeData.dark().tooltipTheme.copyWith(
+        textStyle: TextStyle(
+          color: Colors.grey,
+        ),
+        padding: EdgeInsets.symmetric(horizontal: 3, vertical: 2),
+        decoration: BoxDecoration(
+          borderRadius: BorderRadius.circular(8),
+          color: Color(0xff282828).withOpacity(.9),
+          border: Border.all(color: Colors.black38),
+        ),
+      ),
 );

app/lib/themes/light.dart

@@ -23,4 +23,15 @@ var lightTheme = ThemeData.light().copyWith(
         ),
       ),
   dialogBackgroundColor: Color(0xfffefefe),
+  tooltipTheme: ThemeData.dark().tooltipTheme.copyWith(
+        textStyle: TextStyle(
+          color: Colors.grey.shade600,
+        ),
+        padding: EdgeInsets.symmetric(horizontal: 3, vertical: 2),
+        decoration: BoxDecoration(
+          borderRadius: BorderRadius.circular(8),
+          color: Color(0xfff8f8f8).withOpacity(.9),
+          border: Border.all(color: Colors.grey.shade400),
+        ),
+      ),
 );

app/lib/widgets/dde_button.dart

@@ -1,4 +1,5 @@
 import 'package:dde_gesture_manager/constants/constants.dart';
+import 'package:dde_gesture_manager/extensions.dart';
 import 'package:flutter/material.dart';
 import 'package:glass_kit/glass_kit.dart';
 
@@ -16,6 +17,74 @@ class DButton extends StatefulWidget {
     this.onTap,
   }) : super(key: key);
 
+  factory DButton.add({
+    Key? key,
+    required enabled,
+    GestureTapCallback? onTap,
+    height = defaultButtonHeight * .7,
+    width = defaultButtonHeight * .7,
+  }) =>
+      DButton(
+          key: key,
+          width: width,
+          height: height,
+          onTap: onTap,
+          child: Tooltip(
+            child: Opacity(opacity: enabled ? 1 : 0.4, child: const Icon(Icons.add, size: 18)),
+            message: LocaleKeys.operation_add.tr(),
+          ));
+
+  factory DButton.delete({
+    Key? key,
+    required enabled,
+    GestureTapCallback? onTap,
+    height = defaultButtonHeight * .7,
+    width = defaultButtonHeight * .7,
+  }) =>
+      DButton(
+          key: key,
+          width: width,
+          height: height,
+          onTap: onTap,
+          child: Tooltip(
+            child: Opacity(opacity: enabled ? 1 : 0.4, child: const Icon(Icons.remove, size: 18)),
+            message: LocaleKeys.operation_delete.tr(),
+          ));
+
+  factory DButton.apply({
+    Key? key,
+    required enabled,
+    GestureTapCallback? onTap,
+    height = defaultButtonHeight * .7,
+    width = defaultButtonHeight * .7,
+  }) =>
+      DButton(
+          key: key,
+          width: width,
+          height: height,
+          onTap: onTap,
+          child: Tooltip(
+            child: Opacity(opacity: enabled ? 1 : 0.4, child: const Icon(Icons.check, size: 18)),
+            message: LocaleKeys.operation_apply.tr(),
+          ));
+
+  factory DButton.duplicate({
+    Key? key,
+    required enabled,
+    GestureTapCallback? onTap,
+    height = defaultButtonHeight * .7,
+    width = defaultButtonHeight * .7,
+  }) =>
+      DButton(
+          key: key,
+          width: width,
+          height: height,
+          onTap: onTap,
+          child: Tooltip(
+            child: Opacity(opacity: enabled ? 1 : 0.4, child: const Icon(Icons.copy_rounded, size: 18)),
+            message: LocaleKeys.operation_duplicate.tr(),
+          ));
+
   @override
   State<DButton> createState() => _DButtonState();
 }