Results 1 to 3 of 3

Thread: XAML 3D Cube Not Showing Correct.

  1. #1
    f15e is offline VB.NET Forum Newbie
    .NET Framework
    .NET 2.0 (VS 2005)
    Join Date
    May 2006
    Posts
    21
    Reputation
    134

    XAML 3D Cube Not Showing Correct.

    I've been writing desktop apps in VB for personal use for quite a while now. I recently started to dabble in the 3D world using XAML and decided to start off by creating a basic 3D cube with each cube face having a different color. I have run into some problems and now am asking for your help. Some of the cube faces only show up with one of the two triangles visible or the cube face won't show up at all no matter how I adjust the code. There is something I am missing but don't know what it is. I'm thinking that it may be the order I put the "MeshGeometry3D Positions" or the "TriangleIndices" (i.e. counter-clockwise). I also think that I have too many "MeshGeometry3D Positions" points for some of the cube faces but for some reason it seems to work; but not in all cases. It's best if I show you my code and hopefully someone could point out my mistakes and what I'm doing wrong. See code below with screen shot. I'd really appreciate any help you could provide.

    <!-- ************************************************** ************************************************** ****** -->
    <Window x:Class="MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    WindowState="Maximized"
    Background="Black">


    <Viewport3D>
    <Viewport3D.Camera>
    <PerspectiveCamera Position="30,25,30" LookDirection="-30,-25,-30" FieldOfView="60"/>

    </Viewport3D.Camera>

    <Viewport3D.Children>

    <ModelVisual3D x:Name="Light">
    <ModelVisual3D.Content>
    <AmbientLight Color="White"/>
    </ModelVisual3D.Content>
    </ModelVisual3D>

    <ModelVisual3D>
    <ModelVisual3D.Content>
    <Model3DGroup x:Name="House">


    <!-- ************************************************** ************************************************** ****** -->
    <GeometryModel3D x:Name="CubeSide_1">

    <GeometryModel3D.Material>
    <DiffuseMaterial Brush="Red"/>
    </GeometryModel3D.Material>

    <GeometryModel3D.BackMaterial>
    <DiffuseMaterial Brush="Red"/>
    </GeometryModel3D.BackMaterial>

    <GeometryModel3D.Geometry>
    <MeshGeometry3D Positions="0,0,0 5,0,0 5,5,0 0,0,0 0,5,0 5,5,0"
    TriangleIndices="0 2 1 0 4 2"/>
    </GeometryModel3D.Geometry>

    </GeometryModel3D>
    <!-- ************************************************** ************************************************** ****** -->
    <GeometryModel3D x:Name="CubeSide_2">

    <GeometryModel3D.Material>
    <DiffuseMaterial Brush="Blue"/>
    </GeometryModel3D.Material>

    <GeometryModel3D.BackMaterial>
    <DiffuseMaterial Brush="Blue"/>
    </GeometryModel3D.BackMaterial>

    <GeometryModel3D.Geometry>
    <MeshGeometry3D Positions="0,0,0 0,5,5 0,5,0 0,0,0 0,0,5 0,5,5 0,5,0"
    TriangleIndices="0 5 4 0 5 6"/>
    </GeometryModel3D.Geometry>

    </GeometryModel3D>
    <!-- ************************************************** ************************************************** ****** -->
    <GeometryModel3D x:Name="CubeSide_3">

    <GeometryModel3D.Material>
    <DiffuseMaterial Brush="Orange"/>
    </GeometryModel3D.Material>

    <GeometryModel3D.BackMaterial>
    <DiffuseMaterial Brush="Orange"/>
    </GeometryModel3D.BackMaterial>

    <GeometryModel3D.Geometry>
    <MeshGeometry3D Positions="0,0,0 5,0,5 5,0,0 0,0,0 5,0,5 0,0,5 0,0,0"
    TriangleIndices="0 7 1 0 7 6"/>
    </GeometryModel3D.Geometry>

    </GeometryModel3D>
    <!-- ************************************************** ************************************************** ****** -->
    <GeometryModel3D x:Name="CubeSide_4">

    <GeometryModel3D.Material>
    <DiffuseMaterial Brush="Purple"/>
    </GeometryModel3D.Material>

    <GeometryModel3D.BackMaterial>
    <DiffuseMaterial Brush="Purple"/>
    </GeometryModel3D.BackMaterial>

    <GeometryModel3D.Geometry>
    <MeshGeometry3D Positions="5,5,5 5,5,0 0,5,0 5,5,5 0,5,0 0,5,5"
    TriangleIndices="3 2 4 3 4 5"/>
    </GeometryModel3D.Geometry>

    </GeometryModel3D>
    <!-- ************************************************** ************************************************** ****** -->
    <GeometryModel3D x:Name="CubeSide_5">

    <GeometryModel3D.Material>
    <DiffuseMaterial Brush="Yellow"/>
    </GeometryModel3D.Material>

    <GeometryModel3D.BackMaterial>
    <DiffuseMaterial Brush="Yellow"/>
    </GeometryModel3D.BackMaterial>

    <GeometryModel3D.Geometry>
    <MeshGeometry3D Positions="5,5,5 5,0,0 5,5,0 5,5,5 5,0,0 5,0,5 5,5,5"
    TriangleIndices="3 1 2 3 7 1"/>
    </GeometryModel3D.Geometry>

    </GeometryModel3D>
    <!-- ************************************************** ************************************************** ****** -->
    <GeometryModel3D x:Name="CubeSide_6">

    <GeometryModel3D.Material>
    <DiffuseMaterial Brush="Green"/>
    </GeometryModel3D.Material>

    <GeometryModel3D.BackMaterial>
    <DiffuseMaterial Brush="Green"/>
    </GeometryModel3D.BackMaterial>

    <GeometryModel3D.Geometry>
    <MeshGeometry3D Positions="0,0,5 5,0,5 0,5,5 5,5,5"
    TriangleIndices="1 3 0 0 3 2"/>
    </GeometryModel3D.Geometry>

    </GeometryModel3D>
    <!-- ************************************************** ************************************************** ****** -->
    </Model3DGroup>
    </ModelVisual3D.Content>
    </ModelVisual3D>
    </Viewport3D.Children>
    </Viewport3D>
    </Window>
    <!-- ************************************************** ************************************************** ****** -->

    3D Cube.jpg

    3D Cube Screenshot 1.jpg

    3D Cube Screenshot 2.jpg

    3D Cube Screenshot 3.jpg
    Last edited by f15e; 12-30-2014 at 11:54 PM.

  2. #2
    Herman is offline VB.NET Forum Idol
    .NET Framework
    .NET 4.0
    Join Date
    Oct 2011
    Location
    Montreal, QC, CA
    Posts
    865
    Reputation
    1211
    I think you misunderstand how to use the TriangleIndices property. Also your XAML is long a tedious to read. Use resources when it makes sense, and use the short form when possible, it makes everything clearer. Also try to avoid naming things Side_1 etc, it's not descriptive and hard to read..

    Here is your cube, redone:

    <Window x:Class="MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:clr="clr-namespace:System;assembly=mscorlib"
    Title="MainWindow" Height="407" Width="515">

    <Grid Background="Black" Margin="0">

    <Viewport3D>
    <Viewport3D.Camera>
    <PerspectiveCamera x:Name="camera" Position="30,25,30" LookDirection="-30,-25,-30" UpDirection="0,1,0" FieldOfView="20" />
    </Viewport3D.Camera>

    <Viewport3D.Resources>
    <!--Define two variables for the opacity, one for the three back faces, another for the 3 front faces.-->
    <clr:Double x:Key="alphaFront">0.7</clr:Double>
    <clr:Double x:Key="alphaBack">1</clr:Double>
    <!--Define our brushes and set opacity to the appropriate level.-->
    <SolidColorBrush x:Key="brRed" Color="Red" Opacity="{StaticResource alphaBack}" />
    <SolidColorBrush x:Key="brBlue" Color="Blue" Opacity="{StaticResource alphaBack}" />
    <SolidColorBrush x:Key="brOrange" Color="Orange" Opacity="{StaticResource alphaBack}" />
    <SolidColorBrush x:Key="brYellow" Color="Yellow" Opacity="{StaticResource alphaFront}" />
    <SolidColorBrush x:Key="brGreen" Color="Green" Opacity="{StaticResource alphaFront}" />
    <SolidColorBrush x:Key="brPurple" Color="Purple" Opacity="{StaticResource alphaFront}" />
    <!--Define our painted materials using the brushes above.-->
    <DiffuseMaterial x:Key="matRed" Brush="{StaticResource brRed}" />
    <DiffuseMaterial x:Key="matBlue" Brush="{StaticResource brBlue}" />
    <DiffuseMaterial x:Key="matOrange" Brush="{StaticResource brOrange}" />
    <DiffuseMaterial x:Key="matGreen" Brush="{StaticResource brGreen}" />
    <DiffuseMaterial x:Key="matYellow" Brush="{StaticResource brYellow}" />
    <DiffuseMaterial x:Key="matPurple" Brush="{StaticResource brPurple}" />
    <!--Define the mesh geometry for each side of the cube.-->
    <MeshGeometry3D x:Key="meshRedSide" Positions="0,0,0 5,0,0 5,5,0 0,5,0" TriangleIndices="0 1 2 0 3 2" />
    <MeshGeometry3D x:Key="meshBlueSide" Positions="0,0,0 0,5,0 0,5,5 0,0,5" TriangleIndices="0 1 2 0 3 2" />
    <MeshGeometry3D x:Key="meshOrangeSide" Positions="0,0,0 0,0,5 5,0,5 5,0,0" TriangleIndices="0 1 2 0 2 3" />
    <MeshGeometry3D x:Key="meshYellowSide" Positions="5,5,5 5,0,0 5,5,0 5,0,5" TriangleIndices="0 1 2 0 1 3" />
    <MeshGeometry3D x:Key="meshGreenSide" Positions="0,0,5 0,5,5 5,5,5 5,0,5" TriangleIndices="0 3 2 2 1 0" />
    <MeshGeometry3D x:Key="meshPurpleSide" Positions="0,5,0 0,5,5 5,5,0 5,5,5" TriangleIndices="0 1 2 2 3 1" />
    </Viewport3D.Resources>

    <Viewport3D.Children>

    <!--Our basic ambient light source. Could add more light sources in here...-->
    <ModelVisual3D x:Name="Light">
    <ModelVisual3D.Content>
    <AmbientLight Color="White" />
    </ModelVisual3D.Content>
    </ModelVisual3D>

    <ModelVisual3D x:Name="House">
    <ModelVisual3D.Content>

    <!--Here we define the 3D faces and group them into a cube. Take care of the order you add
    each GeometryModel3D! Always start with the faces in the back, otherwise they will not be
    rendered if they are hidden behind front faces when you add them. For an example of this,
    move the OrangeSide in between GreenSide and PurpleSide. Since the front faces already exist,
    and completely obstruct OrangeSide, it is never rendered.-->
    <Model3DGroup x:Name="grpCube">
    <GeometryModel3D x:Name="RedSide" Geometry="{StaticResource meshRedSide}"
    Material="{StaticResource matRed}" BackMaterial="{StaticResource matRed}" />

    <GeometryModel3D x:Name="BlueSide" Geometry="{StaticResource meshBlueSide}"
    Material="{StaticResource matBlue}" BackMaterial="{StaticResource matBlue}" />

    <GeometryModel3D x:Name="OrangeSide" Geometry="{StaticResource meshOrangeSide}"
    Material="{StaticResource matOrange}" BackMaterial="{StaticResource matOrange}" />

    <GeometryModel3D x:Name="YellowSide" Geometry="{StaticResource meshYellowSide}"
    Material="{StaticResource matYellow}" BackMaterial="{StaticResource matYellow}" />

    <GeometryModel3D x:Name="GreenSide" Geometry="{StaticResource meshGreenSide}"
    Material="{StaticResource matGreen}" BackMaterial="{StaticResource matGreen}" />

    <GeometryModel3D x:Name="PurpleSide" Geometry="{StaticResource meshPurpleSide}"
    Material="{StaticResource matPurple}" BackMaterial="{StaticResource matPurple}" />

    </Model3DGroup>

    </ModelVisual3D.Content>
    </ModelVisual3D>

    </Viewport3D.Children>

    </Viewport3D>

    </Grid>
    </Window>



    And the result:

    Last edited by Herman; 12-31-2014 at 4:08 PM. Reason: Added transparency!

  3. #3
    f15e is offline VB.NET Forum Newbie
    .NET Framework
    .NET 2.0 (VS 2005)
    Join Date
    May 2006
    Posts
    21
    Reputation
    134
    Thanks for the help Herman!

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •