Projekt-Anfragen: Tel: 07022/9319004 info@CodeDocu.de Software Entwicklung in C# WPF Asp.Net Core Vba Excel Word SQL-Server EF Linq, UWP Net
#

UWP: Map Anwendung als Challenge

 

Unter den MSDN Techawards kann man zur Zeit in einem kleinen Lehrgang eine App erstellen, die einen Bing Map enthält und welche auf Positions-Events reagiert.

Ich habe die App mal erstellt, denn als Challenge muss der code in C# und XAML ja erst erstellt werden.

 

Das gute an den Universal Apps ist, dass das Erstellen von Anwendungen für Windows 10 Desktop und Mobile Devices sehr einfach geht.

 

MainPage.XAML:

<Page

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:local="using:Challenge01"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    xmlns:Maps="using:Windows.UI.Xaml.Controls.Maps"

    x:Class="Challenge01.MainPage"

    mc:Ignorable="d">

 

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

        <VisualStateManager.VisualStateGroups>

            <VisualStateGroup>

                <VisualState x:Name="Narrow">

                    <VisualState.StateTriggers>

                        <AdaptiveTrigger MinWindowWidth="0"></AdaptiveTrigger>

                    </VisualState.StateTriggers>

                    <VisualState.Setters>

                        <Setter Target="mySplitview.DisplayMode" Value="Overlay"></Setter>

                        <Setter Target="mySplitview.IsPaneOpen" Value="False"></Setter>

                    </VisualState.Setters>

                </VisualState>

                <VisualState x:Name="Compact">

                    <VisualState.StateTriggers>

                        <AdaptiveTrigger MinWindowWidth="720"></AdaptiveTrigger>

                    </VisualState.StateTriggers>

                    <VisualState.Setters>

                        <Setter Target="mySplitview.DisplayMode" Value="CompactOverlay"></Setter>

                        <Setter Target="mySplitview.IsPaneOpen" Value="False"></Setter>

                    </VisualState.Setters>

                </VisualState>

                <VisualState x:Name="Wide">

                    <VisualState.StateTriggers>

                        <AdaptiveTrigger MinWindowWidth="1024"></AdaptiveTrigger>

                    </VisualState.StateTriggers>

                    <VisualState.Setters>

                        <Setter Target="mySplitview.DisplayMode" Value="CompactInline"></Setter>

                        <Setter Target="mySplitview.IsPaneOpen" Value="True"></Setter>

                    </VisualState.Setters>

                </VisualState>

            </VisualStateGroup>

 

        </VisualStateManager.VisualStateGroups>

 

 

        <SplitView DisplayMode="Inline" x:Name="mySplitview" IsPaneOpen="True" >

            <SplitView.Pane >

                <StackPanel  Margin="0,30,0,0" x:Name="pnlButtons" >

                    <RadioButton Tag="Map" Click="btnMenuItems_click">

                        <StackPanel Orientation="Horizontal" >

                            <SymbolIcon Symbol="Map" ></SymbolIcon>

                            <TextBlock Text="Map" Margin="15,0,0,0"></TextBlock>

                        </StackPanel>

                    </RadioButton>

                    <RadioButton Tag="Mail" Click="btnMenuItems_click">

                        <StackPanel Orientation="Horizontal" >

                            <SymbolIcon Symbol="Mail"  ></SymbolIcon>

                            <TextBlock Text="Mail" Margin="15,0,0,0"></TextBlock>

                        </StackPanel>

                    </RadioButton>

                    <RadioButton Tag="AddFriend" Click="btnMenuItems_click">

                        <StackPanel Orientation="Horizontal" >

                            <SymbolIcon Symbol="AddFriend"  ></SymbolIcon>

                            <TextBlock Text="Add Friend" Margin="15,0,0,0"></TextBlock>

                        </StackPanel>

                    </RadioButton>

                    <RadioButton Tag="Settings" Click="btnMenuItems_click">

                        <StackPanel Orientation="Horizontal" >

                            <SymbolIcon Symbol="Setting"  ></SymbolIcon>

                            <TextBlock Text="Setting" Margin="15,0,0,0"></TextBlock>

                        </StackPanel>

                    </RadioButton>

                </StackPanel>

 

            </SplitView.Pane>

            <Frame x:Name="MainFrame" ></Frame>

           </SplitView>

        <Button x:Name="btnHamburger"

                Width="{Binding ElementName=mySplitview, Path=CompactPaneLength }"

                VerticalAlignment="Top"

                Click="btnHamburger_Click"

                >

            <SymbolIcon Symbol="Bullets" ></SymbolIcon>

        </Button>

 

    </Grid>

</Page>

 

 

 

MainPage.cs

using System;

using System.Collections.Generic;

using System.IO;

using System.Linq;

using System.Runtime.InteropServices.WindowsRuntime;

using Windows.Foundation;

using Windows.Foundation.Collections;

using Windows.UI.Xaml;

using Windows.UI.Xaml.Controls;

using Windows.UI.Xaml.Controls.Primitives;

using Windows.UI.Xaml.Data;

using Windows.UI.Xaml.Input;

using Windows.UI.Xaml.Media;

using Windows.UI.Xaml.Navigation;

 

// Die Vorlage "Leere Seite" ist unter http://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409 dokumentiert.

 

namespace Challenge01

{

    /// <summary>

    /// Eine leere Seite, die eigenständig verwendet oder zu der innerhalb eines Rahmens navigiert werden kann.

    /// </summary>

    public sealed partial class MainPage : Page

    {

 

        #region Page

        //------------------------------< Page >------------------------------

        public MainPage()

        {

            this.InitializeComponent();

        }

        //------------------------------</ Page >------------------------------

        #endregion

 

 

        #region Buttons

        //------------------------------< Button >------------------------------

        private void btnHamburger_Click(object sender, RoutedEventArgs e)

        {

            mySplitview.IsPaneOpen = mySplitview.IsPaneOpen ? false : true;

        }

        //------------------------------</ Button >------------------------------

        #endregion

 

 

        #region Menu_Buttons

        //------------------------------< Menu_Button >------------------------------

        private void btnMenuItems_click(object sender, RoutedEventArgs e)

        {

            var btn = sender as RadioButton;

            if (btn != null)

            {

                switch (btn.Tag.ToString())

                {

                    case "Map":

                        MainFrame.Navigate(typeof(MapPage));

                        break;

                }

                mySplitview.IsPaneOpen = false;

            }      

        }

        //------------------------------</ Menu_Button >------------------------------

        #endregion

    }

}

 

 

 

 

 

Und als Luftbild Aufnahme Modus

 

Für die Map

<Page

    x:Class="Challenge01.MapPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:local="using:Challenge01"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    xmlns:maps="using:Windows.UI.Xaml.Controls.Maps"

    mc:Ignorable="d">

 

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

        <VisualStateManager.VisualStateGroups  >

            <VisualStateGroup>

                <VisualState x:Name ="Narrow"   >

                    <VisualState.StateTriggers>

                        <AdaptiveTrigger MinWindowWidth="0"></AdaptiveTrigger>

                    </VisualState.StateTriggers>

                    <VisualState.Setters>

                        <Setter Target="SearchControls.(RelativePanel.AlignRightWithPanel)" Value="True"></Setter>

                        <Setter Target="ctlMap.(RelativePanel.Below)" Value="SearchControls"></Setter>

                        <Setter Target="ctlMap.(RelativePanel.AlignRightWithPanel)" Value="True"></Setter>

                    </VisualState.Setters>

                </VisualState>

                <VisualState x:Name ="Wide"   >

                    <VisualState.StateTriggers>

                        <AdaptiveTrigger MinWindowWidth="720"></AdaptiveTrigger>

                    </VisualState.StateTriggers>

                    <VisualState.Setters>

                        <Setter Target="SearchControls.(RelativePanel.AlignRightWithPanel)" Value="True"></Setter>

                        <Setter Target="ctlMap.(RelativePanel.AlignTopWithPanel)" Value="True"></Setter>

                        <Setter Target="ctlMap.(RelativePanel.LeftOf)" Value="SearchControls"></Setter>

                    </VisualState.Setters>

                </VisualState>

            </VisualStateGroup>

           

        </VisualStateManager.VisualStateGroups>

       

        <RelativePanel  >

            <StackPanel x:Name="SearchControls" Orientation="Horizontal" >

                <CheckBox x:Name="cbxTraffic"

                          Content="Traffic"

                          Width="100"

                          Height="50"

                          Margin="15,30,15,15"

                          Checked="cbxTraffic_Checked"

                          Unchecked="cbxTraffic_Unchecked"

                          >

                </CheckBox>

                <Button x:Name="btnMapStyle"

                        Content="Aerial"

                        Width="100"

                        Height="50"

                        Margin="15"

                        Click="btnMapStyle_Click"

                        >

                </Button>               

            </StackPanel>

            <maps:MapControl x:Name="ctlMap" Height="500"

                             MapTapped="ctlMap_MapTapped"

                             RelativePanel.AlignBottomWithPanel="True"

                             RelativePanel.AlignLeftWithPanel="True" 

                             ></maps:MapControl>

        </RelativePanel>

    </Grid>

</Page>

 

 

 

Und der dazugehörige C# Code

using System;

using System.Collections.Generic;

using System.IO;

using System.Linq;

using System.Runtime.InteropServices.WindowsRuntime;

using Windows.Foundation;

using Windows.Foundation.Collections;

using Windows.UI.Xaml;

using Windows.UI.Xaml.Controls;

using Windows.UI.Xaml.Controls.Primitives;

using Windows.UI.Xaml.Data;

using Windows.UI.Xaml.Input;

using Windows.UI.Xaml.Media;

using Windows.UI.Xaml.Navigation;

 

using Windows.UI.Popups;    //Message

using Windows.Devices.Geolocation; //maps

 

// Die Elementvorlage "Leere Seite" ist unter http://go.microsoft.com/fwlink/?LinkId=234238 dokumentiert.

 

namespace Challenge01

{

    /// <summary>

    /// Eine leere Seite, die eigenständig verwendet oder zu der innerhalb eines Rahmens navigiert werden kann.

    /// </summary>

    public sealed partial class MapPage : Page

    {

        #region Page

        //------------------------------< Page >------------------------------

        public MapPage()

        {

            this.InitializeComponent();

            ctlMap.Loaded += ctlMap_Loaded;

            ctlMap.MapTapped += ctlMap_MapTapped;

        }

        //------------------------------</ Page >------------------------------

        #endregion

 

        #region events

        //------------------------------< events >------------------------------

        private void ctlMap_Loaded(object sender, RoutedEventArgs e)

        {

            ctlMap.Center = new Geopoint(

                new BasicGeoposition()

                {

                    //Nuertingen-Stuttgart, Ruemelinstr.25 48.627852, 9.349043

                    Latitude = 48.627852,

                    Longitude = 9.349043

                }

                );

            ctlMap.ZoomLevel = 12;

           

        }

        private async void ctlMap_MapTapped(Windows.UI.Xaml.Controls.Maps.MapControl sender, Windows.UI.Xaml.Controls.Maps.MapInputEventArgs args)

        {

            var actGeoPosition = args.Location.Position;

            string status = $"Map tapped at  \nLatitude=" + actGeoPosition.Latitude +

                $"\nLongitude="