最近漸變色的UI設計越來越多的被采用,所以玩一下記錄一下。
這里使用的是CAGradientLayer(梯度漸變圖層)
參數介紹
1.startPoint? 和 endPoint?
顏色開始漸變的位置和漸變結束的位置,用來控制顏色漸變的方向.方向是由起始坐標指向結束坐標
例如:_gradientLayer.startPoint=CGPointMake(1,0);
? ? ? ? _gradientLayer.endPoint=CGPointMake(0,1);?
? ? ? ? ?就是右上角指向左下角
2.frame ? ?用來設置漸變圖層的大小
3.colors ? 類型是數組,用來設置漸變的顏色組,CGColor類型
4.locations 數組,可為空,傳NSnumber類型的數字 0 ~ 1,用來控制顏色占比
設置分類方法(Category)
因為控件都是UIView子類,為了方便以后調用,所以我們選擇UIView分類方法
設置導航欄navigationBar
思路:新建一個Contoller繼承UINavigationController ,在這個新建的controller里做設置,對navigationbar調用剛剛寫的類擴展方法就設置完成了,而且還可以方便使用。
在實現過程中,遇到了一個問題,只對navigationbar設置的話,狀態欄不會跟著導航欄變色。場面一度尷尬
解決方案:添加一個View在navigationbar上,該View的高度為導航欄+狀態欄高度,用來蓋住狀態欄的背景。
代碼如下
2017年7月25 問題優化
問題:使用以上代碼會出現barBackgroundView 蓋住navigationBar上的title和item的情況
解決:新增UIView轉UIImage方法
1.通過該方法把barBackgroundView轉成圖片
2.[self.navigationBar setBackgroundImage:(nullable UIImage *) forBarMetrics:(UIBarMetrics)]設置背景圖片可解決被蓋住的問題
Demo下載地址: https://github.com/ForeverWater/WYGColorChange.git