<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:MarsaX"
x:Class="MarsaX.ucslideImages3DViewPort"
Height="auto" Width="auto" MinHeight="200" MinWidth="200">
<UserControl.Resources>
<!-- SideButtons +/- buttons -->
<ControlTemplate x:Key="SideButtons" TargetType="{x:Type Button}">
<Border x:Name="bord" HorizontalAlignment="Right" Margin="{TemplateBinding Margin}"
VerticalAlignment="Top" Width="40" Height="40"
BorderBrush="#FFFFFFFF" BorderThickness="3,3,0,3"
Background="{StaticResource backgroundGradientBrush}"
CornerRadius="5,0,0,5">
<Label Width="34" Height="34" Content="{TemplateBinding Content}"
FontFamily="Arial Rounded MT" FontSize="30"
FontWeight="Bold" Foreground="#FFFFFFFF"
HorizontalAlignment="Center" Margin="0,0,0,10" VerticalAlignment="Center"
HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="bord" Property="BitmapEffect">
<Setter.Value>
<OuterGlowBitmapEffect GlowColor="#FF0274C2" GlowSize="15"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<!-- Show Search Area Animation -->
<Storyboard x:Key="OnShowSearchArea">
<ThicknessAnimationUsingKeyFrames BeginTime="00:00:00"
Storyboard.TargetName="SearchArea"
Storyboard.TargetProperty="(FrameworkElement.Margin)">
<SplineThicknessKeyFrame KeyTime="00:00:00" Value="0,9,-500,-9"/>
<SplineThicknessKeyFrame KeyTime="00:00:00.5000000" Value="0,9,-10,-9"/>
<SplineThicknessKeyFrame KeyTime="00:00:01" Value="0,9,0,-9"/>
</ThicknessAnimationUsingKeyFrames>
</Storyboard>
<!-- Hide Search Area Animation -->
<Storyboard x:Key="OnHideSearchArea">
<ThicknessAnimationUsingKeyFrames BeginTime="00:00:00"
Storyboard.TargetName="SearchArea"
Storyboard.TargetProperty="(FrameworkElement.Margin)">
<SplineThicknessKeyFrame KeyTime="00:00:00" Value="0,9,0,-9"/>
<SplineThicknessKeyFrame KeyTime="00:00:00.5000000" Value="0,9,-490,-9"/>
<SplineThicknessKeyFrame KeyTime="00:00:01" Value="0,9,-500,-9"/>
</ThicknessAnimationUsingKeyFrames>
</Storyboard>
</UserControl.Resources>
<!-- MAIN LAYOUT -->
<Grid Background="{StaticResource backgroundBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="120"/>
<RowDefinition Height="*"/>
<RowDefinition Height="30"/>
</Grid.RowDefinitions>
<DockPanel Grid.Row="0" Grid.Column="0" LastChildFill="True" VerticalAlignment="Top" Height="120"
Background="{StaticResource backgroundBrush}" >
<Grid DockPanel.Dock="Right" Width="700" Background="{StaticResource backgroundBrush}"
HorizontalAlignment="Right">
<!-- Search Area-->
<Canvas HorizontalAlignment="Right" x:Name="SearchArea" Width="500"
Background="Transparent" Margin="0,9,-500,-9">
<Border x:Name="bord" CornerRadius="5,0,0,5" BorderBrush="White"
BorderThickness="3,3,0,3" Width="{Binding ElementName=SearchArea, Path=ActualWidth}"
Height="{Binding ElementName=SearchArea, Path=ActualHeight}"
Background="{StaticResource backgroundGradientBrush}"
Visibility="Visible" Canvas.ZIndex="0"/>
<!-- Keyword textbox -->
<StackPanel Orientation="Vertical" Canvas.Left="8" Canvas.Top="4" Canvas.ZIndex="1">
<Label Content="Keyword" Foreground="White" VerticalAlignment="Center"
FontFamily="Arial Rounded MT" FontSize="10" FontWeight="Bold" Margin="2" />
<TextBox x:Name="txtKeyWord" UndoLimit="1" Width="150" MaxLength="20"
VerticalAlignment="Center" Margin="2" KeyDown="txtKeyWord_KeyDown"/>
</StackPanel>
<StackPanel x:Name="spSearchButtons" Orientation="Horizontal" Canvas.Left="8" Canvas.Top="60"
Canvas.ZIndex="1" ButtonBase.Click="SearchAreaButton_Click">
<Button x:Name="btnLatest" Template="{StaticResource SearchButton}" Margin="0,8,8,8"
Content="Latest" Tag="images/flickr.png" Width="120" Height="30"/>
<Button x:Name="btnInteresting" Template="{StaticResource SearchButton}" Margin="8,8,8,8"
Content="Most Interesting" Tag="images/flickr.png" Width="120" Height="30"/>
<Button x:Name="btnKeyWord" Template="{StaticResource SearchButton}" Margin="8,8,8,8"
Content="Use Keyword" Tag="images/flickr.png" Width="120" Height="30"/>
</StackPanel>
</Canvas>
<StackPanel Orientation="Vertical" HorizontalAlignment="Right" Width="60" Background="Transparent">
<Button x:Name="btnPlus" Margin="0,10,-2,0" Content="+" Template="{StaticResource SideButtons}"
Click="btnPlus_Click"/>
<Button x:Name="btnMinus" Margin="0,10,-2,0" Content="-" Template="{StaticResource SideButtons}"
Click="btnMinus_Click"/>
</StackPanel>
</Grid>
<Canvas Background="Transparent" HorizontalAlignment="Left" Width="400">
<Image Source="images/logo.png" Width="368" Height="121" Canvas.Left="20" Canvas.Top="15"/>
</Canvas>
</DockPanel>
<Grid Grid.Row="1" Grid.Column="0" x:Name="mainGrid">
<!-- Viewport3D -->
<Viewport3D x:Name="vp" >
<!-- Camera -->
<Viewport3D.Camera>
<PerspectiveCamera x:Name="camera" Position="3,-0.5,4" LookDirection="0,0,-1" FieldOfView="90" />
</Viewport3D.Camera>
<!-- Lights -->
<ModelVisual3D>
<ModelVisual3D.Content>
<Model3DGroup>
<DirectionalLight Color="#444" Direction="0,0,-1" />
<AmbientLight Color="#BBB" />
</Model3DGroup>
</ModelVisual3D.Content>
</ModelVisual3D>
<!-- Container to hold child models -->
<ContainerUIElement3D x:Name="container">
<ContainerUIElement3D.Transform>
<Transform3DGroup>
<TranslateTransform3D x:Name="contTrans" OffsetX="0" OffsetY="0" OffsetZ="0"/>
<ScaleTransform3D ScaleX="1" ScaleY="1" ScaleZ="1"/>
<RotateTransform3D>
<RotateTransform3D.Rotation>
<AxisAngleRotation3D x:Name="contAngle" Angle="0" Axis="0,1,0"/>
</RotateTransform3D.Rotation>
</RotateTransform3D>
</Transform3DGroup>
</ContainerUIElement3D.Transform>
</ContainerUIElement3D>
</Viewport3D>
<local:ucLoading x:Name="ucLoader" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Grid>
<StackPanel x:Name="controlsArea" Orientation="Horizontal" Grid.Row="2" HorizontalAlignment="Center">
<!-- SLIDE AREA -->
<StackPanel Orientation="Horizontal">
<Label Content="Slide To Position" Foreground="White" FontFamily="Arial Rounded MT" FontSize="10"
FontWeight="Bold"
VerticalAlignment="Center" Margin="10,0,0,0"/>
<!-- Slider to move ContainerUIElement3D -->
<Slider x:Name="slideImages" Minimum="0" Maximum="{x:Static local:Constants.COLUMNSTOSHOW}"
Background="Black" ValueChanged="slideImages_ValueChanged" Width="200"
Height="20" Margin="10,0,0,0" >
<Slider.Template>
<ControlTemplate TargetType="Slider">
<Grid>
<Grid.Background>
<!-- Tile background to show the boxes -->
<DrawingBrush
Viewport="0,0,5,5"
ViewportUnits="Absolute"
TileMode="Tile">
<DrawingBrush.Drawing>
<DrawingGroup>
<GeometryDrawing Brush="{StaticResource backgroundBrush}">
<GeometryDrawing.Geometry>
<RectangleGeometry Rect="0,0,100,100" />
</GeometryDrawing.Geometry>
</GeometryDrawing>
<GeometryDrawing Brush="White">
<GeometryDrawing.Geometry>
<GeometryGroup>
<RectangleGeometry Rect="50,50,50,50" />
</GeometryGroup>
</GeometryDrawing.Geometry>
</GeometryDrawing>
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Grid.Background>
<Track Name="PART_Track">
<Track.Resources>
<Style TargetType="RepeatButton">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="RepeatButton">
<Border Background="{TemplateBinding Background}" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Track.Resources>
<Track.DecreaseRepeatButton>
<RepeatButton Background="Transparent"
Command="Slider.DecreaseLarge" />
</Track.DecreaseRepeatButton>
<Track.Thumb>
<Thumb Width="20" Background="DarkGray" Opacity="0.7" />
</Track.Thumb>
<Track.IncreaseRepeatButton>
<RepeatButton
Background="Transparent"
Command="Slider.IncreaseLarge" />
</Track.IncreaseRepeatButton>
</Track>
</Grid>
</ControlTemplate>
</Slider.Template>
</Slider>
</StackPanel>
<!-- ZOOM AREA -->
<StackPanel Orientation="Horizontal">
<Label Content="Zoom" Foreground="White" FontFamily="Arial Rounded MT" FontSize="10" FontWeight="Bold"
VerticalAlignment="Center" Margin="10,0,0,0"/>
<!-- Slider to Zoom -->
<Slider x:Name="slideZoom" Minimum="4" Maximum="10" Background="Black" Orientation="Vertical"
Width="20" Height="20" Margin="10,0,0,0" ValueChanged="slideZoom_ValueChanged" >
<Slider.Template>
<ControlTemplate TargetType="Slider">
<Grid Background="{StaticResource backgroundBrush}">
<Track Name="PART_Track">
<Track.Resources>
<Style TargetType="RepeatButton">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="RepeatButton">
<Border Background="{TemplateBinding Background}" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Track.Resources>
<Track.DecreaseRepeatButton>
<RepeatButton Background="White" Width="6" HorizontalAlignment="Center"
Command="Slider.DecreaseLarge" />
</Track.DecreaseRepeatButton>
<Track.Thumb>
<Thumb Width="12" Height="6" Background="White" Opacity="1.0" />
</Track.Thumb>
<Track.IncreaseRepeatButton>
<RepeatButton
Background="White" Width="6" HorizontalAlignment="Center"
Command="Slider.IncreaseLarge" />
</Track.IncreaseRepeatButton>
</Track>
</Grid>
</ControlTemplate>
</Slider.Template>
</Slider>
</StackPanel>
</StackPanel>
</Grid>
</UserControl>
Submit an article or tip