安装包UI美化之路-nsNiuniuSkin安装包制作可视化配置向导
这篇文章应该说是上一篇《安装包UI美化之路-nsNiuniuSkin安装包制作配置说明》的延伸，在python命令行接口的基础上，支持可视化的配置界面与说明！
一直以来，nsNiuniuSkin都将自己定位为一个用于快速集成进自动化打包流程中的安装包制作解决方案，立足于为用户提供良好的集成接口上；随着我们python命令行脚本的正式上线，结合我们既有的各种安装包能力，这部分工作已经圆满完成。
然而在我们的客户中，还有很多学生、个人开发者、网页前端开发者(Electron)、后台开发者等等，真正专职做Windows桌面软件开发的用户占比还是比较小的，而上述用户，由于自身工作环境，对于NSIS安装包制作的配置相对陌生，经常会出现看了我们的说明依旧不清楚应该如何配置的情况。
现在到了该考虑如何让更多的用户更快上手的时候了。
为了让所有用户都能够对nsNiuniuSkin安装包制作解决方案的配置过程有一个清楚的理解，我们专门开发了一个可视化的配置向导，以可视化的界面呈现，帮助用户在众多配置参数中找到对应要修改的参数；使用nsNiuniuSkin安装包制作可视化配置向导，可以快速生成安装包打包脚本，编译出安装包；同时借助配置的过程，更好地理解我们命令行脚本的意义，更有助于快速集成进用户环境的自动化编译与打包流程中！
nsNiuniuSkin安装包制作可视化配置向导界面
可以看到，整个向导界面分为三个区域：
- 配置项管理
- 控制参数设置区
- 自定义宏设置区
接下来我们将分别针对这三部分配置进行逐一说明。
nsNiuniuSkin安装包制作可视化配置向导配置参数说明
配置项管理
nsNiuniuSkin可视化向导支持同时管理多个配置，比如一个配置是打包海浪风格的，可以再新建一个配置，来打包高山风格的模板；同时可以对既有模板进行复制、重命名、删除等操作。
控制配置
控制配置的各个参数，并不是要直接传递给NSIS，而是在我们的python打包脚本中，进行实际打包前的一些逻辑控制，比如说代码签名、编译打包Electron等等；指定正确的参数，便能准确的控制整个打包流程的行为。
| 控件名称 | 用途 | 备注 |
|---|---|---|
| 项目名称 | 您购买的模板资源所保存的目录名称，如：leeqia_simple | 此时点击加载nsi默认配置，会从soft_setup.nsi中读取默认配置 |
| 打包模式 | 要打的安装包类型及压缩方式 | 7z：先压缩成app.7z，再进行打包 nozip：直接使用nsis打包 online：打在线安装包 |
| 是否签名 | 打包过程中是否对卸载程序和安装包程序进行签名 | 如果选择添加签名，还需要在Sign目录下配置好签名证书 |
| 本地文件目录名 | 在打包目录下用于存放待打包文件的目录名，默认是FilesToInstall | 建议不要修改此值 |
| 源目录 | 这是一个可选配置，如果配置了，我们将会在打包前将此路径下的所有文件复制到FilesToInstall | 如果开启了Electron打包则此配置不生效 |
| 卸载文件名 | 安装包中卸载程序的名称 | 默认为uninst.exe |
| 是否打包Electron | 表示是否是要打包Electron程序 | 如果是，则会在打包前调用npm build run指令来生成，并将生成的unpacked files下的文件复制到FilesToInstall来 同时，我们还会复制Electron项目目录下的package.json中的软件名称、版本号、guid等字段 |
| Electron项目路径 | 开启Electron打包时，指定Electron项目的位置 | electron-builer打包配置文件package.json所在路径 |
| 是否生成latest.xml | 是否打包完成后，生成用于electron-updater的latest.xml | latest.xml中包含安装包文件名、版本号以及安装包的sha512的值 |
值得注意的事，有多个参数与是否是Electron打包相关联，总体的原则是：
- 如果您是希望以我们的脚本作为Electron程序的打包入口，那么请把Electron打包开关打开，同时配置好相关的参数
- 如果您打入的入口不是我们的脚本，而只是把我们的脚本作为打包过程中的一环，那么请不要打开Electron开关，而是通过其他参数指定好要打包的配置
自定义宏配置
自定义的宏，每一个都有一个默认值，他们定义在soft_setup.nsi文件中；如果在界面上配置了相应的参数，则不再使用soft_setup.nsi中的默认值，达到安装包参数个性化配置的目的。
| 控件名称 | 用途 | 备注 |
|---|---|---|
| 产品名称 | 您要打包的产品的产品名称，如： 利洽截图控件 |
|
| 英文产品名称 | 您要打包的产品的英文产品名称，如： Leeqia ScreenCapture |
多语言场景下使用，如果您新增加了新的语言，请在soft_setup.nsi中添加 |
| 安装包名称 | 最终打出来的安装包的文件名，如： Watercurtain_Setup_v2.5.0.exe |
如果开启Electron打包，将会以package.json中配置的name值来生成 |
| 产品版本号 | 产品版本号，如： 2.5.0.0 |
如果开启Electron打包，将会以package.json中配置的version值来使用 |
| 主程序名 | 主程序exe的名称，如： 牛牛截图.exe |
如果开启Electron打包，将会以package.json中配置的{name}.exe值来生成 |
| 扩展路径名称 | 安装时要追加的文件夹名称，如： Leeqia_Capture |
扩展文件夹是为了安装的文件都在我们特定的目录下 |
| 软件安装注册表标识 | 在注册表中，安装信息保存的位置，如： [HKEY_LOCAL_MACHINE\SOFTWARE\Wow6432Node\Leeqia_Capture] "InstPath"="C:\Program Files (x86)\Leeqia_Capture" |
如果开启Electron打包，将会以package.json中的guid来使用 |
| 安装路径注册表Key | 在注册表中，安装路径保存的位置，如： [HKEY_LOCAL_MACHINE\SOFTWARE\Wow6432Node\Leeqia_Capture] "InstPath"="C:\Program Files (x86)\Leeqia_Capture" |
如果开启Electron打包，请使用InstallLocation |
| 默认安装路径 | 安装包首次打开时，默认的安装路径： $PROGRAMFILES32${INSTALL_APPEND_PATH} |
需要结合是否是安装到所有用户下，以及安装包执行权限来决定默认路径 |
| 在线包下载基地址 | 做在线安装时时，数据包下载的基础路径，如： http://www.ggniu.cn/test_online_install/ |
需要将生成的app.7z和config.ini放到服务器对应目录下 |
| 版权信息 | 显示在安装包详细信息中的信息，如： Leeqia Copyright（c）2020 |
|
| 发布者信息 | 显示在安装包详细信息中的信息，如： Leeqia |
|
| 默认是否 创建快捷方式 |
界面上的创建快捷方式复选框是否自动选中 | 可在安装时调整 |
| 默认是否 添加开机启动 |
界面上的添加开机启动复选框是否自动选中 | 可在安装时调整 |
| 安装包执行权限 | 是否以管理员权限启动安装包：admin/user | 如果选择管理员权限，建议安装到所有用户下， 同时默认安装路径选择独立于某个用户的目录 |
| 安装到当前用户 还是所有用户 |
安装到当前用户还是所有用户：all/current | 如果选择管理员权限，建议安装到所有用户下， 同时默认安装路径选择独立于某个用户的目录 |
自定义配置宏中，有多个参数相互关联，比如默认安装位置、安装包执行权限、是否安装到所有用户：
- 如果安装到所有用户下，那么需要开启安装包管理员执行权限，同时默认安装路径请选择与特定用户无关的路径
- 如果安装到当前用户下，那么建议不要开启管理员权限，默认安装路径建议选择： $APPDATA${INSTALL_APPEND_PATH} 或 $LOCALAPPDATA${INSTALL_APPEND_PATH}
从nsi复制默认配置项
在设置好项目名称后(假定名称是leeqia_simple)，点击此按钮，将会从.\SetupFiles\leeqia_simple\soft_setup.nsi中读取如下宏定义的值，显示到界面中：
# ====================== 自定义宏 产品信息==============================
!define /ifndef PRODUCT_NAME "利洽科技截图控件" #产品名称
!define /ifndef PRODUCT_NAME_EN "Leeqia ScreenCapture" #英文产品名称
!define /ifndef PRODUCT_PATHNAME "Leeqia_Capture" #安装与卸载项用到的KEY，与Electron中的guid相同
!define /ifndef INSTALL_APPEND_PATH "Leeqia_Capture" #安装路径追加的名称
!define /ifndef INSTALL_DEFALT_SETUPPATH "$PROGRAMFILES32\${INSTALL_APPEND_PATH}" #默认生成的安装路径
!define /ifndef EXE_NAME "牛牛截图.exe" #主程序EXE文件名
!define /ifndef PRODUCT_VERSION "2.5.0.0" #版本号
!define /ifndef PRODUCT_PUBLISHER "Leeqia" #发布者
!define /ifndef PRODUCT_LEGAL "Leeqia Copyright（c）2020" #版权信息
!define /ifndef INSTALL_MODE_ALL_USERS "all" # all current，是否安装到所有用户，默认为是，会影响注册表、快捷方式、开始菜单等
!define /ifndef INSTALL_EXECUTION_LEVEL "admin" # 如果INSTALL_MODE_ALL_USERS使用current，则此处请同步改成user (RequestExecutionLevel none|user|highest|admin)
!define /ifndef INSTALL_OUTPUT_NAME "Test_PC_Setup_v2.5.0.exe" #默认的安装包名称，在bat中控制传入
!define /ifndef INSTALL_LOCATION_KEY "InstPath" #默认的注册表中安装位置的key值
# ====================== 以下宏用于控制特定的行为 ==============================
!define /ifndef INSTALL_DEFAULT_AUTORUN 0 #默认是否自动开机启动
!define /ifndef INSTALL_DEFAULT_SHOTCUT 0 #默认是否添加快捷方式
!define /ifndef TEST_SLEEP 1 #测试安装过程中的延时开关，方便查看进度变化和轮播图，实际使用，请改成0
!define /ifndef INSTALL_DOWNLOAD_BASEURL "http://www.ggniu.cn/test_online_install/"
# ====================== 上述具体的宏定义均可以在pre_define.nsh文件中预先定义，可任意指定为其他的值 ==============================
底部功能按钮
| 按钮名称 | 按钮用途 |
|---|---|
| 保存配置及脚本 | 根据当前的配置名称以及配置内容，保存到对应的json文件中；同时生成一个bat文件，其中包含生成的打包命令行参数 |
| 生成安装包 | 保存配置及脚本，紧接着调用生成的bat脚本，生成安装包 |
| 运行安装包 | 根据当前的配置名称以及配置内容，将打好的安装包运行起来 |
| 打开UI调试器 | 通过浏览器打开：安装包UI美化之路-nsNiuniuSkin界面在线设计引擎_深圳市利洽科技有限公司 此时还会默认将对应项目名称下的skin目录的路径复制到剪贴板，方便在页面中粘贴使用 |
nsNiuniuSkin安装包制作可视化配置向导实际操作演示
以下操作流程流程，展示了如何新建立一个配置，然后从此配置复制出来另外一个配置并进行打包的流程：
-
执行gui_package.bat，打开配置向导
-
输入配置名: leeqia_simple_gui，点击新建配置
-
在项目名称中输入 leeqia_simple，点击从nsi加载默认配置 这一步将会从leeqia_simple模板目录下的nsi文件中soft_setup.nsi文件中读取各个宏的默认值，以帮忙您做好初始化配置，在此之后可以在界面上执行您想要的各种修改
-
点击保存配置与脚本 此时将根据界面上的项目名称，以及选择的打包模式，生成generate_leeqia_simple_nozip.bat脚本，脚本中包含了根据向导生成的如何调用package.py的命令行参数，内容如下：
chcp 65001 python package.py --project_name="leeqia_simple" --package_mode=2 --need_sign=False --build_for_electron=False --generate_latest_file=False --files_toinstall_name="FilesToInstall" --uninst_file_name="uninst.exe" --PRODUCT_NAME="利洽科技截图控件" --PRODUCT_NAME_EN="Leeqia ScreenCapture" --INSTALL_OUTPUT_NAME="Test_PC_Setup_v2.5.0.exe" --PRODUCT_VERSION="2.5.0.0" --EXE_NAME="牛牛截图.exe" --INSTALL_LOCATION_KEY="InstPath" --INSTALL_APPEND_PATH="Leeqia_Capture" --PRODUCT_PATHNAME="Leeqia_Capture" --INSTALL_DEFALT_SETUPPATH="$PROGRAMFILES32\${INSTALL_APPEND_PATH}" --INSTALL_DEFAULT_SHOTCUT=1 --INSTALL_DEFAULT_AUTORUN=0 --INSTALL_EXECUTION_LEVEL="admin" --INSTALL_MODE_ALL_USERS="all" --INSTALL_DOWNLOAD_BASEURL="http://www.ggniu.cn/test_online_install/" --PRODUCT_LEGAL="Leeqia Copyright（c）2020" --PRODUCT_PUBLISHER="Leeqia" --TEST_SLEEP=0 chcp 936执行脚本generate_leeqia_simple_nozip.bat脚本，即可直接生成相应的安装包；同时，借助这个pycakge.py的命令行参数内容，您可以直接集成到您的自动化打包流程中，只需要将个别参数进行进一步动态传入即可（比如版本号每次打包时传入）。
-
在配置名称处输入leeqia_mountain_gui，点击复制配置 此时从leeqia_simple_gui的配置复制出来一个新的配置项，您需要修改项目名称为leeqia_mountain（当然也可以对其他参数进行修改），点击保存，即可生成打包高山模板的脚本了
-
点击生成安装包，稍做等待，即可完成高山模板的安装包打包
以上流程全程可视化操作，无需任何的开发基础，相信对所有用户都有帮助！以下是实际操作的gif录屏：
nsNiuniuSkin安装包制作可视化配置向导实现原理及注意事项
在配置项管理中，一个配置项对应于一个json配置文件，用于记录这个配置项中各个配置参数；比如leeqia_simple_gui，对应于打包目录下的leeqia_simple_gui.json；可视化配置向导会遍历打包脚本目录下的json文件，加载到界面中予以展示与控制。
配置向导上的每一个配置，我们最终都转换成python的命令行参数，保存在生成的bat文件中；出于用户后续可能需要对可视化向导进行自行扩展的考虑，我们没有采用c++来实现这个向导，而是采用python脚本进行实现，开放代码，依托tkinter来做可视化展示，您后续可以自行扩展此配置向导，增加您想要的更多功能！
可视化向导不仅仅是一个nsNiuniuSkin的辅助打包工具，也是一份比较简单的利用python开发跨平台桌面程序的不错的Demo！如果您在看了我们的可视化配置向导的所有代码后，能够对您未来自己开发一些简单的小工具有一些帮助的话，那将是我们最大的荣幸！
注：
- 要运行本可视化向导，您的电脑上需要安装python3
- 要运行本可视化向导，您的电脑上需要安装tkinter模块，安装方式：命令行中输入 npm install tk
- 手工配置tkinter的界面太费事，我们采用了https://www.pytk.net/tkinter-helper/来配置界面
结语
nsNiuniuSkin可视化配置向导中的各个参数，均是与package.py中的命令行参数一一对应的，希望有了它，能够提高您的配置效率与准确性。
在安装包安装过程中，精美的UI往往能让客户对所安装产品的印象更加深刻，更能体现出软件服务商在用户体验上的专注与用心！ 希望我们的努力，能够让安装包制作再容易一点，再快乐一点！
愿天下没有难做的安装包！