Ionic自動添加圖標icon和啟動頁splash的python腳本

越來越不喜歡繁重的開發框架和大容量的插件包. 所以往往會選擇更應手的工具來開發一些小的應用.

所以這里來談談跨平臺APP開發工具 Ionic.

閱讀此文收獲:

1) 獲得Ionic添加Icon和啟動頁的方法

2)獲得Ionic自動添加Icon和啟動頁Splash的python腳本

3)提供開發效率, 節省您寶貴的時間.

一. 開篇.

我們在使用Ionic開發Android應用,IOS應用很大一部分原因就是高效,低成本. 但是這款高效的開發框架下也有些不如人意的地方, 比如:當我們用ionic創建好app后,默認的logo及spash頁面均是cordova的圖標,顯的不太好看,如何使用自己的icon和splash頁呢?

接下來我們來談談如果制作Ionic APP的啟動頁和Icon.

1.1 制作基礎的Icon文件.

這里推薦您制作512px x 512px的Icon文件. 并且可以使用自動圓角工具來生成圓角logo文件.

Atool自動透明圓角制作工具: http://www.atool.org/roundcorner.php

PS制作好的icon文件放置到 工程目錄/resources 目錄下并命名為icon.png

運行命令,生成不同平臺的icon。

ionic resources --icon

運行命令后,會發現生成了一系列的不同尺寸的圖片,并且在config.xml中會有想應尺寸圖片的配置.

1.2 添加啟動畫面

1.2.1 生成一張1024x1024 px的splash圖片,保存為splash.png,

1.2.2 在ionic工程根目錄下有一個resources的目錄,將創建好的splash.png圖片放在這個目錄下。

執行如下命令, 添加啟動畫面插件

ionic plugin add cordova-plugin-splashscreen

1.2.3 運行命令,生成不尺寸大小的splash

$ ionic resources --splash

到此時, 我們就已經生成好了 Icon文件和啟動屏幕文件, 接下來需要做的就copy到android/IOS 工程里面對應的目錄中,

對應目錄: Ionic工程目錄/platform/android/res/mipmap-hdpi


PS: 根據不同文件, 放到不同文件夾. 這里是需要手工操作的, 比較麻煩, copy過去還需要修改文件, 我們來自動化的實現這部

再重新打包就可以使用我們新生成的icon文件了


二, 自動化

上面講解了 如果制作icon 和splash文件, 但是需要手工來復制文件到android工程中,比較浪費時間.

接下來采用Python腳本幫我們自動生成文件

效果圖如下:


自動生成好的各種尺寸的icon圖標
自動化腳本執行示意圖


執行后,在工程目錄里生成好的icon文件


腳本下載地址:

Ionic自動生成icon的python腳本

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容