Android Curv Gradient 曲線漸層

android shader canvas gradient 按鈕漸層

MarcusLiu 2021-04-06 10:07:42 ‧ 1372 瀏覽

分享至

前言

平常我們使用的漸層方式通常都是在drawable用Xml配置參考
或者是在程式中設置Paint的shader參考
這樣的文章介紹相信大家都看很多了，並且也挺熟練的

在使用過程中常覺得限制滿多的，或者無法達到效果，例如這種不規則形狀
因此就有個發想，如果配置的方式不再是直線跟角度是否就能夠產生出比較接近不規則形狀漸層的效果

Demo

先展示一下成果，參考Git Sample

做法

先設置好曲線的控制點參考貝茲曲線原理
分為直/橫兩個渲染的方向
計算出每一條直線的漸變點
按照設置的方向繪製漸層直線(例如View的尺寸為1920(直) * 1080(橫)，則直向渲染需drawLine 1080次，橫向則為1920次)

檢討

目前用Oppo R17 Pro測試Log繪製時間大約在0~1毫秒，量少的時候沒什麼影響，但是數量變多(測試時是用200個，畫面同時呈現約190個)時會有明顯的卡頓問題，並且有看到系統的Log警告(Skipped 2 frames! The application may be doing too much work on its main thread.)。主要的問題還是在drawLine的部分重複太多次，後續會再進行優化。

初步的想法是將drawLine移至Background thread，先繪製在另一張Bitmap上，在UI thread onDraw時就只要繪製Bitmap即可。目標是在同樣的測試條件下運行順暢。