We've been always struggling using gauge and progress to beautify our metrics in react-native.
We were used to implement rough gauge components.
But then came a project where, you know, the designer just cracked and designed a complex gauge with gradient inside, we needed to link the gradient color with the progress. Such a mess.
BUT instead of trying to bring him back from his crazy ideas, we just took up the challenge.
Then we made a first implementation with
react-native-svg which was great but not smooth enough and still miss some customizations such as : inner shadow.
And few days later, we heard about
@react-native/skia which is react-native implementation of Skia.
react-native-svg in favor of
Skia, we made the right choice as we seen a big performance improvement on the component. Beyond that, we were able also to implement incredible styles features as inner/outer shadow on the gauge.
We made sure that the gauge can also be used without fancy, shining effects. ( Like in the banner )
On our case we needed a heavily customized gauge like below :
And today we are happy to share with you the result of that super interesting journey :
Top comments (0)