Free Trial

Safari Books Online is a digital library providing on-demand subscription access to thousands of learning resources.

  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Chapter 48. Level > The Main Page

The Main Page

Besides the same calibration page used by Moo Can and shown in the preceding chapter, Level only has the single main page. Listing 48.3 contains the XAML for the main page, and Listing 48.4 contains its code-behind.

Listing 48.3. MainPage.xaml—The User Interface for Level’s Main Page

<phone:PhoneApplicationPage x:Class="WindowsPhoneApp.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:local="clr-namespace:WindowsPhoneApp"
    SupportedOrientations="Portrait">
  <Grid>
    <Grid.Background>
      <!-- The metallic background -->
      <ImageBrush ImageSource="Images/background.png"/>
    </Grid.Background>

    <!-- The four lines in the middle that don't move -->
    <Line Y1="240" Y2="290" X1="240" X2="240" Stroke="#555" StrokeThickness="6"/>
    <Line Y1="510" Y2="560" X1="240" X2="240" Stroke="#555" StrokeThickness="6"/>
    <Line Y1="400" Y2="400" X1="80" X2="130" Stroke="#555" StrokeThickness="6"/>
    <Line Y1="400" Y2="400" X1="350" X2="400" Stroke="#555" StrokeThickness="6"/>

    <!-- The four lines that tilt based on the phone's angle -->
    <Canvas RenderTransformOrigin=".5,.5" Width="480" Height="800">
      <Canvas.RenderTransform>
        <RotateTransform x:Name="CenterTransform" Angle="45"/>
      </Canvas.RenderTransform>
      <Line Y1="240" Y2="290" X1="240" X2="240"
            Stroke="{StaticResource PhoneAccentBrush}" StrokeThickness="6"/>
      <Line Y1="510" Y2="560" X1="240" X2="240"
            Stroke="{StaticResource PhoneAccentBrush}" StrokeThickness="6"/>
      <Line Y1="400" Y2="400" X1="80" X2="130"
            Stroke="{StaticResource PhoneAccentBrush}" StrokeThickness="6"/>
      <Line Y1="400" Y2="400" X1="350" X2="400"
            Stroke="{StaticResource PhoneAccentBrush}" StrokeThickness="6"/>
    </Canvas>

    <!-- The display for the exact angle -->
    <TextBlock x:Name="AngleTextBlock" Foreground="#555"
               HorizontalAlignment="Center" VerticalAlignment="Center"
               FontSize="{StaticResource PhoneFontSizeExtraExtraLarge}"
               RenderTransformOrigin=".5,.5">
      <TextBlock.RenderTransform>
        <RotateTransform x:Name="AngleTextBlockTransform"/>
      </TextBlock.RenderTransform>
    </TextBlock>

    <!-- The circle in the center -->
    <Ellipse Width="220" Height="220" Stroke="#555" StrokeThickness="6"/>

    <!-- The four bubble level displays -->

    <local:BubbleWindow x:Name="TopWindow" Width="275" Height="75"
                        VerticalAlignment="Top"/>

    <local:BubbleWindow x:Name="BottomWindow" Width="275" Height="75"
                        VerticalAlignment="Bottom"/>

    <local:BubbleWindow x:Name="LeftWindow" Width="622" Height="75"
     HorizontalAlignment="Left" Margin="-274,0,0,0" RenderTransformOrigin=".5,.5">
      <local:BubbleWindow.RenderTransform>
        <CompositeTransform Rotation="-90"/>
      </local:BubbleWindow.RenderTransform>
    </local:BubbleWindow>

    <local:BubbleWindow x:Name="RightWindow" Width="622" Height="75"
    HorizontalAlignment="Right" Margin="0,0,-274,0" RenderTransformOrigin=".5,.5">
      <local:BubbleWindow.RenderTransform>
        <CompositeTransform Rotation="-90"/>
      </local:BubbleWindow.RenderTransform>
    </local:BubbleWindow>

    <!-- The calibrate pseudo-button that tilts based on the phone's angle -->
    <Border Margin="0,0,0,120" HorizontalAlignment="Center"
            VerticalAlignment="Bottom" local:Tilt.IsEnabled="True"
            MouseLeftButtonUp="Calibrate_MouseLeftButtonUp">
      <TextBlock Text="calibrate" Padding="36" Foreground="#555"
               FontSize="{StaticResource PhoneFontSizeExtraLarge}"
               RenderTransformOrigin=".5,.5">
      <TextBlock.RenderTransform>
        <RotateTransform x:Name="CalibrateTextBlockTransform"/>
      </TextBlock.RenderTransform>
      </TextBlock>
    </Border>
  </Grid>
</phone:PhoneApplicationPage>

					  


  

You are currently reading a PREVIEW of this book.

                                                                                                                    

Get instant access to over $1 million worth of books and videos.

  

Start a Free Trial


  
  • Safari Books Online
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint