Flex中給物件加陰影的方法

2021-08-31 22:41:57 字數 2692 閱讀 9178

flex

中給物件加陰影的方法

1、

bordercontainer

、panel

等容器自帶陰影

bordercontainer

或者panel

等容器自帶了陰影,這通過dropshadowvisible

樣式設定,此樣式如果設為true

,則顯示陰影。bordercontainer

的dropshadowvisible

預設為false

,panel

的預設為true。

panel

的陰影效果如下:

2、

rectangulardropshadow

專用來為矩形物件加陰影,如果物件是矩形,使用此類效率高

可以在程式中直接使用rectangulardropshadow

為物件加陰影,但僅適用於物件外形是矩形的條件下。示例如下:

x="302" y="

62" width="

217" height="

200"

>

blurx="

20" blury="20"

alpha="

0.32

" distance="11"

blradius="

5" brradius="5"

angle="

90" color="

#000000

" left="

0" top="

0" right="0"

bottom="0"

/>

效果如下:

3、

skinnablecontainer

可以通過**加陰影

可以為skinnablecontainer

建乙個**類,在類中設定陰影,**如下:

x="575" y="

62" width="

200" height="

200"

skinclass="

myskinablecontainerwithshadowskin

">

**中的陰影程式為:

rectangulardropshadow

id="

dropshadow

" blurx="

20" blury="

20" alpha="

0.32

" distance="11"

blradius="

5" brradius="5"

angle="

90" color="

#000000

" left="

0" top="

0" right="0"

bottom="0"

/>

這樣的好處是陰影將不響應該物件的滑鼠事件。

4、

如果物件外形不是矩形,就要使用dropshadowfilter

濾鏡

示例:首先是濾鏡的定義:

id="

myfilters

">

alpha="

0.32"

distance="11"

blurx="

20" blury="20"

angle="

90" color="

#000000"

>

x="297" y="

339"

>

myfilters

}"width="

175.40123

" height="

172.30193

">

caps="

none

" color="

#5380d0

" joints="

miter

" miterlimit="

4" weight="1"

/>

color="

#ffffff

"/>

此**通過path

定義了乙個不規則區域,通過dropshadowfilter

濾鏡新增了陰影。

效果如下:

總結:

總結起來就是兩個東西,乙個是rectangulardropshadow

,乙個是dropshadowfilter

。rectangulardropshadow

為矩形物件新增陰影,dropshadowfilter

可以為任意形狀物件新增陰影。

bordercontainer

和panel

等容器使用的就是rectangulardropshadow。

屈劍峰

2011

年11月24

加陰影的方法

一 給加上陰影 uiimageview pagecontenterimageview uiimageview alloc initwithimage uiimage imagenamed 新增邊框 calayer layer pagecontenterimageview layer layer.bo...

SceneKit 給底部加陰影的n種方式

本節學習目標 教大家三種給模型新增新增陰影的方式 第一種 讓設計直接給模型新增陰影,如下面 第二種 給模型底部新增地板,已系統的飛機模型為例 它是沒有陰影,接下來就是如何製作陰影 給飛機地下放置乙個floor模型,就會有陰影了 但是陰影不太明顯,如何讓陰影更加明顯一點呢?設定scnfloor 模型的...

給自己看的flex布局方法

flex是flexiblebox的縮寫,中文名字彈性盒子布局,在小程式布局中支援的很好 在試驗之前可以看一下張鑫旭的flex 1.給父容器設定了display flex 則內部容器的塊狀特性會自動消失 再給內部元素設定display block無效 2.設定flex direction column...