项目背景

公司业务历史悠久且复杂，数据库的表更是多而繁杂，每次基于老业务做功能开发都需要去翻以前的表和业务代码。需要理解旧的表的用途以及包含的字段的含义，表少还好说，但是表一多这就很浪费时间，而且留下来的文档都是残缺不全，每次查一些表的含义都要捯饬很久。在网上搜索关于数据库文档管理工具搜到最多的就是Screw和DBCHM，一个是基于Java的工具、另一个则是bug很多，表一多就一直转圈圈进不去。所以自己就动手开发了这款SmartSQL的工具。

它是一款基于.Net 4.6.1、WPF开发的一款数据库文档管理，不仅支持多种数据库(SQLServer、MySQL、PostgreSQL、SQLite)表、视图、存储过程的查询管理，还支持对其进行导出成离线文档，支持的文档包括CHM、Word、Excel、PDF、HTML、Xml、Json、MarkDown等多种格式。

现在将它开源分享出来，供更多的小伙伴使用和参考学习（文末附开源地址）。

技术栈

  • .Net 4.6.1
  • WPF
  • HandyControl
  • SqlSugar
  • AvalonEdit
  • SharpVectors

HandyControl是一款非常优秀的WPF框架，做出来的页面都很漂亮，所以我们选择使用它。

Nuget中引用HandyControl：

一.菜单栏

然后我们要实现一个基于WPF边框上的菜单栏，刚好HandyControl中有这么一个菜单栏的控件,

下面就是实现菜单栏的方法：

`

<hc:GlowWindow.NonClientAreaContent>

    <StackPanel Height="29" Margin="25,0,0,0">

        <Menu HorizontalAlignment="Left">

            <MenuItem

                x:Name="SwitchMenu"

                Cursor="Hand"

                FontWeight="Bold"

                Foreground="{DynamicResource DarkPrimaryBrush}"

                Header="选择连接">

                <MenuItem.Icon>

                    <Path

                        Data="{StaticResource DownGeometry}"

                        Fill="{DynamicResource DarkPrimaryBrush}"

                        Stretch="Uniform" />

                </MenuItem.Icon>

                <MenuItem.ItemTemplate>

                    <HierarchicalDataTemplate>

                        <MenuItem

                            Width="160"

                            Margin="0"

                            Padding="0"

                            HorizontalAlignment="Left"

                            VerticalAlignment="Stretch"

                            Click="SwitchMenu_Click"

                            Cursor="Hand"

                            FontWeight="Normal"

                            Header="{Binding ConnectName}">

                            <MenuItem.Icon>

                                <svgc:SvgViewbox

                                    Width="16"

                                    Height="16"

                                    HorizontalAlignment="Left"

                                    IsHitTestVisible="False"

                                    Source="{Binding Icon}" />

                            </MenuItem.Icon>

                        </MenuItem>

                    </HierarchicalDataTemplate>

                </MenuItem.ItemTemplate>

            </MenuItem>

            <MenuItem

                Name="MenuConnect"

                Cursor="Hand"

                FontWeight="Bold"

                Foreground="{DynamicResource DarkPrimaryBrush}"

                Header="文件">

                <MenuItem.Icon>

                    <Path

                        Data="{StaticResource FileGeometry}"

                        Fill="{DynamicResource DarkPrimaryBrush}"

                        Stretch="Uniform" />

                </MenuItem.Icon>

                <MenuItem

                    Name="AddConnect"

                    Click="AddConnect_OnClick"

                    FontWeight="Normal"

                    Header="新建连接">

                    <MenuItem.Icon>

                        <Path

                            Data="{StaticResource NewConnectGeometry}"

                            Fill="{DynamicResource DarkPrimaryBrush}"

                            Stretch="Uniform" />

                    </MenuItem.Icon>

                </MenuItem>

                <MenuItem

                    Name="ImportMark"

                    Click="ImportMark_OnClick"

                    FontWeight="Normal"

                    Header="导入备注">

                    <MenuItem.Icon>

                        <Path

                            Data="{StaticResource ImportGeometry}"

                            Fill="{DynamicResource DarkPrimaryBrush}"

                            Stretch="Uniform" />

                    </MenuItem.Icon>

                </MenuItem>

                <MenuItem

                    Name="ExportDoc"

                    Click="ExportDoc_OnClick"

                    FontWeight="Normal"

                    Header="导出文档">

                    <MenuItem.Icon>

                        <Path

                            Data="{StaticResource ExportGeometry}"

                            Fill="{DynamicResource DarkPrimaryBrush}"

                            Stretch="Uniform" />

                    </MenuItem.Icon>

                </MenuItem>

            </MenuItem>

            <MenuItem

                Name="MenuGroup"

                Click="MenuGroup_OnClick"

                Cursor="Hand"

                FontWeight="Bold"

                Foreground="{DynamicResource DarkPrimaryBrush}"

                Header="分组">

                <MenuItem.Icon>

                    <Path

                        Data="{StaticResource GroupGeometry}"

                        Fill="{DynamicResource DarkPrimaryBrush}"

                        Stretch="Uniform" />

                </MenuItem.Icon>

            </MenuItem>

            <MenuItem

                Name="MenuSetting"

                Click="MenuSetting_OnClick"

                Cursor="Hand"

                FontWeight="Bold"

                Foreground="{DynamicResource DarkPrimaryBrush}"

                Header="设置">

                <MenuItem.Icon>

                    <Path

                        Data="{StaticResource SettingGeometry}"

                        Fill="{DynamicResource DarkPrimaryBrush}"

                        Stretch="Uniform" />

                </MenuItem.Icon>

            </MenuItem>

            <MenuItem

                Name="MenuAbout"

                Click="MenuAbout_OnClick"

                Cursor="Hand"

                FontWeight="Bold"

                Foreground="{DynamicResource DarkPrimaryBrush}"

                Header="关于">

                <MenuItem.Icon>

                    <Path

                        Data="{StaticResource InfoGeometry}"

                        Fill="{DynamicResource DarkPrimaryBrush}"

                        Stretch="Uniform" />

                </MenuItem.Icon>

            </MenuItem>

        </Menu>

    </StackPanel>

</hc:GlowWindow.NonClientAreaContent>

<!--  工具栏菜单  -->

其中有个小插曲，在WPF中是默认不支持svg图形的，所以我们需要引用一个组件：SharpVectors,它的使用方法是这样的，引用svg界面需要引入下面语句：

xmlns:svgc="http://sharpvectors.codeplex.com/svgc/"

然后引用要显示的svg图形：

<svgc:SvgViewbox

          Width="16"

          Height="16"

          HorizontalAlignment="Left"

          IsHitTestVisible="False"

          Source="{Binding Icon}" />

二.左侧菜单栏

然后就是左侧的菜单栏，我们要实现一个数据库的选择和数据库对象的搜索，可以搜索相关表、视图、存储过程等对象。

首先我们要对我们的主界面进行一个简单的1:1:1的竖向布局，分别为左侧菜单栏、中间可以移动的分隔栏、右面的主界面:



    <!--  Main区域  -->

    <Grid x:Name="GridMain" Background="{StaticResource CloudDrawingBrush}">

        <Grid.RowDefinitions>

            <RowDefinition Height="*" />

        </Grid.RowDefinitions>

        <Grid.ColumnDefinitions>

            <ColumnDefinition Width="3.3*" MinWidth="200" />

            <ColumnDefinition Width="Auto" />

            <ColumnDefinition Width="6.6*" />

        </Grid.ColumnDefinitions>

</Grid>

现在我们要实现一个左侧树形的菜单栏，我们使用的是WPF里面的TreeView控件进行实现这样一个功能，下面是相关代码：



        <DockPanel Grid.Row="0" Grid.Column="0">

            <hc:SimplePanel>

                <Border

                    Margin="5,5,0,5"

                    Background="{DynamicResource RegionBrush}"

                    CornerRadius="{Binding CornerRadius}">

                    <Grid

                        Height="Auto"

                        Margin="5"

                        Background="Transparent">

                        <TextBox x:Name="HidSelectDatabase" Visibility="Hidden" />

                        <Grid>

                            <Grid.ColumnDefinitions>

                                <ColumnDefinition Width="8*" />

                                <ColumnDefinition Width="1*" MinWidth="30" />

                            </Grid.ColumnDefinitions>

                            <ComboBox

                                x:Name="SelectDatabase"

                                Height="30"

                                VerticalAlignment="Top"

                                HorizontalContentAlignment="Stretch"

                                hc:BorderElement.CornerRadius="5"

                                hc:InfoElement.Placeholder="请选择数据库"

                                Cursor="Hand"

                                IsTextSearchEnabled="True"

                                SelectionChanged="SelectDatabase_OnSelectionChanged"

                                Style="{StaticResource ComboBoxExtend}"

                                Text="{Binding DbName}">

                                <ComboBox.ItemTemplate>

                                    <DataTemplate>

                                        <StackPanel VerticalAlignment="Center" Orientation="Horizontal">

                                            <Image

                                                Width="11"

                                                Height="15"

                                                Source="/SmartSQL;component/Resources/Img/dataBase.ico" />

                                            <TextBlock

                                                Margin="5,0,0,0"

                                                HorizontalAlignment="Center"

                                                VerticalAlignment="Center"

                                                Text="{Binding DbName}" />

                                        </StackPanel>

                                    </DataTemplate>

                                </ComboBox.ItemTemplate>

                            </ComboBox>

                            <Button

                                Name="BtnFresh"

                                Grid.Column="2"

                                Margin="0,0,0,0"

                                Padding="4"

                                VerticalAlignment="Top"

                                Background="Transparent"

                                BorderThickness="0"

                                Click="BtnFresh_OnClick"

                                Cursor="Hand">

                                <Button.Content>

                                    <Image Source="/SmartSQL;component/Resources/Img/Refresh.png" Stretch="Fill" />

                                </Button.Content>

                            </Button>

                        </Grid>

                        <hc:SearchBar

                            x:Name="SearchMenu"

                            Height="30"

                            Margin="0,34,0,0"

                            Padding="5,0,5,0"

                            VerticalAlignment="Top"

                            HorizontalContentAlignment="Stretch"

                            hc:BorderElement.CornerRadius="5"

                            hc:InfoElement.Placeholder="搜索数据表/视图/存储过程"

                            FontSize="13"

                            ShowClearButton="True"

                            Style="{StaticResource SearchBarPlus}"

                            TextChanged="SearchMenu_OnTextChanged" />

                        <TabControl

                            x:Name="TabLeftType"

                            Margin="0,65,0,40"

                            SelectionChanged="TabLeftType_OnSelectionChanged"

                            Style="{StaticResource TabControlInLine}">

                            <TabItem

                                x:Name="TabAllData"

                                Cursor="Hand"

                                Header="全部"

                                IsSelected="True" />

                            <TabItem

                                x:Name="TabGroupData"

                                Cursor="Hand"

                                Header="分组"

                                IsSelected="False" />

                            <!--<TabItem

                                x:Name="TabFavData"

                                Cursor="Hand"

                                Header="收藏"

                                IsSelected="False" />-->

                        </TabControl>

                        <TreeView

                            x:Name="TreeViewTables"

                            Margin="0,100,0,0"

                            VerticalAlignment="Top"

                            BorderThickness="0"

                            ItemsSource="{Binding TreeViewData}"

                            SelectedItemChanged="SelectedTable_OnClick">

                            <TreeView.ItemContainerStyle>

                                <Style BasedOn="{StaticResource TreeViewItemBaseStyle}" TargetType="{x:Type TreeViewItem}">

                                    <Setter Property="IsExpanded" Value="{Binding IsExpanded}" />

                                    <Setter Property="FontWeight" Value="{Binding FontWeight}" />

                                    <Setter Property="FontSize" Value="12" />

                                    <Setter Property="Visibility" Value="{Binding Visibility}" />

                                    <Setter Property="Foreground" Value="{Binding TextColor}" />

                                    <Setter Property="Cursor" Value="Hand" />

                                    <!--  禁止水平滚动条自动滚动  -->

                                    <EventSetter Event="RequestBringIntoView" Handler="EventSetter_OnHandler" />

                                    <Style.Triggers>

                                        <Trigger Property="IsSelected" Value="True">

                                            <Setter Property="FontWeight" Value="Bold" />

                                        </Trigger>

                                    </Style.Triggers>

                                </Style>

                            </TreeView.ItemContainerStyle>

                            <TreeView.ContextMenu>

                                <!--  右键菜单  -->

                                <ContextMenu Visibility="Visible">

                                    <MenuItem

                                        x:Name="MenuSelectedItem"

                                        Padding="5,0,5,0"

                                        VerticalAlignment="Center"

                                        Click="MenuSelectedItem_OnClick"

                                        Cursor="Hand"

                                        Header="复制对象名" />

                                </ContextMenu>

                            </TreeView.ContextMenu>

                            <TreeView.ItemTemplate>

                                <HierarchicalDataTemplate DataType="{x:Type models:TreeNodeItem}" ItemsSource="{Binding Children}">

                                    <StackPanel Orientation="Horizontal">

                                        <svgc:SvgViewbox

                                            Width="12"

                                            Height="12"

                                            Margin="0,0,5,0"

                                            HorizontalAlignment="Left"

                                            Source="{Binding Icon}" />

                                        <TextBlock

                                            VerticalAlignment="Center"

                                            FontSize="12"

                                            Text="{Binding DisplayName}"

                                            ToolTip="{Binding DisplayName}" />

                                    </StackPanel>

                                </HierarchicalDataTemplate>

                            </TreeView.ItemTemplate>

                        </TreeView>

                        <Grid

                            x:Name="NoDataText"

                            Margin="0,100,0,5"

                            HorizontalAlignment="Stretch"

                            Background="White"

                            Cursor="Arrow">

                            <local:NoDataArea

                                x:Name="NoDataAreaText"

                                Margin="0"

                                HorizontalAlignment="Center"

                                ShowType="All" />

                        </Grid>

                        <Grid

                            Margin="0"

                            VerticalAlignment="Bottom"

                            Visibility="Hidden">

                            <Grid.ColumnDefinitions>

                                <ColumnDefinition Width="4*" />

                                <ColumnDefinition Width="6*" />

                                <ColumnDefinition Width="Auto" />

                            </Grid.ColumnDefinitions>

                            <Grid>

                                <ComboBox

                                    x:Name="CbTargetConnect"

                                    Height="26"

                                    VerticalAlignment="Bottom"

                                    HorizontalContentAlignment="Left"

                                    hc:InfoElement.Placeholder="目标连接"

                                    Cursor="Hand"

                                    DisplayMemberPath="ConnectName"

                                    IsTextSearchEnabled="True"

                                    SelectedValuePath="DbMasterConnectString"

                                    SelectionChanged="CbTargetConnect_OnSelectionChanged"

                                    Style="{StaticResource ComboBoxExtend}" />

                            </Grid>

                            <Grid Grid.Column="1" Margin="5,0,0,0">

                                <ComboBox

                                    x:Name="CbTargetDatabase"

                                    MinWidth="50"

                                    VerticalAlignment="Bottom"

                                    HorizontalContentAlignment="Left"

                                    hc:InfoElement.Placeholder="目标数据库"

                                    Cursor="Hand"

                                    IsTextSearchEnabled="True"

                                    Style="{StaticResource ComboBoxExtend}" />

                            </Grid>

                            <Grid Grid.Column="2">

                                <!--  差异比较按钮  -->

                                <Button

                                    x:Name="BtnCompare"

                                    Height="30"

                                    Margin="5,5,0,0"

                                    HorizontalAlignment="Right"

                                    hc:BorderElement.CornerRadius="6"

                                    hc:IconElement.Geometry="{StaticResource CompareGeometry}"

                                    Click="BtnCompare_OnClick"

                                    Content="差异比较"

                                    Cursor="Hand" />

                            </Grid>

                        </Grid>

                        <!--  数据加载Loading  -->

                        <hc:LoadingLine

                            x:Name="LoadingLine"

                            Margin="0,0,0,0"

                            Visibility="Collapsed" />

                    </Grid>

                </Border>

            </hc:SimplePanel>

        </DockPanel>

在这里我没有详细介绍底层c#的相关代码，里面逻辑有些复杂感兴趣的可以去我的开源项目中学习。在上面的左侧菜单代码中，我们使用的不仅有TreeView控件、也有ContextMenu、hc:LoadingLine等控件，还有自己写的自定义控件。

其实WPF要比WinForm好用不少，不仅支持MVVM数据绑定还支持灵活的页面渲染，自从用了WPF再也不用WinForm了。

今天分享暂时到这里，下一篇讲介绍DataGrid表格数据绑定及相关条件搜索。下面是工具的开源地址，感兴趣的可以Clone下来学习一下。码砖不易，喜欢的麻烦点下Star.

开源地址

https://gitee.com/izhaofu/SmartSQL

基于WPF重复造轮子，写一款数据库文档管理工具（一）的更多相关文章

  1. 如何基于WPF写一款数据库文档管理工具（二）

    系列目录 基于WPF重复造轮子,写一款数据库文档管理工具(一) 本篇重点 上次发表了基于WPF重复造轮子,写一款数据库文档管理工具(一) 得到不少人支持,文章一度上到了博客园推荐表首页,看来大家对这个 ...

  2. 基于Mybatis的Mysql数据库文档生成工具，支持生成docx（原创）

    今天不写android--也写写数据库相关的东西 -------------------- 今日老夫闲来无事,设计了一款数据库文档生成工具 眼下仅仅支持mysql 主要是生成docx的 下载链接:下载 ...

  3. GitHub Android 最火开源项目Top20 GitHub 上的开源项目不胜枚举，越来越多的开源项目正在迁移到GitHub平台上。基于不要重复造轮子的原则，了解当下比较流行的Android与iOS开源项目很是必要。利用这些项目，有时能够让你达到事半功倍的效果。

    1. ActionBarSherlock(推荐) ActionBarSherlock应该算得上是GitHub上最火的Android开源项目了,它是一个独立的库,通过一个API和主题,开发者就可以很方便 ...

  4. Quartz：不要重复造轮子，一款企业级任务调度框架。

    背景 第一次遇到定时执行某些任务的需求时,很多朋友可能设计了一个小类库,这个类图提高了一个接口,然后由调度器调度所有注册的接口类型,我就是其中之一,随着接触的开源项目越来越多,我的某些开发习惯受到了影 ...

  5. 推荐几款API文档集合工具

    https://zealdocs.org/    开源.免费,支持Linux.Windows http://velocity.silverlakesoftware.com/  https://kape ...

  6. 一款对Postman支持较好的接口文档生成工具

    最近要编写接口文档给测试和前端看,通过网上查阅资料,也认识了很多款接口文档生成工具,比如易文档.ApiPost.ShowDoc.YApi.EoLinker.DOClever.apizza等,通过对这几 ...

  7. 重复造轮子系列——基于FastReport设计打印模板实现桌面端WPF套打和商超POS高度自适应小票打印

    重复造轮子系列——基于FastReport设计打印模板实现桌面端WPF套打和商超POS高度自适应小票打印 一.引言 桌面端系统经常需要对接各种硬件设备,比如扫描器.读卡器.打印机等. 这里介绍下桌面端 ...

  8. 重复造轮子系列——基于Ocelot实现类似支付宝接口模式的网关

    重复造轮子系列——基于Ocelot实现类似支付宝接口模式的网关 引言 重复造轮子系列是自己平时的一些总结.有的轮子依赖社区提供的轮子为基础,这里把使用过程的一些觉得有意思的做个分享.有些思路或者方法在 ...

  9. 重复造轮子，编写一个轻量级的异步写日志的实用工具类（LogAsyncWriter）

    一说到写日志,大家可能推荐一堆的开源日志框架,如:Log4Net.NLog,这些日志框架确实也不错,比较强大也比较灵活,但也正因为又强大又灵活,导致我们使用他们时需要引用一些DLL,同时还要学习各种用 ...

随机推荐

  1. 项目完成小结 - Django3.x版本 - 开发部署小结 (2)

    前言 好久没更新博客了,最近依然是在做之前博客说的这个项目:项目完成 - 基于Django3.x版本 - 开发部署小结 这项目因为前期工作出了问题,需求没确定好,导致了现在要做很多麻烦的工作,搞得大家 ...

  2. 题解0012：剪花布条（KMP）

    信奥一本通1465 KPM例题 题目链接:http://ybt.ssoier.cn:8088/problem_show.php?pid=1465 题目描述:给出花布条和小饰条(字符串),求花布条中能剪 ...

  3. vue大型电商项目尚品汇（前台篇）day01

    学完vue2还是决定先做一个比较经典,也比较大的项目来练练手好一点,vue3的知识不用那么着急,先把vue2用熟练了,vue3随时都能学. 这个项目确实很经典包含了登录注册.购物车电商网站该有的都有, ...

  4. 【低码】asp.net core 实体类可生产 CRUD 后台管理界面

    前言介绍 喜欢小规模团队的＂单打独斗＂,有的时候即使在大公司,也经常做着3-5个人团队的小项目,相信很多人有类似的经历. 本文介绍如何将项目中已存在的[实体类],直接生产出 CRUD 后台管理界面. ...

  5. 使用Go实现健壮的内存型缓存

    使用Go实现健壮的内存型缓存 本文介绍了缓存的常见使用场景.选型以及注意点,比较有价值. 译自:Implementing robust in-memory cache with Go 内存型缓存是一种 ...

  6. 130_传析阅管理系统accdb64位版本

    博客:www.jiaopengzi.com 焦棚子的文章目录 请点击下载附件 几年前笔者针对家居门店的进销存.人员管理.工资管理.任务系统.门店经营盈亏管理.销售分析.考勤请假等息息相关的业务基于Ac ...

  7. MongoDB启动报错：Unrecognized option: storage try 'mongod --help' for more information（已解决）

    问题说明: 今天在使用配置文件方式启动MongoDB时,一直启动失败,报错显示:Unrecognized option: storage try 'mongod --help' for more in ...

  8. 个人冲刺（五）——体温上报app（二阶段）

    冲刺任务:完成用户登录和随机验证码功能 loginActivity.java package com.example.helloworld; /** * 纯粹实现登录注册功能,其它功能都被注释掉了 * ...

  9. github新项目npm错误

    当我们从GitHub或者别人那里拿到项目的时候,一般都是要先npm install 进行安装依赖.但是难免会遇到报错. 出现问题1: 解决方案:清除缓存npm cache clear --force之 ...

  10. 一个 curl 配置引发的惨案

    问题 这两天想装新版本的 node,发现 nvm 一直报下面这个错误.我反复 Google 了,但是并没有找到一条我能用的. 痛苦 我起初一直怀疑是我用的 zsh-nvm 抽疯,所以今天有空就把它还有 ...