iT邦幫忙

1

Android Curv Gradient 曲線漸層

前言

平常我們使用的漸層方式通常都是在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即可。目標是在同樣的測試條件下運行順暢。

進階功能

目前暫時有想到幾項

  • 增加渲染方向,不再只有直、橫兩種
  • 區塊的渲染,例如下面這種漸層配置方式,按照目前的控制點條件判斷是無法完成
    原圖網址
    原圖網址
  • 動態漸變
    ....
    感覺要做做不完,不過可以肯定的是,必須要先解決卡頓了才會開始做

尚未有邦友留言

立即登入留言