WPF 3D 15.11.2018 vjj 1
15.11.2018 vjj 3 samples WindowsSDK WPF Samples WPF4 Unleashed chapter 16
15.11.2018 vjj 4 3D Point3D X, Y, Z Point3DCollection Size3D Rect3D Vector3D
15.11.2018 vjj 5 Viewport3D 2D Visual objekt - kontejner - pro zobrazení 3D scény
15.11.2018 vjj 7 Viewport3D <Viewport3D> <ModelVisual3D> <Viewport3D> <Viewport3D.Children> <ModelVisual3D> <ModelVisual3D> <ModelVisual3D>... </Viewport3D.Children> <Viewport3D.Camera> </Viewport3D> <Viewport3D.Camera> </Viewport3D>
15.11.2018 vjj 8 <ModelVisual3D> <ModelVisual3D.Content> ModelVisual3D <GeometryModel3D> nebo <...Light... > nebo <Model3DGroup> </ModelVisual3D.Content> </ModelVisual3D>
15.11.2018 vjj 9 <Model3DGroup> Model3DGroup <GeometryModel3D> <GeometryModel3D> <GeometryModel3D> <GeometryModel3D>... <...Light... > </Model3DGroup>
GeometryModel3D 15.11.2018 vjj 10
15.11.2018 vjj 11 GeometryModel3D síťový model předmětů na scéně komponenty: Geometry Material - tvar - graffiti na přední straně BackMaterial - graffiti na zadní straně
15.11.2018 vjj 12 GeometryModel3D <GeometryModel3D> <GeometryModel3D.Geometry> <MeshGeometry3D Positions="4 1 0, 4 0 0, 0 1 0, 0 0 0" TriangleIndices=" 0 1 2, 1 3 2" /> </GeometryModel3D.Geometry> MeshGeometry <GeometryModel3D.Material> <DiffuseMaterial Brush="Cyan" /> </GeometryModel3D.Material> Material <GeometryModel3D.BackMaterial> <DiffuseMaterial Brush="Red" /> </GeometryModel3D.BackMaterial> </GeometryModel3D> BackMaterial
15.11.2018 vjj 13 Positions souřadnice bodů MeshGeometry3D TriangleIndices trojice bodů tvořících trojúhelník přední strana = counterclockwise zadní strana = clockwise TextureCoordinates mapování trojúhelníku na štětec Normals
15.11.2018 vjj 14 obdélník <MeshGeometry3D Positions ="4 1 0, 4 0 0, 0 1 0, 0 0 0" TriangleIndices ="0 1 2, 1 3 2" />
15.11.2018 vjj 15 obdélník (reverse) <MeshGeometry3D Y Positions ="4 1 0, 4 0 0, 0 1 0, 0 0 0" 2: 0,1,0 0: 4,1,0 3: 0,0,0 1: 4,0,0 X TriangleIndices ="0 1 2, 1 3 2" /> Z
15.11.2018 vjj 16 má mít každý trojúhelník kolik bodů? samostatné definice bodů pro vrcholy jednotlivých trojúhelníků, nebo mají trojúhelníky definice bodů sdílet? Positions ="4 1 0, 4 0 0, 0 1 0, 0 0 0" TriangleIndices ="0 1 2, 1 3 2" Positions ="4 1 0, 4 0 0, 0 1 0, 4 0 0, 0 0 0, 0 1 0" TriangleIndices ="0 1 2, 3 4 5"
material
15.11.2018 vjj 18 GeometryModel3D <GeometryModel3D> <GeometryModel3D.Geometry> <MeshGeometry3D Positions="4 1 0, 4 0 0, 0 1 0, 0 0 0" TriangleIndices=" 0 1 2, 1 3 2" /> </GeometryModel3D.Geometry> MeshGeometry <GeometryModel3D.Material> <DiffuseMaterial Brush="Cyan" /> </GeometryModel3D.Material> Material <GeometryModel3D.BackMaterial> <DiffuseMaterial Brush="Red" /> </GeometryModel3D.BackMaterial> </GeometryModel3D> BackMaterial
15.11.2018 vjj 19 material <GeometryModel3D.Material> <DiffuseMaterial Brush="Cyan" /> </GeometryModel3D.Material> <GeometryModel3D.BackMaterial> <DiffuseMaterial Brush="Red" /> </GeometryModel3D.BackMaterial>
15.11.2018 vjj 20 material DiffuseMaterial má stejnou barvu bez ohledu na to, odkud je pozorován jak moc je vidět záleží na osvětlení Brush EmissiveMaterial vyzařuje světlo, tj. nepotřebuje osvětlení k tomu, aby byl vidět, ale neosvětluje okolí SpecularMaterial zrcadlová plocha - záleží na tom, odkud je osvětlena a odkud je pozorována
15.11.2018 vjj 21 MaterialGroup je možné nadefinovat pro plochu více než jeden materiál (MaterialGroup) v takovém případě se aplikuje zobrazení jednotlivých materiálů postupně druhý a další materiál by neměly zakrývat podklad, viz např. DiffuseMaterial a SpecularMaterial
DiffuseMaterial 15.11.2018 vjj 22
15.11.2018 vjj 23??? jak vybarvit trojúhelník Color vs. Brush vs. AmbientColor štětec nemusí být jednobarevný, ale v tom případě vyžaduje TextureCoordinates gradient image tile drawing visual - štětec definovaný obdélníkovým kontejnerem directionallight Color + ambientlight AmbientColor Brush
15.11.2018 vjj 24 trojúhelník <GeometryModel3D> <GeometryModel3D.Geometry> <MeshGeometry3D Positions="0 0 0, 0 2 0, 1 2 0" TriangleIndices=" 0 1 2" /> (1,2,0) (2) (0) (1) </GeometryModel3D.Geometry> (0,0,0) (0,2,0) <GeometryModel3D.Material> <DiffuseMaterial Brush="Blue" /> </GeometryModel3D.Material> <GeometryModel3D.BackMaterial> <DiffuseMaterial Brush="... " /> </GeometryModel3D.BackMaterial> </GeometryModel3D>
15.11.2018 vjj 25 trojúhelník <GeometryModel3D> <GeometryModel3D.Geometry> <MeshGeometry3D Positions="0 0 0, 0 2 0, 1 2 0" TriangleIndices=" 0 1 2" /> (1,2,0) (2) (0) (1) </GeometryModel3D.Geometry> (0,0,0) (0,2,0) <GeometryModel3D.Material> <DiffuseMaterial Brush="... " /> </GeometryModel3D.Material> (0,0) <GeometryModel3D.BackMaterial> <DiffuseMaterial Brush="... " /> </GeometryModel3D.BackMaterial> </GeometryModel3D> (1,1)
15.11.2018 vjj 26 trojúhelník <GeometryModel3D> <GeometryModel3D.Geometry> <MeshGeometry3D Positions="0 0 0, 0 2 0, 1 2 0" (1,2,0) (2) TriangleIndices=" 0 1 2" (0) TextureCoordinates="0.2 0, 0.2 1, 1 0.6" /> (1) </GeometryModel3D.Geometry> (0,0,0) (0,2,0) <GeometryModel3D.Material> <DiffuseMaterial Brush="... " /> </GeometryModel3D.Material> (0,0) <GeometryModel3D.BackMaterial> <DiffuseMaterial Brush="... " /> </GeometryModel3D.BackMaterial> </GeometryModel3D> (1,1)
15.11.2018 vjj 27 trojúhelník <GeometryModel3D> <GeometryModel3D.Geometry> <MeshGeometry3D Positions="0 0 0, 0 2 0, 1 2 0" (1,2,0) (2) TriangleIndices=" 0 1 2" (0) TextureCoordinates="0.2 0, 0.2 1, 1 0.6" /> (1) </GeometryModel3D.Geometry> (0,0,0) (0,2,0) <GeometryModel3D.Material> <DiffuseMaterial Brush="... " /> </GeometryModel3D.Material> <GeometryModel3D.BackMaterial> <DiffuseMaterial Brush="... " /> </GeometryModel3D.BackMaterial> </GeometryModel3D> (0,0) (0.2,1) -> (1) (0.2,0) -> (0) (1,0.5) -> (2) (1,1)
EmissiveMaterial 15.11.2018 vjj 28
15.11.2018 vjj 29 EmissiveMaterial Color filtr (default = White) Brush vyzařované barvy (default = null) zvyšuje viditelnost o součin Brush * Color tj. zdánlivě má svoje vlastní osvětlení, takže bude vidět i když z vnějšku není vůbec osvětlen, např. pro ovládací prvky neosvětluje okolí nezakrývá podklad, takže se nedoporučuje používat samostatně, ale v MaterialGroup společně ještě s dalším materiálem, např. DiffuseMaterial Black
Emissive Material 15.11.2018 vjj 30
15.11.2018 vjj 31 Emissive Material <GeometryModel3D x:name="teapot"> <GeometryModel3D.Material> <EmissiveMaterial Brush="Green" /> </GeometryModel3D.Material>...
green Emissive over black Diffuse 15.11.2018 vjj 32
15.11.2018 vjj 33 green Emissive over black Diffuse <GeometryModel3D x:name="teapot"> <GeometryModel3D.Material> <MaterialGroup> <DiffuseMaterial Brush="Black" /> <EmissiveMaterial Brush="Green" /> </MaterialGroup> </GeometryModel3D.Material>...
SpecularMaterial 15.11.2018 vjj 36
15.11.2018 vjj 37 SpecularMaterial zrcadlová plocha odráží světelné zdroje, ale ne jiné objekty SpecularPower the degree to which a material reflects the lighting model as shine (default = 40) Color barevný filtr Brush barevný filtr (default = White) (default = null) nezakrývá podklad, takže se nedoporučuje používat samostatně, ale v MaterialGroup společně ještě s dalším materiálem, např. DiffuseMaterial Black záleží na Material Opacity Light Direction Light Color
sole white SpecularMaterial 15.11.2018 vjj 38
15.11.2018 vjj 39 sole white SpecularMaterial <GeometryModel3D x:name="teapot">... <GeometryModel3D.Material> <SpecularMaterial Brush="White" SpecularPower="40" /> </GeometryModel3D.Material>
white Specular over red Diffuse 15.11.2018 vjj 40
15.11.2018 vjj 41 white Specular over red Diffuse <GeometryModel3D x:name="teapot"> <GeometryModel3D.Material> <MaterialGroup> <DiffuseMaterial Brush="Red" /> <SpecularMaterial Brush="White" SpecularPower="40" /> </MaterialGroup> </GeometryModel3D.Material>
Light 15.11.2018 vjj 45
ModelVisual3D <ModelVisual3D> <ModelVisual3D.Content> <GeometryModel3D> </ModelVisual3D.Content> </ModelVisual3D> <ModelVisual3D> <ModelVisual3D.Content> <...Light...> </ModelVisual3D.Content> </ModelVisual3D> 15.11.2018 vjj 46
15.11.2018 vjj 47 ModelVisual3D <ModelVisual3D> <ModelVisual3D.Content> <Model3DGroup> <GeometryModel3D>... </GeometryModel3D> <...Light...> </Model3DGroup> </ModelVisual3D.Content> </ModelVisual3D>
15.11.2018 vjj 48 Ambient Color Directional Direction Point rozptýlené (default = White) směrové bodové Position ConstantAttenuation LinearAttenuation QuadraticAttenuation Range Spot InnerAngle OuterAngle reflektor Light
15.11.2018 vjj 49 Light <AmbientLight Color="White" /> <DirectionalLight Color="White" Direction="2,-3,-1" /> <PointLight <SpotLight Color="White" Position="0,0,2" LinearAttenuation="0.1" Range="20" /> (Constant.., Quadratic..) Color="White" Position="4 5 10" Direction="0 0-1" ConstantAttenuation="0.3" InnerConeAngle="30" OuterConeAngle="45" />
AmbientLight 15.11.2018 vjj 50
kvádr 15.11.2018 vjj 51
15.11.2018 vjj 52 kvádr 1. verze pouze ambientní osvětlení body pro vrcholy definice bodů jsou sdílené 2. verze pouze ambientní osvětlení body pro vrcholy každý obdélník má individuální množinu definic bodů výsledek je v obou případech stejný
DirectionalLight 15.11.2018 vjj 53
15.11.2018 vjj 54 3. verze kvádr směrové osvětlení obdélníky sdílejí definice vrcholů
Shared Vertices Square Cuboid 15.11.2018 vjj 55
15.11.2018 vjj 56 4. verze kvádr směrové osvětlení každý obdélník má svou vlastní množinu vrcholů
kvádr 15.11.2018 vjj 57
15.11.2018 vjj 58 1. verze: Convex Surface každý obdélník má svou vlastní množinu definic vrcholů
hexadekagon 15.11.2018 vjj 59
15.11.2018 vjj 60 2. verze: sdílené definice vrcholů Convex Surface viditelné různě jasné trojúhelníky v obdélníku
hexadekagon with shared vertices 15.11.2018 vjj 61
15.11.2018 vjj 62 předchozí verze: Convex Surface bez explicitní definice normál ve vrcholu je automaticky dopočítána normála jako geometrický průměr normál všech trojúhelníků, které vrchol sdílejí, každý vrchol je sdílen třemi trojúhelníky tj. v tomto případě jsou normály pootočené vždy k tomu obdélníku, jehož oba trojúhelníky vrchol sdílejí
Triangle with Normals 15.11.2018 vjj 63
15.11.2018 vjj 64 Triangle with Normals <MeshGeometry3D Positions="0 0 0, 2 0 0, 1 2 0" TriangleIndices=" 0 1 2" Normals="0 0 1, 2 0 1, 0 10 1" /> <DirectionalLight Color="White" Direction="0 0-1" />
15.11.2018 vjj 65 Convex Surface 3. verze: definice správně spočítaných normál Mach bands along the boundary between adjacent shades of the same color, the darker area falsely appear even darker and the lighter area falsely appear even lighter
hexadekagon with normals 15.11.2018 vjj 66
sole DirectionalLight 15.11.2018 vjj 67
Directional + Ambient 15.11.2018 vjj 68
15.11.2018 vjj 69 Directional + Ambient <ModelVisual3D x:name="light"> <ModelVisual3D.Content> <Model3DGroup> <DirectionalLight/> <AmbientLight Color="#FF555555" /> </Model3DGroup> </ModelVisual3D.Content> </ModelVisual3D>
15.11.2018 vjj 70 výpočet barvy pixelu pro difuzní materiál
15.11.2018 vjj 71 1. light attenuation Attenuation = ConstantAttenuation + LinearAttenuation * distance + QuadraticAttenuation * distance ^ 2 default values: ConstantAttenuation = 1 LinearAttenuation = 0 QuadraticAttenuation = 0
15.11.2018 vjj 72 1. intenzita dopadajícího světla if (Attenuation < 0) no light at all if (Attenuation > 1) { Light intensity at given distance = Light / Attenuation }
15.11.2018 vjj 73 Diffuse Material Lambert's cosine law 2. Normals intenzita odraženého světla = normal factor * intenzita dopadajícího světla normal factor = - cos (úhel mezi normálou a vektorem dopadu) Gouraud shading 1. výpočet pouze ve vrcholech trojúhelníků 2. Interpolace na hranách 3. Interpolace na ploše
four normals - Gouraud shading 15.11.2018 vjj 74
15.11.2018 vjj 75 3. DiffuseMaterial Color color filter for the material's texture [default: White] AmbientColor how the material reflects AmbientLight [default: White] Brush material
15.11.2018 vjj 76 finalcolor = 3.a. Color DirectionalLight1 * normalfactor * DiffuseMaterial.Color + DirectionalLight2 * normalfactor * DiffuseMaterial.Color +... + AmbientLight1 * DiffuseMaterial.AmbientColor + AmbientLight2 * DiffuseMaterial.AmbientColor +...
15.11.2018 vjj 77 Color = finalcolor 3.b. Brush * DiffuseMaterial.Brush.Color
SpotLight 15.11.2018 vjj 78
15.11.2018 vjj 79 SpotLight vnitřní kužel standardní výpočet osvětlení (Attenuation, normály) vně vnějšího kužele tma mezikruží interpolace k tomu, aby byl jako výsledek kuželovitého osvětlení vidět "kruh", musí být osvětlená plocha poskládána z co nejvíce malých segmentů
SpotLight 15.11.2018 vjj 80
SpotLight 15.11.2018 vjj 81
SpotLight <!-- ================================================ SpotLightDemo.xaml (c) 2007 by Charles Petzold ================================================ --> <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" WindowTitle="SpotLight Demo" Title="SpotLight Demo"> <Viewport3D> <ModelVisual3D> <ModelVisual3D.Content> <GeometryModel3D> <GeometryModel3D.Geometry> <MeshGeometry3D Positions= "0 0 0, 1 0 0, 2 0 0, 3 0 0, 4 0 0, 5 0 0, 6 0 0, 7 0 0, 8 0 0, 9 0 0, 0 1 0, 1 1 0, 2 1 0, 3 1 0, 4 1 0, 5 1 0, 6 1 0, 7 1 0, 8 1 0, 9 1 0, 0 2 0, 1 2 0, 2 2 0, 3 2 0, 4 2 0, 5 2 0, 6 2 0, 7 2 0, 8 2 0, 9 2 0, 0 3 0, 1 3 0, 2 3 0, 3 3 0, 4 3 0, 5 3 0, 6 3 0, 7 3 0, 8 3 0, 9 3 0, 0 4 0, 1 4 0, 2 4 0, 3 4 0, 4 4 0, 5 4 0, 6 4 0, 7 4 0, 8 4 0, 9 4 0, 0 5 0, 1 5 0, 2 5 0, 3 5 0, 4 5 0, 5 5 0, 6 5 0, 7 5 0, 8 5 0, 9 5 0, 0 6 0, 1 6 0, 2 6 0, 3 6 0, 4 6 0, 5 6 0, 6 6 0, 7 6 0, 9 6 0, 9 6 0, 0 7 0, 1 7 0, 2 7 0, 3 7 0, 4 7 0, 5 7 0, 6 7 0, 7 7 0, 8 7 0, 9 7 0, 0 8 0, 1 8 0, 2 8 0, 3 8 0, 4 8 0, 5 8 0, 6 8 0, 7 8 0, 8 8 0, 9 8 0, 0 9 0, 1 9 0, 2 9 0, 3 9 0, 4 9 0, 5 9 0, 6 9 0, 7 9 0, 8 9 0, 9 9 0" TriangleIndices=" 0 1 10, 1 2 11, 2 3 12, 3 4 13, 4 5 14, 5 6 15, 6 7 16, 7 8 17, 8 9 18, 1 11 10, 2 12 11, 3 13 12, 4 14 13, 5 15 14, 6 16 15, 7 17 16, 8 18 17, 9 19 18, 10 11 20,11 12 21,12 13 22,13 14 23,14 15 24,15 16 25,16 17 26,17 18 27,18 19 28, 11 21 20,12 22 21,13 23 22,14 24 23,15 25 24,16 26 25,17 27 26,18 28 27,19 29 28, 20 21 30,21 22 31,22 23 32,23 24 33,24 25 34,25 26 35,26 27 36,27 28 37,28 29 38, 21 31 30,22 32 31,23 33 32,24 34 33,25 35 34,26 36 35,27 37 36,28 38 37,29 39 38, 30 31 40,31 32 41,32 33 42,33 34 43,34 35 44,35 36 45,36 37 46,37 38 47,38 39 48, 31 41 40,32 42 41,33 43 42,34 44 43,35 45 44,36 46 45,37 47 46,38 48 47,39 49 48, 40 41 50,41 42 51,42 43 52,43 44 53,44 45 54,45 46 55,46 47 56,47 48 57,48 49 58, 15.11.2018 vjj 82
Camera 15.11.2018 vjj 83
15.11.2018 vjj 84 Camera <Viewport3D>...... <Viewport3D.Camera> <...Camera...> </Viewport3D.Camera> </Viewport3D>
15.11.2018 vjj 85 Camera PerspectiveCamera Position LookDirection UpDirection FieldOfView úhel záběru ve stupních NearPlane Distance FarPlaneDistance OrtographicCamera MatrixCamera
Camera 15.11.2018 vjj 86
15.11.2018 vjj 87 PerspectiveCamera <Viewport3D.Camera> <PerspectiveCamera Position="10,-2,20" LookDirection="-10,2,-20" UpDirection="0,0,1" FieldOfView="60" NearPlaneDistance="1" FarPlaneDistance="100" /> </Viewport3D.Camera>
15.11.2018 vjj 88 <Viewport3D>... OrthographicCamera <Viewport3D.Camera> <OrthographicCamera Position="-2 2 4" LookDirection="2-1.25-4" UpDirection="0 1 0" Width="5" /> </Viewport3D.Camera> </Viewport3D>
15.11.2018 vjj 89 MatrixCamera ViewMatrix A Matrix3D that represents the position, look direction and up vector for the camera m11, m12, m13, m14 m21, m22, m23, m24 m31, m32, m33, m34 offsetx, offsety, offsetz, m44 ProjectionMatrix Transform Transform3D: AxisAngleRotation3D QuaternionRotation3D
15.11.2018 vjj 93 GeometryModel3D <Page.Resources> <GeometryModel3D x:key="name">... </GeometryModel3D> </Page.Resources> <Viewport3D> <ModelVisual3D Content="{StaticResource name}"> <ModelVisual3D.Transform> <...Transform... /> </ModelVisual3D.Transform> </ModelVisual3D>... </Viewport3D>
15.11.2018 vjj 94 GeometryModel3D <Page.Resources> <MeshGeometry3D x:key="name1" Positions="..." TriangleIndices="..." /> <DiffuseMaterial x:key="name2" Brush="Gray" /> </Page.Resources> <Viewport3D> <ModelVisual3D.Content> <Model3DGroup> <GeometryModel3D Geometry="{StaticResource name1}" Material="{StaticResource name2}"> </GeometryModel3D> <Model3DGroup> </ModelVisual3D.Content>... </Viewport3D>