本頭條核心宗旨
歡迎來到「技術剛剛好」作者，「技術剛剛好」是個人維護，每天至少更新一篇Flutter技術文章，實時為大家播報Flutter最新消息。如果你剛好也在關注Flutter這門技術，那就跟我一起學習進步吧，你的贊，收藏，轉發是對我個人最大的支持，維護不易，歡迎關注。
技術剛剛好經歷
近幾年，移動端跨平臺開發技術層出不窮，從Facebook家的ReactNative，到阿里家WEEX，前端技術在移動端跨平臺開發中大展身手，技術剛剛好作為一名Android開發，經歷了從Reactjs到Vuejs的不斷學習。而在2018年，我們的主角變成了Flutter，這是Goolge開源的一個移動端跨平臺解決方案，可以快速開發精美的移動App。希望跟大家一起學習，一起進步！
本文核心要點
漸變是一種有規律性的變化。漸變能給人很強的節奏感和審美情趣。這種形式在日常生活中隨處可見，是一種常見的視覺形象。由於繪畫中透視的原理，物體就會出現近大遠小的變化，許多自然理象都充滿了漸變的形式特點。運用漸變技術能使畫面更加豐富，給人視覺更強的衝擊力。
漸變效果看起確實比一般純色看起來要好看些，所以今天我也來講解一下Flutter怎麼實現這樣的效果，學過前端H5開發的應該知道css實現漸變效果。
CSS3 定義了兩種類型的漸變（gradients）：
- 線性漸變（Linear Gradients）- 向下/向上/向左/向右/對角方向
- 徑向漸變（Radial Gradients）- 由它們的中心定義
漸變效果
今天我們來看看Flutter是怎麼實現這種效果的。
<code>import 'package:flutter/material.dart';LinearGradient getCustomGradient() { // Flutter實現漸變API：LinearGradient return LinearGradient( //漸變具有兩個錨點，開始和結束。該開始點對應於0.0，並且結束點對應於1.0。這些點以分數表示，因此相同的梯度可以在不改變參數的情況下與大小變化的框一起重複使用。（這與新的ui.Gradient.linear相對，後者的參數以邏輯像素表示。） colors: [Colors.pink, Colors.blueAccent], begin: const FractionalOffset(0.0, 0.0), end: const FractionalOffset(0.6, 0.0), stops: [0.0, 0.6], tileMode: TileMode.clamp);}/<code>LinearGradient講解
這個類主要是2D漸變,漸變具有兩個錨點，開始和結束。該開始點對應於0.0，並且結束點對應於1.0。這些點以分數表示，因此相同的梯度可以在不改變參數的情況下與大小變化的框一起重複使用。
運用也很簡單，可以創建一個文本控件，然後設置一下背景就行了。
<code>decoration: BoxDecoration( // Add Gradient gradient: utils.getCustomGradient())))));/<code>
總結
本文講解了Flutter實現漸變背景色方法，本頭條每天更新一些Flutter小知識點，看起來不累，學習起來輕鬆，快來快來學習哈。
閱讀更多 技術剛剛好 的文章
