FWidget 用心提供精致的組件，助您構(gòu)建精美的應(yīng)用。
最近，我們對 FWidget 進行了一次 超前 的升級 ??
FWidget 是由【阿里巴巴-飛豬-FliggyMobile技術(shù)團隊】 開發(fā)的系列組件庫， FWidget 始終奉行 "用心提供精致的組件，助您構(gòu)建精美的應(yīng)用" 的信念，力圖為開發(fā)者們提供一套精致易用的組件庫，幫助開發(fā)者們更易構(gòu)建出精彩絕倫的應(yīng)用。
迄今為止， FWidget 已經(jīng)為開發(fā)者們打造了一批精致的組件。目前， FWidget 累計向社區(qū)開放發(fā)布了其中的 10 余個組件，獲得了來自社區(qū)開發(fā)者們投出的超過 1130 個 Star。開發(fā)者們給予的認可和支持，也是 FWidget 繼續(xù)用心提供更多新組件的重要動力。
最近， FWidget 為開發(fā)者們帶來了一次前所未有的 超前 升級，賦能予開發(fā)者們構(gòu)建更驚艷的，高質(zhì)感的應(yīng)用的能力。
?? 那么，何謂高質(zhì)感？
開發(fā)者，請定目細看，來自全新升級的 FButton 和 FSuper 所構(gòu)建出來的高質(zhì)感視效。
#FButton
通過對 光源、陰影、明暗變化 的細膩處理， FWidget 為開發(fā)者們打造出了極具藝術(shù)感的高質(zhì)感組件。
正如你所見，這些細致的光影效果處理，能夠使得界面元素 "脫離" 界面。呈現(xiàn)出逼真的 突出，陷入 視效，帶來前所未有的視覺沖擊感。
#FSuper
于此同時， FWidget 所提供的不是簡單的固定光源下的光影效果。開發(fā)者可以根據(jù)喜好或是需要，自由設(shè)定光源方向，以充分呈現(xiàn)代碼家們的藝術(shù)設(shè)計。
是的， FWidget 能夠根據(jù)不同的光源方向，動態(tài)的調(diào)整適合的陰影、明暗效果，以完美呈現(xiàn)逼真的視效。
?? 這很難嗎？
不!
對于開發(fā)者而言， FWidget 所提供的這種驚艷的表現(xiàn)力，實現(xiàn)起來保持了一貫的簡潔。甚至，開發(fā)者只需要添加一個屬性，就可以立即構(gòu)建出一個的高質(zhì)感界面元素。
在 FButton 中：
FButton(
/// 開啟 Neumorphism 支持
///
/// Turn on Neumorphism support
isSupportNeumorphism: true,
/// 配置光源方向
///
/// Configure light source direction
lightOrientation: lightOrientation,
/// 配置亮部陰影
///
/// Configure highlight shadow
highlightShadowColor: Colors.white,
/// 配置暗部陰影
///
/// Configure dark shadows
shadowColor: mainShadowColor,
strokeColor: mainBackgroundColor,
strokeWidth: 3.0,
width: 190,
height: 60,
text: "FWidget",
style: TextStyle(
color: mainTextTitleColor, fontSize: neumorphismSize_2_2),
alignment: Alignment.center,
color: mainBackgroundColor,
...
)
在 FSuper 中：
FSuper(
/// 開啟 Neumorphism 支持
///
/// Turn on Neumorphism support
isSupportNeumorphism: true,
/// 配置光源方向
///
/// Configure light source direction
lightOrientation: lightOrientation,
/// 配置暗部陰影
///
/// Configure dark shadows
shadowColor: Colors.black87,
/// 配置亮部陰影
///
/// Configure highlight shadow
highlightShadowColor: Colors.white24,
/// 是否呈浮起視效
///
/// Whether it is floating visual effect
float: false,
shadowOffset: Offset(0.0, 1.0),
width: 50,
height: 50,
backgroundColor: Color(0xff28292f),
corner: FCorner.all(40),
child1: Icon(
Icons.star,
color: Color(0xfffff176),
size: 23,
),
),
僅僅是為組件配置 isSupportNeumorphism: true 就已經(jīng)可以即刻構(gòu)建出高質(zhì)感的精美元素。
通過 lightOrientation 開發(fā)者更是可以自由的配置光源方向，以制造出更多意想不到的驚艷效果。
當(dāng)然， FWidget 向開發(fā)者們提供了自由配置 陰影明暗 的參數(shù)，開發(fā)們可以按照喜好，隨心所欲的創(chuàng)造。
?? 如何快速使用？
在項目 pubspec.yaml 中，配置(升級) FButton 和 FSuper 到 2.0.0 版本。
/// fbutton
fbutton: ^2.0.0
/// fsuper
fsuper: ^2.0.0
??注意，
2.0.0版本組件僅對1.17以上的 Flutter 版本提供支持！
??注意，
2.0.0版本中，FButton 和 FSuper 部分參數(shù)有變更，具體請參與組件倉庫主頁，查看最新文檔?；蛘呖梢詤㈤?FButton Changelod 和 FSuper Changelod 獲取變更信息。
?? 請給予我們支持
開發(fā)者，如果你覺得 FWidget 能夠?qū)δ阌兴鶐椭?，或者你喜歡 FWidget 的話，請到 FWidget 組件主頁，為你喜愛的組件投出 Star 吧。
?? 歡迎訪問官網(wǎng)
現(xiàn)在，我們?yōu)? FWidget 著手開發(fā)了唯一官方網(wǎng)站 【https://fwidget.cn】，為開發(fā)者們提供：
統(tǒng)一的 FWidget 組件獲取平臺
具備可交互 Demo 的精致文檔
支持一鍵快速引用組件
歡迎開發(fā)者們收藏訪問，給我們提供更多的精美創(chuàng)意 ??。
值得一提的是， FWidget 官網(wǎng)是完全使用 Flutter 進行開發(fā)的，其中絕大部分界面元素和功能均由 FWidget 組件提供支持。
