圖標的圓角和光暈效果
創(chuàng)新互聯主營咸豐網站建設的網絡公司,主營網站建設方案,成都App制作,咸豐h5重慶小程序開發(fā)搭建,咸豐網站營銷推廣歡迎咸豐等地區(qū)企業(yè)咨詢
1.圖標的圓角效果是系統自動加上的，且是我們無法控制的。
2.光暈效果雖然也是系統加上的，但可以通過程序中設置app的光暈參數UIPrerendedIcon來是否需要內建光暈效果。
方法：在info.plist里面添加一條記錄UIPrerenderedIcon，新版的XCODE 會自動識別為Icon already includes gloss effects 打上勾就OK了。如果沒有識別的右邊欄寫上YES就可以。
啟動畫面
雖然蘋果建議開發(fā)者使用app的“空白”界面作為啟動畫面。但若要讓啟動畫面顯得漂亮，可先讓app的界面漂亮；App的界面漂亮，那app的“空白”界面也漂亮；App的“空白”界面漂亮，那啟動畫面也就漂亮了。
Retina
iPhone4和ipod Touch4有一個新特性：在屏幕尺寸不變的前提下，分辨率提升一倍（320x480=640x960）。此特性蘋果命名為Retina。
因此如果app要支持Retina，就要提供分辨率寬高各增一倍的圖片，且為了兼顧沒有Retina的設備，原來低分辨率的圖片仍然要提供 。針對不同分辨率的相同圖片，蘋果規(guī)定的命名規(guī)則是：高分辨率的文件名比普通分辨率的文件名多“@2x”字樣。
格式和尺寸
圖標和啟動畫面的圖片格式：推薦使用PNG格式，可以是標準的24位色，外加alpha通道的8位。不要在app圖標上使用透明色。
圖標的尺寸：蘋果有一份完整的文檔，列出了app所需的全部圖標尺寸，和其各自的使用環(huán)境。
注意：以下尺寸歸納都是按照1PX的像素單位總結，方便在iOS APP設計中使用。
在iOS app設計中，我們總是需要去規(guī)范地設計所需圖片的大小，下面是本人在學習iOS app制作設計中所總結的一些常用尺寸，整理出來，僅供參考，不足之處，會在以后學習工作過程中補全。
總的來說，iOS設計中會使用到如下尺寸：
圖標尺寸輸出列表：
180x180 ? ? 120x120 ? ? 87x87 ? ? 80x80 ? ? 58x58 ? ? 57x57 ? ??29x29
啟動圖片尺寸輸出列表：
640x960? ? 640x1136? ? 750x1334? ? 1242x2208(設計版）1080×1920（物理版）
桌面圖標 (app icon)
iPhone7/6 plus(@3x) : 180 x 180 ? ? ? ? ? ? ? ? ? ? ??iPhone 7/6/5s/5/4s/4(@2x) : 120 x 120
搜索框圖標 (Spotlight )
iPhone7/6 plus(@3x) : 120 x 120 ? ? ? ? ? ? ? ? ? ? ? iPhone7/6/5s/5/4s/4(@2x) : 80 x 80
設置圖標 (Settings icon)
iPhone7/6 plus(@3x) : 87 x 87 ? ? ? ? ? ? ? ? ? ? ? ? ??iPhone7/6//5s/5/4s/4(@2x) : 58 x 58
啟動圖片 (launch image)
iPhoen5s/5(@2x) : 640 x 1136 ? ? ? ? ? ? ? ? ? ? ? ? ??iPhoen4s/4(@2x) : 640 x 960
如果是iPhone7/6 或者iPhone7/6 plus 還是建議使用 launch file 或 故事板文件storyboard?
如果使用圖片，則尺寸數值為：
iPhone 7/6(@2x) : 750 x 1334 ? ? ? ? ? ? ? ? ? ? ?iPhone 7/6 plus (@3x) : 1242x2208(設計版）1080×1920（物理版）
根據iOS系統可簡單劃分為以下幾種
Spotlight
iOS 5,6
base: 29pt, @2x, @3x，get： 58 x 58, 87 x 87
iOS 7,8
base: 40pt, @2x, @3x，get：80 x 80, 120 x 120
Settings
iOS 5,6,7,8
base: 29pt, @1x,@2x,@3x，get：29 x 29, 58x58, 87x87
iPhone App
iOS 7,8
base: 60pt， @2x, @3x，get：120 x 120, 180 x 180
//
//Created by weil on 16/12/2.
//Copyright ? 2016年 weil. All rights reserved.
//
最近項目在做android和ios的項目，設計師讓我給出圖標的尺寸，于是查了一下尺寸。
第一步：產品經理和UI設計師制定好UI規(guī)范，然后開始做圖標做顏色做尺寸等一系列和APP界面強相關的工作，以最常見的“back”按鈕為例，UI設計師從無到有的具體實現步驟：
①在coreldraw或者Sketch中制作好“矢量圖標“—返回，此時的長寬單位是毫米；
②保存輸出為“PNG位圖圖片”—返回，此時的長寬單位是px（像素）；
③指定好此圖標的內外邊距，此時的邊距單位是px（像素）；
④最終此圖標圖片交到開發(fā)者手中，做好圖片的放置和內外邊距的實現。開發(fā)這在這個過程中會遇到一個問題：內外邊距是由px為單位的距離，但是在實際開發(fā)中“dp”做為單位的更加常見，所以就會涉及到“px”“dp”互轉的封裝類，專門用來實現這個過程，同時還要注意不同分辨率屏幕的適配。
（1）px，平常我們所說的手機的分辨率是1920×1080，這就是像素數量，也就是1920px×1080px，代表手機高度上有1920個像素點，寬度上有1080個像素點，每個像素點的單位是px。
（2）dp，dp是為了開發(fā)者便于做不同屏幕的適配而引入的開發(fā)單位，具體來說就是為了使得開發(fā)者設置的長度能夠根據不同屏幕(分辨率/尺寸也就是dpi)獲得不同的像素(px)數量。比如：我將一個控件設置長度為1dp，那么在160dpi上該控件長度為1px，在240dpi的屏幕上該控件的長度為1 240/160=1.5個px。也就是dp會隨著不同屏幕而改變控件長度的像素數量。
（3）DPI，用戶實際判別手機屏幕的顯示好壞，除了分辨率還要考慮屏幕的寬高(英寸)，也就是用dpi，即每英寸多少像素來評價屏幕的顯示效果。（不然假如手機分辨率是1920×1080，但是屏幕是幾十寸的，那顯示效果將不會很好，甚至你有可能看到小的像素塊，那將更影響視覺效果。）
三、Android開發(fā)中圖標尺寸總結（務必掌握）：
（1）dpi、分辨率與圖標尺寸的關系L DPI ( 120 DPI )—分辨率240 320px，其啟動圖標大小為 36 x 36 pxM DPI (160 DPI )—分辨率320 480px，其啟動圖標大小為 48 x 48 pxH DPI ( 240 DPI )—分辨率480 800px，其啟動圖標大小為 72 x 72 pxXH DPI ( 320 DPI )—分辨率1280 720px，其啟動圖標大小為 96 x 96 pxXXH DPI( 480 DPI )—分辨率1920 1080px，其啟動圖標大小為144 x 144 pxXXXH DPI( 640 DPI )—分辨率3840*2160px，其啟動圖標大小為192 x 192 px
（2）開發(fā)中“px”到“dp”從 px 換算成 dp 要知道它是以什么 dpi 標準來設計的，換句話說，就是要根據不用分辨率的屏幕，根據換算關系表得到相應的 dp 。 例如： 以 xxhdpi 標準設計的 UI，其中一個切圖的分辨率是 600 px * 360 px ，根據換算關系表可知，在 xxhdpi 標準下，1 dp = 3 px ,則其對應的 dp 是 200 dp * 120 dp 。換算關系表如下：（兩次標紅 請重點關注）
36 x 36 48 x 48 64 x 64 72 x 72 96 x 96 144 x 144 192 x 192
具體的圖標尺寸可以打開xcode ，在項目目錄下找到Assets.xcassets文件，這個文件里面標識出了所需要的圖標尺寸，下面標識的是基本尺寸，2x就是底部尺寸x2 ，即下面的尺寸為80pt和120pt
看了一下新的蘋果開發(fā)文檔和Xcode給的AppIcon坑，發(fā)現又新增了一些尺寸的圖標。在這里整理一下最新的最全的icon尺寸。
itunes中使用的icon
1024 * 1024
iPhone: iOS7-10桌面圖標
60 * 60
120 * 120 @2x
180 * 180 @3x
iPhone: iOS5-6桌面App圖標
57 * 57
114 * 114 @2x
iPad: iOS7-10桌面圖標
76 * 76
152 * 152 @2x
iPad: iOS5-6桌面圖標
72 * 72
144 * 144 @2x
iPhone: iOS5-6的搜索 iOS5-10的設置
iPad: iOS5-10的設置
29 * 29
58 * 58 @2x
87 * 87 @3x
iPad: iOS5-6系統搜索圖標
50 * 50
100 * 100 @2x
iPhone、iPad: iOS7-10系統搜索圖標
40 * 40
80 * 80 @2x
120 * 120 @3x
iPhone、iPad: iOS7-10通知欄圖標
20 * 20
40 * 40 @2x
80 * 80 @3x
iPad Pro: App桌面圖標
167 * 167 @2x
iPhone匯總：
1024 * 1024
120 * 120
180 * 180
20 * 20
40 * 40
80 * 80
29 * 29
58 * 58
87 * 87
57 * 57 (iOS5-6)
114 * 114 (iOS5-6)
iPad匯總：
1024 * 1024
76 * 76
152 * 152
20 * 20
40 * 40
80 * 80
120 * 120
29 * 29
58 * 58
72 * 72 (iOS5-6)
144 * 144 (iOS5-6)
50 * 50 (iOS5-6)
100 * 100 (iOS5-6)
167 * 167 (iPad Pro)
APP啟動頁，即LaunchImages，需要五張不同尺寸大小的圖，切記一定要選擇png格式，否則打包時報錯，導致APP適配失敗。
五張圖的大小即：320 480、640 960、640 1136、750 1334、1242 2208 828 1792 1125 2436 1242 2688
分別對應的iphone屏幕尺寸：iphone 3GS、iphone4(s)、iphone5(c、s)、iphone6(s)、iphone 6(s) plus 、iphoneX(S)、iphoneXR、iphoneXs Max.
具體步驟：
第一步：
1.點擊工程目錄中的Images.xcassets，點擊左側邊欄的LaunchImages(如果沒有，在空白處右擊創(chuàng)建一個)
2.然后在xcode最右側的邊欄處選擇你的APP是否要對ipad、橫豎屏、以及低版本的iOS系統做支持。
第二步：
將填好的圖片配置到工程中的啟動頁選項中
點擊項目目錄的工程 - target - General - App Icons And Launch Images
將Launch Images Source的選項設置為LaunchImages，切記當APP不是用LaunchScreen.xib來配置啟動頁時，LaunchScreen File的選擇狀態(tài)一定為空！否則編譯無法通過
如果此時還沒有顯示的話，那么你先刪除app，然后再運行一下項目看看
參考網站：
第一步：將icon圖標添加到工程中。
第二步：打開工程的supporting files文件夾，找到XXXX-info.plist文件，打開進去找icon files（若沒有自己建立一個）下找到icon files的item0 賦值 icon圖標名稱。
方法/步驟
在Photoshop新建一個文件，大小為1024*1024像素的。
設計圖標，圖標內容就需要自己設計啦，這里就填充一個背景顏色再加上PS自帶的形狀和文字。
生成App需要的圖標。“存儲為web所用格式”.png后綴的圖片。
得出App Icon。這個圖標是可以提交到AppStore審核的，符合1024x1024、無Alpha透明度、.png格式條件的。
打開Xcode的工程文件，Assets.xcassets文件，里面有AppIcon對象，需要添加6張指定尺寸的圖片。這就是App的圖標了。
使用Photoshop一個一個生成指定尺寸的6個圖標；或者使用軟件工具一步生成所有圖標。如圖是使用軟件“App Icon Gear”生成圖標。
將得到的圖標拖動到相應指定大小的Assets.xcassets位置中。
完成。運行App，返回到主屏幕查看App圖標效果。
先上兩張圖片這是官方總結文檔
(是不是懵逼了有點)沒關系,接著往下看....
結論1:
結論2:
桌面圖標 (app icon)
系統搜索框圖標 (Spotlight search results icon)
系統設置圖標 (Settings icon)
啟動圖片 (launch image)
參考資料:
重慶分公司
重慶分公司
