一、效果展示
二、怎麼做?
方案有很多種,不同的方案有不同的優缺點,這裡列舉兩種常見的方案
方案一:生成整張引導圖
(1). 匯出引導圖
讓設計師匯出各個尺寸的引導圖,引導圖只包含指引部分,不包括背景,匯出的引導圖樣式如下:
這裡寫描述
需要匯出iphone4,iphone5,iphone6,iphone6 plus 共4個尺寸,如果適配ipad,還需要匯出ipad的
(2). 編碼
因為整張圖匯出了,所以**部分就簡單了,不需要考慮布局問題,直接生成乙個imageview放上去,然後給它新增個點選事件即可
**如下:
(3). 優缺點
這種方案的優點是
a. 快速
只要設計師做好效果圖以後,把蒙層匯出成各種規格即可,90%的工作量都在設計師身上,程式設計師只需要簡單地新增檢視和事件即可
b. 維護成本低
當介面發生變化,或者引導圖需要調整時,只需要設計師重新生成,然後替換就可以了
b. 無法復用
一張引導圖只能用於乙個地方,其他地方不可能會用得上
方案二:拼接
拼接的思路是這樣的,通過若干張拼成乙個遮罩層,然後再在上面放其他元素,如下圖所示
這裡寫描述
(1). 準備
這裡需要準備3張
a. 空心的橢圓遮罩層
這裡寫描述
中間是透明,周圍是白色的,白色部分可以在遮罩過程中修改成任意的顏色
b. 小箭頭
這裡寫描述
c. 確定按鈕
這裡寫描述
(2). 編碼
這裡只介紹部分**的編寫過程
a. 介面
介面的定義:
(void)showinview:(uiview )view maskbtn:(uibutton )btn;
view:引導圖的父檢視
btn:被遮罩的按鈕
介面的實現:
(void)showinview:(uiview )view maskbtn:(uibutton )btn completion:nil];
}b. 修改遮罩層
載入空心的橢圓後,先對白色區域進行處理,把它改成黑色半透明
uiimage image = [uiimage imagenamed:@"whitemask"];
image = [image maskimage:[[uicolor blackcolor] colorwithalphacomponent:0.71]];
uiimageview imageview = [[uiimageview alloc] initwithimage:image];
(uiimage )maskimage:(uicolor )maskcolor
這裡會將中白色的部分改成任意的顏色,我們要將空心的橢圓變成這樣
這裡寫描述
c. 生成上下左右4個黑色半透明檢視
分別放在空心橢圓的上、下、左、右四個方位
(uiview *)topmaskview
return _topmaskview;
}(uiview *)bottommaskview
return _bottommaskview;
}(uiview *)leftmaskview
return _leftmaskview;
}(uiview *)rightmaskview
return _rightmaskview;
}d. 檢視布局
這裡有幾個需要注意的地方:
c-1. 被拼接的檢視的 x,y,width,height 的值需要取整,因為浮點數可能會導致銜接部位出現白邊,尤其是在iphone6 plus上,原因是手機的解析度問題,所以這裡最好使用整數
c-2. 在 layoutsubviews 函式中進行布局,這裡布局的好處是橫豎屏適配都能夠平滑過渡,而且不需要手動更新
布局**如下:
(void)layoutsubviews
(3). 優缺點
優點:a. 節約空間
一般就只需要幾個小圖,然後就可以組裝成一張引導圖了
b. 可重用
按鈕、橢圓圖、小箭頭這一類的可能被其他引導圖繼續使用
缺點:a. 編碼時間較長
每乙個介面元素都需要通過編碼來實現,每一次改動也需要調整**
iOS引導頁 啟動頁
前言 這裡使用launchscreen storyboard檔案建立啟 和引導頁。首次開啟專案或者更新後第一次開啟時展示引導頁,儲存有使用者資訊時進入首頁,否則進入登入註冊頁面。正文1.動態啟 將launchscreen.storyboard檔案上放入乙個。並新增約束,鋪滿整個頁面。為launchs...
iOS 引導頁實現
myintroductionview.h myintroductionview.m myintroductionpanel.h myintroductionpanel.m 這四個檔案,再加上一些影象資源加到你的工程中去。之後如果要修改影象等資源只要在相應位置修改就好了。在對應的.件中引入標頭檔案並且...
使用者引導頁 ios
儲存使用者的偏好設定 比如是否第一次啟動,使用者名稱,密碼等,nsuserdefault defaults nsuserdefaults standarduserdefaults 單例物件 bool islaunched defaults boolforkey lanou 建立判斷是否第一次啟動的鍵...