實現文字的整體變色與區域變色功能：CATextLayerTest
使用 CATextLayer，實現文字的整體變色（網易新聞頂部菜單）與區域變色（UC 瀏覽器閱讀器頂部菜單）功能。
</div>
最近對網易新聞首頁頂部標題欄與 UC 瀏覽器閱讀器頂部標題欄的實現效果很好奇，于是嘗試實現。字體變色比較好做，CATextLayer 本身就包含了 animated 的fontColor，區域變色就有些麻煩。以前讀過王軻的《基于Core Animation的KTV歌詞視圖的平滑實現》，提供一種使用 mask 實現區域變色的思路，很棒，自己按著這個思路嘗試使用的時候，發現兩個 Label 的字體不能完全重合，總有毛邊，一直找不到原因。后來自己想到的一個新的思路，不使用兩個 Label，而是將文字作為 mask：先創建一個 CALayer 類型的 baseLayer，背景顏色為白色，再創建一個 CALayer 類型的 subLayer，背景顏色為綠色，subLayer 作為 baseLayer 的子 layer。然后創建 CATextLayer，寫上字，將這個 textLayer 作為 baseLayer 的 mask，變化過程中改變 subLayer 的 frame 就可以了。
效果如下：
本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！