我正在尝试复活消失的Android SDK GUI，并使用Electron进行操作
从Android SDK Tools v25版本开始，官方的GUI工具android(android.bat)已经被弃用了，当试图启动时会显示一条消息，建议使用CUI的sdkmanager！如果使用GUI，则应该使用Android Studio！个人而言，为了操作SDK而特地打开Android Studio感到相当麻烦，所以官方的GUI工具非常方便…
做出不存在的东西来。
因此，我决定尝试自己制作GUI。
制作中的东西
正在GitHub上公开。
安卓软件开发工具包图形用户界面（Android SDK GUI）
说实话，现在（0.0.2版本）的功能还不如Android Studio。
最低目标是实现与官方GUI几乎相同的易用性，如果能够增加良好的可视性和排序等功能就好了。
技术选择
首先作为工具必须至少掌握以下几点。
-
- Android SDKを操作できる
-
- ツールからローカルにあるsdkmanagerを実行できるようにしなければなりません。Webブラウザアプリではだめということですね。
-
- クロスプラットフォームに対応できる
- Windows、mac共にGUIツールが非推奨となってしまったので、両方に対応する必要があります。
考虑到这两个因素，我们选择了Electron作为既能够满足要求又能够受益于较新的开发方法的解决方案。
如果使用Electron，您可以运行本地的可执行文件，并且轻松适应跨平台。您还可以使用最新的Web技术。
由于我目前正在学习Angular，所以决定用Angular来编写Web前端。
使用electron-forge模块
虽然近期网络方面的混乱让人有些焦虑，但我还是尽可能地专注于编写代码。 我寻找了一些能够解决麻烦事的工具，最终找到了electron-forge，并决定使用它。
如果使用 Electron Forge，它会帮助完成从创建初始项目到开发模式运行（包括热重载），再到打包的全部过程。
还有 Angular 作为项目模板，非常适合（当然也有 React 和 Vue）。
在Angular的情况下，您可以使用此命令创建项目。
npm install -g electron-forge
electron-forge init my-new-project --template=angular2
cd my-new-project
electron-forge start
其余的则是像平常一样用Angular来进行Web开发，直接写代码就行。
不同之处在于可以导入child-process之类的模块。通过使用child-process，可以执行本地文件。
在创建项目之后做的事情最好是什么？
升级Angular的版本
首先，将Angular版本升级到最新版。打开package.json文件，将以@angular开头的内容更新到最新版本。
{
"@angular/common": "^4.3.5",
"@angular/compiler": "^4.3.5",
"@angular/core": "^4.3.5",
"@angular/platform-browser": "^4.3.5",
"@angular/platform-browser-dynamic": "^4.3.5"
}
添加@angular/router
如果在应用程序内进行页面跳转，需要在Angular中添加路由库。
npm install @angular/router --save
接下来，我们将写入路由信息。通常情况下，我们会使用HTML5的HistoryAPI来重写URL。但是，当重新加载页面时，只会有index.html，导致会出现404错误。因此，我们将更改路由方法，不再使用HistoryAPI，而是在URL后面添加哈希(#)。通过设置useHash: true，可以进行这个更改。
import { RouterModule, Routes } from '@angular/router';
.
.
.
const routes: Routes = [
{ path: '', redirectTo: 'sdk', pathMatch: 'full' },
{ path: 'avd', component: AvdComponent },
{ path: 'sdk', component: SdkComponent },
{ path: 'setting', component: SettingComponent }
];
@NgModule({
imports: [RouterModule.forRoot(routes, { useHash: true })],
exports: [RouterModule]
})
export class AppRoutingModule {}
只要加载创建的模块，就完成了。
import { AppRoutingModule } from './approuting.module.ts';
@NgModule({
imports: [
AppRoutingModule,
BrowserAnimationsModule,
.
.
.
最后
由于 Electron + Angular 的组合能够实现所需功能，并能够通过新的开发方法进行开发，所以 electron-forge 看起来相当不错。
只是不使用webpack或其他的打包工具，似乎是直接以TypeScript编写并执行的感觉。
我担心在应用程序运行时需要手动进行每次编译的性能问题，但就目前我开发的部分来看，似乎没有太大的问题。
