feat: add dde data table.

app/lib/pages/gesture_editor.dart

@@ -3,6 +3,7 @@ import 'package:dde_gesture_manager/extensions.dart';
 import 'package:dde_gesture_manager/models/content_layout.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:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
 
@@ -24,6 +25,7 @@ class GestureEditor extends StatelessWidget {
             padding: const EdgeInsets.all(8.0),
             child: Column(
               mainAxisAlignment: MainAxisAlignment.spaceBetween,
+              mainAxisSize: MainAxisSize.max,
               children: [
                 Row(
                   mainAxisAlignment: MainAxisAlignment.spaceBetween,
@@ -50,13 +52,123 @@ class GestureEditor extends StatelessWidget {
                     ),
                   ],
                 ),
+                Expanded(
+                  child: Container(
+                    decoration: BoxDecoration(
+                      borderRadius: BorderRadius.circular(defaultBorderRadius),
+                      border: Border.all(
+                        width: .2,
+                        color: context.t.dividerColor,
+                      ),
+                    ),
+                    width: double.infinity,
+                    clipBehavior: Clip.antiAlias,
+                    child: LayoutBuilder(builder: (BuildContext context, BoxConstraints constraints) {
+                      return Scrollbar(
+                        isAlwaysShown: true,
+                        child: SingleChildScrollView(
+                          primary: true,
+                          scrollDirection: Axis.horizontal,
+                          child: ConstrainedBox(
+                            constraints: BoxConstraints(minWidth: constraints.maxWidth),
+                            child: DDataTable(
+                              decoration: BoxDecoration(
+                                borderRadius: BorderRadius.circular(defaultBorderRadius),
+                                border: Border.all(
+                                  width: .2,
+                                  color: context.t.dividerColor,
+                                ),
+                              ),
+                              columns: [
+                                DDataColumn(label: Text('gesture')),
+                                DDataColumn(label: Text('direction')),
+                                DDataColumn(label: Text('fingers')),
+                                DDataColumn(label: Text('type')),
+                                DDataColumn(label: Text('command')),
+                                DDataColumn(label: Text('remark')),
+                              ],
+                              rows: [
+                                DDataRow(
+                                  cells: [
+                                    DDataCell(Text('swipe')),
+                                    DDataCell(Text('right')),
+                                    DDataCell(Text('3')),
+                                    DDataCell(Text('shortcut')),
+                                    DDataCell(Text('ctrl+w')),
+                                    DDataCell(Text('close current page.')),
+                                  ],
+                                ),
+                                DDataRow(
+                                  cells: [
+                                    DDataCell(Text('swipe')),
+                                    DDataCell(Text('left')),
+                                    DDataCell(Text('3')),
+                                    DDataCell(Text('shortcut')),
+                                    DDataCell(Text('ctrl+alt+t')),
+                                    DDataCell(Text('reopen last closed page.')),
+                                  ],
+                                ),
+                                DDataRow(
+                                  cells: [
+                                    DDataCell(Text('swipe')),
+                                    DDataCell(Text('left')),
+                                    DDataCell(Text('3')),
+                                    DDataCell(Text('shortcut')),
+                                    DDataCell(Text('ctrl+alt+t')),
+                                    DDataCell(Text('reopen last closed page.')),
+                                  ],
+                                ),
+                                DDataRow(
+                                  cells: [
+                                    DDataCell(Text('swipe')),
+                                    DDataCell(Text('left')),
+                                    DDataCell(Text('3')),
+                                    DDataCell(Text('shortcut')),
+                                    DDataCell(Text('ctrl+alt+t')),
+                                    DDataCell(Text('reopen last closed page.')),
+                                  ],
+                                ),
+                                DDataRow(
+                                  cells: [
+                                    DDataCell(Text('swipe')),
+                                    DDataCell(Text('left')),
+                                    DDataCell(Text('3')),
+                                    DDataCell(Text('shortcut')),
+                                    DDataCell(Text('ctrl+alt+t')),
+                                    DDataCell(Text('reopen last closed page.')),
+                                  ],
+                                ),
+                                DDataRow(
+                                  cells: [
+                                    DDataCell(Text('swipe')),
+                                    DDataCell(Text('down')),
+                                    DDataCell(Text('3')),
+                                    DDataCell(Text('commandline')),
+                                    DDataCell(Text(
+                                        'dbus-send --type=method_call --dest=com.deepin.dde.Launcher /com/deepin/dde/Launcher com.deepin.dde.Launcher.Toggle')),
+                                    DDataCell(TextButton(
+                                      onPressed: () => print(123),
+                                      child: Text('show launcher.'),
+                                    )),
+                                  ],
+                                ),
+                              ],
+                            ),
+                          ),
+                        ),
+                      );
+                    }),
+                  ),
+                ),
+                Container(height: 10),
                 Container(
-                  child: Row(
+                  height: 400,
-                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                  decoration: BoxDecoration(
-                    children: [
+                    borderRadius: BorderRadius.circular(defaultBorderRadius),
-                      Text("<编辑器区域"),
+                    border: Border.all(
-                      Text("编辑器区域>"),
+                      width: .2,
-                    ],
+                      color: context.t.dividerColor,
+                    ),
                   ),
                 ),
               ],

app/lib/themes/dark.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:dde_gesture_manager/constants/constants.dart';
 
 var darkTheme = ThemeData.dark().copyWith(
   primaryColor: Colors.grey,
@@ -7,6 +8,7 @@ var darkTheme = ThemeData.dark().copyWith(
   iconTheme: IconThemeData(
     color: Color(0xffc0c6d4),
   ),
+  dividerColor: Color(0xfff3f3f3),
   textTheme: ThemeData.dark().textTheme.copyWith(
         headline1: TextStyle(
           color: Color(0xffc0c6d4),
@@ -15,4 +17,9 @@ var darkTheme = ThemeData.dark().copyWith(
           color: Color(0xffc0c6d4),
         ),
       ),
+  popupMenuTheme: ThemeData.dark().popupMenuTheme.copyWith(
+    shape: RoundedRectangleBorder(
+      borderRadius: BorderRadius.circular(defaultBorderRadius),
+    ),
+  ),
 );

app/lib/themes/light.dart

@@ -1,3 +1,4 @@
+import 'package:dde_gesture_manager/constants/constants.dart';
 import 'package:flutter/material.dart';
 
 var lightTheme = ThemeData.light().copyWith(
@@ -7,6 +8,7 @@ var lightTheme = ThemeData.light().copyWith(
   iconTheme: IconThemeData(
     color: Color(0xff414d68),
   ),
+  dividerColor: Color(0xfff3f3f3),
   textTheme: ThemeData.light().textTheme.copyWith(
         headline1: TextStyle(
           color: Color(0xff414d68),
@@ -15,4 +17,9 @@ var lightTheme = ThemeData.light().copyWith(
           color: Color(0xff414d68),
         ),
       ),
+  popupMenuTheme: ThemeData.dark().popupMenuTheme.copyWith(
+        shape: RoundedRectangleBorder(
+          borderRadius: BorderRadius.circular(defaultBorderRadius),
+        ),
+      ),
 );

app/pubspec.yaml

@@ -33,6 +33,7 @@ dependencies:
   package_info_plus: ^1.0.6
   easy_localization: ^3.0.0
   glass_kit: ^2.0.1
+  rect_getter: ^1.0.0
   xdg_directories_web:
     path: 3rd_party/xdg_directories_web