Assalamualaikum semua, setelah kemarin saya memposting tentang Menampilkan Map Berdasarkan Latitude dan Longitude.
Pada malam hari ini saya ingin membahas tentang Menampilkan Lokasi Device di Map di Windows Phone, pertama-tama kita perlu mendapatkan koordinat dari device kita, lalu kita menambahkan sebuah pushpin ke map berdasarkan koordinat dari device kita.
oke langsung saja

Langkah  - Langkah Menampilkan Lokasi Device di Map di Windows Phone

1. Buat sebuah Windows Phone App project baru

2. Tambahkan references Windows Phone Toolkit dengan cara klik kanan references > Manage Nuget Packages > cari Windows Phone Toolkit > Install

Menampilkan Lokasi Device di Map di Windows Phone


3. Tambahkan 1 button, 1 map dan 4 textblock, atau anda dapat mengcopykan script dibawah ini ke dalam file .xaml anda

<!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        
        <!--TitlePanel contains the name of the application and page title-->
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock Text="Tutorial Koding" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
            <TextBlock Text="Lokasi Device" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

        <!--ContentPanel - place additional content here-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

            <maps:Map x:Name="map" HorizontalAlignment="Left" VerticalAlignment="Top" Height="438" Width="446"/>
            
            <Button x:Name="btn_temukan" Content="Temukan Lokasi Device" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,525,0,0" Width="446" Click="btn_temukan_Click"/>
            <TextBlock x:Name="txt_latitude" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Margin="133,448,0,0"/>
            <TextBlock x:Name="txt_longitude" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Margin="133,488,0,0"/>
            <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Longitude :" VerticalAlignment="Top" Margin="10,488,0,0"/>
            <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Latitude :" VerticalAlignment="Top" Margin="10,443,0,0"/>

        </Grid>

    </Grid>

 maka tampilannya kan seperti gambar dibawah ini


4. Buka Capabilities pada file WMAppManifest.xml centang ID_CAP_MAP dan ID_CAP_LOCATION

 
5. Import 4 namespace dibawah ini pada file .xaml anda
using System.Threading.Tasks;
using Windows.Devices.Geolocation;
using Microsoft.Phone.Maps.Toolkit;
using Microsoft.Phone.Maps.Controls;
using System.Windows.Media;

6. Tambahkan script dibawah ini pada event btn_temukan_Click
        private async void btn_temukan_Click(object sender, RoutedEventArgs e)
        {
            Geolocator geolocator = new Geolocator();
            geolocator.DesiredAccuracyInMeters = 50;

            try
            {

                Geoposition geoposition = await geolocator.GetGeopositionAsync(
                    maximumAge: TimeSpan.FromMinutes(5),
                    timeout: TimeSpan.FromSeconds(10)
                    );


                // Windows Phone 8.1
                //Geoposition position = await geolocator.GetGeopositionAsync();
                //txt_latitude.Text = position.Coordinate.Point.Position.Latitude.ToString();
                //txt_longitude.Text = position.Coordinate.Point.Position.Longitude.ToString();

                double latitude = geoposition.Coordinate.Latitude;
                double longitude = geoposition.Coordinate.Longitude;

                txt_latitude.Text = latitude.ToString();
                txt_longitude.Text = longitude.ToString();

                // menandai map
                Pushpin pushpin = new Pushpin();
                pushpin.Content = "Lokasi Saya";
                pushpin.Background = new SolidColorBrush(Colors.Blue);
                // Menambahkan pushpin ke MapOverlay
                MapOverlay overlay = new MapOverlay();
                overlay.Content = pushpin;
                overlay.GeoCoordinate = new System.Device.Location.GeoCoordinate(latitude, longitude);
                overlay.PositionOrigin = new Point(0, 0.5);

                // menyesuaikan koorinate MapOverlay
                MapLayer layer = new MapLayer();
                layer.Add(overlay);
                // Menambahkan MapLayer ke map
                map.Layers.Add(layer);
                // Mengatur posisi tengah map
                map.Center = new System.Device.Location.GeoCoordinate(latitude, longitude);
                map.ZoomLevel = 14;
            }
            catch (Exception ex)
            {
                MessageBox.Show(ex.Message);
            }
        }

5. Jalankan program tersebut dengan menekan F5 lalu tekan tombol Temukan Lokasi Device maka akan seperti gambar dibawah ini


Anda bisa mendownload source codenya disini
dan untuk passwordnya disini

Sekian pembahasan tentang Menampilkan Lokasi Device di Map di Windows Phone
Tunggu tutorial menarik lainnya, karena itu kunjungi terus blog ini
Author image

About the Author :

Nama Saya Dwi Randy Herdinanto. Saya Tinggal Di Bandar Lampung, Saat Ini SayaKuliah di Salah Satu Perguruan Tinggi di Lampung dan Juga Bekerja di Software House Lampung

Connect with me on :

0 Comments
Comments
 
Top