flutter 設定陰影

2021-10-07 03:35:02 字數 1071 閱讀 3571

1、主要是boxshadow這個屬性

container(

width: 50,

height: 50,

decoration: boxdecoration(

borderradius: borderradius.all(radius.circular(28)),

boxshadow: [

boxshadow(

color: colors.red, //底色,陰影顏色

offset: offset(0, 0), //陰影位置,從什麼位置開始

blurradius: 1, // 陰影模糊層度

spreadradius: 0, //陰影模糊大小

],),

child: container(),

),

2、效果,邊緣有陰影

3、擴充套件

boxshadow 是乙個陣列,可以設定多個,效果更炫酷

container(

width: 20,

height: 20,

decoration: boxdecoration(

color: colors.red,

borderradius: borderradius.all(radius.circular(20)),

boxshadow: [

boxshadow(color: colors.green,offset: offset(0, 0),blurradius: 1,spreadradius: 5),

boxshadow(color: colors.yellowaccent,offset: offset(0, 0),blurradius: 1,spreadradius: 4),

boxshadow(color: colors.blue,offset: offset(0, 0),blurradius: 1,spreadradius: 3),

],),

child: container(),

);

效果

主題設定 flutter主題設定

theme元件可以為material全域性 區域性 假如我們要給floatingactionbutton設定主題樣式 直接寫個theme包裹floatingactionbutton元件 然後設定data,接收型別依然是themedata,裡面填寫我們的引數 如果沒有設定區域性主題則預設使用全域性主題...

設定css陰影和取消css陰影

之前用mui布局樣式,但是一直都會有這個陰影,在瀏覽器除錯也除錯沒用 這是設定陰影 長 寬 模糊度 顏色 box shadow 0 1px 6px ccc 取消的話直接設定為0就行了,不建議直接去mui.css裡面刪掉,如果改掉mui裡面的樣式全部的樣式都會變 這是取消陰影 長 寬 模糊度 顏色 b...

陰影邊框設定部分

1 使用前注意引入以下框架 quartzcore.framework 2 頭部檔案引入 import 1 設定陰影相關 csharp view plain copy uicolor color1 uicolor colorwithred 108.0 255 green 108.0 255 blue ...