UWP 小白日記16 UWP中的3D變換API

2022-01-20 10:17:30 字數 1717 閱讀 5416

好久沒寫部落格了,再來開坑。

transform3d:「這個和css的3d好像的說」

perspectivetransform3d:這個用來指定容器是否具有3d空間,都是放在根容器下面的。

注意depth:預設1000,如過設定過大會導致子元素超出容器

"

">

"4000

" />

compositetransform3d:需要做3d變換的子元素上設定。

"

black

"borderthickness="4"

background="

#ff0b5b29

"loaded="

border_loaded

">

"2" />

按著上面的設定乙個基本的3d變換就設定完成了

tips:注意這玩意有個坑,注意z-index!注意z-index!注意z-index!在xaml上後面的元素會覆蓋前面的元素,so,如果你做立方體什麼的要自己

計算z-index以免後面的元素覆蓋前面的元素

注意:3d空間的正負方向,y軸左轉是正,右轉是負,這個自己試下就知道了。

實現**:

"

insb

">

"leftgrid

"storyboard.targetproperty="

(uielement.transform3d).(compositetransform3d.rotationy)

"duration="

0:0:3

"to="90"

enabledependentanimation="

true

">

"

">

"1000

" />

"leftgrid

" loaded="

leftgrid_loaded

">

"red"

borderthickness="4"

background="

#ff11321e

">

"1" />

"black

"borderthickness="4"

background="

#ff0b5b29

"loaded="

border_loaded

">

"2" />

注意下面border_loaded中temp.translatex和temp.rotationy的順序,你可以自己互換看看有什麼不同。

private

void leftgrid_loaded(object

sender, routedeventargs e)

private

void border_loaded(object

sender, routedeventargs e)

double

centepos;

private

double

widthgrid;

public

mainpage();}

UWP 小白日記16 UWP中的3D變換API

原文 uwp 小白日記16 uwp中的3d變換api 好久沒寫部落格了,再來開坑。transform3d 這個和css的3d好像的說 perspectivetransform3d 這個用來指定容器是否具有3d空間,都是放在根容器下面的。注意depth 預設1000,如過設定過大會導致子元素超出容器 ...

UWP 小白日記16 UWP中的3D變換API

原文 uwp 小白日記16 uwp中的3d變換api 好久沒寫部落格了,再來開坑。transform3d 這個和css的3d好像的說 perspectivetransform3d 這個用來指定容器是否具有3d空間,都是放在根容器下面的。注意depth 預設1000,如過設定過大會導致子元素超出容器 ...

UWP小白日記 3 記賬專案 1

原文 uwp小白日記 3 記賬專案 1 學了一段時間的uwp,來個專案試試手。本來是想邊做邊學mvvmlight的結果感覺mvvm對於萌新來說太高難,以後再把這個專案改造成mvvmlight框架的專案。下面進入正題。中間那快空白打算放gridview,用來放標籤。利用datatemplate讀取資料...