Th3813 06 animasi

1

1

TH3813 Realiti MayaAnimasi, pengesan dangeometri

2

Pengenalankepada Animasi

TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 3

LatarbelakangNod seperti Billboard dan Anchor mempunyaifungsi tersendiriBoleh bina fungsi khusus untuk bolehkan bentukbergerak, berputar, dll.Perlu kepada “trigger”, masa dan tindakbalasterhadap siri peristiwa untuk hasilkan interaksipengguna/persekitaran yang lebih baik


Membina litar animasiHampir kesemua nod boleh menjadi komponendalam litar animasi

nod bertindak sepert bahagian elektronik mayanod boleh terima dan hantar peristiwa (events)laluan hubungkan bersama nod-nod

Peristiwa (event) ialah mesej yang dihantar antaranod

nilai data (seperti translasi)time stamp (bila peristiwa dihantar)


ContohUntuk pusingkan bentuk

hubungkan nod yang menghantar peristiwaputaran kepada medan rotation dalam nod Transform

Untuk blinkkan bentukhubungkan nod yang hantar peristiwa warnakepada medan diffuseColor dalam nod Material


Melalukan peristiwaUntuk setup litar animasi, perlu kepada 3 perkara:

nod yang menghantar peristiwanod mesti dinamakan dengan DEF

nod yang menerima peristiwanod mesti dinamakan denan DEF

laluan yang hubungkan nod-nod

2


Penggunaan nod input/outputSetiap nod mempunyai medan, input dan output

medan (field): nilai yang disimpaneventIn: satu inputeventOut: satu output

exposedField ialah ringkasan bagi field, eventIndan eventOut


Contoh inputNod Transform mempunyai eventIns berikut:

set_translationset_rotationset_scale

Nod Material mempunyai eventIns berikut:set_diffuseColorset_emissiveVolorset_transparency


Contoh outputNod OrientationInterpolator mempunyai eventOut:

value_changed untuk hantar nilai putaranNod PositionInterpolator mempunyai eventOut:

value_changed untuk untuk hantar nilai kedudukan(translation)

Nod TimeSensor mempunyai eventOut:time untuk hantar nilai masa


Sintaks: ROUTEPernyataan ROUTE hubungkan bersama dua nod menggunakan:

nama nod penghantar dan nama eventOutnama nod penerima dan nama eventIn

ROUTE MySender.rotation_changedTO MyReceiver.set_rotation

ROUTE dan TO mesti berhuruf besar


Jenis data bagi peristiwaJenis data bagi peristiwa antara pengirim danpenerima mesti samaJenis data mempunyai nama dengan format piawai, seperti:

SFString, SFRotation, atau MFColorCharacter Nilai1 S: nilai tunggal

M: nilai berbilang2 Sentiasa Fselebihnya nama jenis data, spt String,

Rotation atau Color TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 12

Jenis data peristiwaJenis data Maksud

SFBool Boolean, nilai true atau false

SFColor, MFColor nilai warna RGB

SFFloat, MFFloat nilai floating point

SFImage Nilai imej

SFInt32, MFInt32 Nilai integer

SFNode, MFNode Nilai nod

3


Jenis data peristiwaJenis data Maksud

SFRotation, MFRotation Nilai putaran

SFString, MFString Nilai rentetan teks

SFTime Nilai masa

SFVec2f, MFVec3f Nilai XY floating point

SFVec3f, MFVec3f Nilai XYZ floating point


Konvensi penamaanKebanyakan nod mempunyai exposedFieldsJika nama exposedField ialah xxx, maka:

set_xxx ialah eventIn untuk setkan medanxxx_changed ialah eventOut yang dihantar apabilamedan berubahset_ dan _changed suffix adalah optional tetapidigalakkan


Konvensi penamaanNod Transform mempunyai:

medan rotationset_rotation eventInrotation_changed eventOut


Contoh animasiDEF Touch TouchSensor { }

DEF Timer1 TimeSensor { . . . }

DEF Rot1 OrientationInterpolator { . . . }

DEF Frame1 Transform {children [

Shape { . . . }]

}ROUTE Touch.touchTime TO Timer1.set_startTimeROUTE Timer1.fraction_changed TO Rot1.set_fractionROUTE Rot1.value_changed TO Frame1.set_rotation


Contoh animasi

colors.wrl


Menggunakan laluan berbilangBoleh mempunyai fan-out

Berbilang laluan daripada pengirim yang samaBoleh mempunyai fan-in

berbilang laluan kepada penerima yang sama

4

19

Penganimasiantransformasi


LatarbelakangAnimasi berubah mengikut masa

kedudukan - memandu keretaorientasi - pesawatwarna - perubahan musim

Animasi memerlukan kawalan berdasarkan masabila bermula dan tamatsepantas mana


Contoh transformasi animasi

floater.wrl


Kawalan masaNod TimeSensor sama seperti stop watch

kawal masa mula dan berhentiSensor janakan peristiwa masa semasa berjalanUntuk animasikan, lalukan peristiwa masa padanod lain


Penggunaan masa mutlakNod TimeSensor janakan masa mutlak danpecahan peristiwa masaMasa mutlak berikan masa masa jam biasa

masa mutlak diukur dalam saat mulai 1 Januari1970, 12:00amberguna untuk lakukan peristiwa pada tarikh danmasa tertentu


Penggunaan masa pecahanPeristiwa masa pecahan berikan nombor 0.0 - 1.0

bila sensor bermula, outputnya ialah 0.0di akhir kitaran, outputnya ialah 1.0bilangan saat antara 0.0 higa 1.0 di kawal olehselang kitaran (cycle interval)

Sensor boleh lakukan loop selama- lamanya, atauhanya lalui satu kitaran dan berhenti

5


Sintaks: TimeSensorNod TimeSensor janakan peristiwa berdasarkanmasa

startTime dan stopTime - bila untuk lariancycleInterval - tempoh (jangkamasa) kitaranloop - sama ada perlu untuk ulang semula kitaran

TimeSensor {cycleInterval 1.0loop FALSEstartTime 0.0stopTime 0.0

} TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 26

Sintaks: TimeSensorTimeSensor {

enabled TRUE #exposedField SFBoolstartTime 0.0 #exposedField SFTime

cycleInterval 1.0 #exposedFieldSFTime

loop FALSE #exposedField SFBoolisActive #eventOut SFBooltime #eventOut SFTimecycleTime #eventOut SFTimefraction_changed #eventOut SFFloat

}


Penggunaan timerUntuk hasilkan larian time yang berterusan:loop TRUEstopTime <= startTime

Bila stopTime <= starTime, stopTime tidakdiendahkan


Penggunaan timerUntuk larian sehingga stopTime:loop TRUEstopTime > startTime

Untuk larian satu putaran kemudian berhenti:loop FALSEstopTime <= starTime


Penggunaan timerInput peristiwa set_startTime:

tentukan bila timer perlu mulaInput peristiwa set_stopTime:

tentukan bila timer perlu berhenti


Penggunaan output timerOutput peristiwa isActive:

output TRUE pada ketika timer bermulaoutput FALSE pada ketika timer berhenti

Output peristiwa time:hasilkan masa mutlak sebagai output

Output peristiwa fraction_changed:hasilkan output 0.0 - 1.0 ketika kitaranresetkan kembali ke 0.0 pada permulaan setiapkitar

6


Contoh time sensorShape {

appearance Appearance {material DEF Monolith1Facade Material {

diffuseColor 0.2 0.2 0.2}

}geometry Box { size 2.0 4.0 0.3 }

}DEF Monolith1Timer TimeSensor {

cycleInterval 4.0loop FALSEstartTime 0.0stopTime 0.1

}

ROUTE Monolith1Touch.touchTimeTO Monolith1Timer.set_startTime

ROUTE Monolith1Timer.fraction_changedTO Monolith1Facade.set_transparency


Contoh penggunaan time sensor

monolith.wrl


Penukaran masa kepadakedudukan

Untuk animasikan kedudukan sesuatu bentuk, berikan:

senarai kedudukan utama untuk pergerakanmasa bagi setiap kedudukan berada

Nod interrpolator terjemahkan input masa kepadaoutput kedudukan

apabila masa berada antara dua kedudukanutama, interpolator kirakan kedudukan perantara


Interpolasi kedudukanSetiap kedudukan utama di sepanjang laluanmempunyai:

nilai utama (spt kedudukan)pecahan masa utama

Interpolasi isikan nilai antara nilai utama

Masa Pecahan Kedudukan0.0

0.00.0 0.0 0.00.4 0.1 0.0


Interpolasi kedudukan

Masa Pecahan Kedudukan0.0

0.00.0 0.0 0.00.4 0.1 0.0

0.2. . .

0.8 0.2 0.0. . . .

0.5. . .

4.0 1.0 0.0. . . .


Sintaks: PositionInterpolatorNod PositionInterpolator tentukan kedudukanlaluan

key - pecahan masa utamakeyValue - kedudukan utama

PositionInterpolator {key [ 0.0, . . . ]keyValue [ 0.0 0.0 0.0, . . . ] }

Lazimnya, laluan kepada input set_translationdalam nod Transform

7


Penggunaan interpolatorInput set_fraction:

setkan masa pecahan terkini di sepanjang laluanutama

Output value_changed:hasilkan kedudukan disepanjang laluan sebagioutput setiap kali pecahan disetkan


Contoh penggunaan interpolasikedudukanDEF Particle1 Transform {

children [Shape { . . . }

]}DEF Timer1 TimeSensor {

cycleInterval 12.0loop TRUEstartTime 0.0stopTime -1.0

}DEF Position1 PositionInterpolator {

key [ 0.0, . . . ]keyValue [ 0.0 0.0 0.0, . . .]

}ROUTE Timer1.fraction_changed TO Position1.set_fractionROUTE Position1.value_changed TO Particle1.set_translation


PositionInterpolator: Contohmudah


#VRML V2.0 utf8Group {

children [# Moving box

DEF Cube Transform {children Shape {

appearance Appearance {material Material { }

}geometry Box { size 1.0 1.0 1.0 }

}},

# Animation clockDEF Clock TimeSensor {

cycleInterval 4.0loop TRUE

},# Animation path

DEF CubePath PositionInterpolator {key [

0.00, 0.11, 0.17, 0.22,0.33, 0.44, 0.50, 0.55,0.66, 0.77, 0.83, 0.88,0.99

]keyValue [

0.0 0.0 0.0, 1.0 1.96 1.0,1.5 2.21 1.5, 2.0 1.96 2.0,3.0 0.0 3.0, 2.0 1.96 3.0,1.5 2.21 3.0, 1.0 1.96 3.0,0.0 0.0 3.0, 0.0 1.96 2.0,0.0 2.21 1.5, 0.0 1.96 1.0,0.0 0.0 0.0

]}

]}ROUTE Clock.fraction_changed TO CubePath.set_fractionROUTE CubePath.value_changed TO Cube.set_translation


Contoh penggunaan interpolasikedudukan

spiral.wrl


Penggunaan interpolasi lainAnimasi kedudukan PositionInterpolatorAnimasi putaran OrientationInterpolatorAnimasi skala PositionInterpolatorAnimasi warna ColorInterpolatorAnimasi tranparency ScalarInterpolator

8


Sintaks: OrientationInterpolatorNod OrientationInterpolator tentukan laluanputaran

key - nilai pecahan masakeyValue - putaran utama (paksi & sudut)

OrientationInterpolator {key [ 0.0, . . . ]keyValue [ 0.0 1.0 0.0 0.0, . . . ] }

Lazimnya laluan ke input set_rotation dalam nod Transform


Sintaks: PositionInterpolatorNod PositionInterpolator tentukan kedudukan atau laluan skala

key - nilai pecahan masakeyValue - kedudukan utama (atau skala)

PositiontionInterpolator {key [ 0.0, . . . ]keyValue [ 0.0 0.0 0.0 0.0, . . . ] }

Lazimnya laluan ke input set_scale dalam nod Transform


Sintaks: ColorInterpolatorNod ColorInterpolator tentukan laluan warna

key - nilai pecahan masakeyValue - warna utama (merah, hijau, biru)

ColorInterpolator {key [ 0.0, . . . ]keyValue [ 1.0 1.0 0.0 0.0, . . . ]

}Lazimnya laluan ke input set_diffuseColor atau set_emissiveColor dalam nod Material


Contoh mudah: ColorInterpolator


Sintaks: ScalarInterpolatorNod ScalarInterpolator tentukan kedudukan atau laluan skala

key - nilai pecahan masakeyValue - skala utama

ScalarInterpolator {key [ 0.0, . . . ]keyValue [ 4.5, . . . ] }

Lazimnya laluan ke input set_transparency dalam nod Transform


Contoh penggunaan lain-lain interpolator

squisher.wrl

9


ContohTentukan bagaimanakah menghasilkan animasimudah di bawah ?


Group {children [# Rotating cylinder

DEF Column Transform {rotation 0.0 0.0 1.0 0.0children Shape {

appearance Appearance {material Material { }

}geometry Cylinder {

height 1.0radius 0.2

}}

},


# Animation clockDEF Clock TimeSensor {

cycleInterval 4.0loop TRUE

},# Animation path

DEF ColumnPath OrientationInterpolator {key [ 0.0, 0.50, 1.0 ]keyValue [

0.0 0.0 1.0 0.0,0.0 0.0 1.0 3.14,0.0 0.0 1.0 6.28

]}

]}


ROUTE Clock.fraction_changed TO ColumnPath.set_fractionROUTE ColumnPath.value_changed TO Column.set_rotation

Th3813 06 animasi

Documents

Transcript of Th3813 06 animasi