Hanya saja pada postingan yang kali ini Lokasi Device yang di tampilkan di map akan secara Real Time, jadi ketika lokasi device berpindah maka Lokasi yang di map juga akan berubah secara langsung sesuai dengan koordinat yang baru. Hal ini biasanya digunakan jika kita ingin membuat sebuah GPS atau yang lainnya.
Langkah - langkah Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone
1. Buat sebuah project Windows Phone App baru
2. Seperti pada tutorial sebelumnya kita perlu menambahkan Windows Phone Toolkit pada references project kita dengan cara Klik kanan pada References -> Manage NuGet Packages -> Cari Windows Phone Toolkit -> Klik Install
3. Buka Capabilities pada file WMAppManifest.xml centang ID_CAP_MAP dan ID_CAP_LOCATION
4. Tambahkan 1 Map, 6 Textblock dan 1 Button atau anda bisa mengcopy script dibawah ini
<!--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="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
<TextBlock Text="Lokasi Real Time" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}" FontSize="50"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,1,12,-1">
<Button x:Name="btn_start" Content="Mulai Melacak" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,564,0,0" Width="446" Click="btn_start_Click"/>
<TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Latitude :" VerticalAlignment="Top" Margin="28,497,0,0"/>
<TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Longitude :" VerticalAlignment="Top" Margin="28,532,0,0" FontSize="20"/>
<TextBlock x:Name="txt_longitude" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Margin="158,532,0,0"/>
<TextBlock x:Name="txt_latitude" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Margin="158,497,0,0"/>
<TextBlock x:Name="lbl_status" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Margin="158,465,0,0"/>
<TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Status :" VerticalAlignment="Top" Margin="27,465,0,0"/>
<maps:Map x:Name="map" HorizontalAlignment="Left" VerticalAlignment="Top" Height="465" Width="446" ZoomLevel="14">
<toolkit:MapExtensions.Children>
<toolkit:Pushpin x:Name="pushpinlokasi" Content="Posisi Saya"/>
</toolkit:MapExtensions.Children>
</maps:Map>
</Grid>
</Grid>
5. Tambahkan script dibawah ini pada file .xaml.cs
// Namespace yang diperlukan using System.Threading.Tasks; using Windows.Devices.Geolocation; using Microsoft.Phone.Maps.Toolkit; using Microsoft.Phone.Maps.Controls;
6. Tambahkan script dibawah ini di atas constructor mainpage.xaml.cs
// deklarasi variable Geolocator geolocator = null; bool lacak = false;
7. Pada event btn_start_Click Tambahkan script dibawah ini
private void btn_start_Click(object sender, RoutedEventArgs e)
{
if (lacak == false)
{
geolocator = new Geolocator();
// menentukan akurasi
geolocator.DesiredAccuracy = PositionAccuracy.High;
// jarak perpindahan dalam satuan meter
geolocator.MovementThreshold = 20;
geolocator.StatusChanged += geolocator_StatusChanged;
geolocator.PositionChanged += geolocator_PositionChanged;
lacak = true;
btn_start.Content = "Berhenti Melacak";
}
else
{
// menghapus event handler
geolocator.PositionChanged -= geolocator_PositionChanged;
geolocator.StatusChanged -= geolocator_StatusChanged;
geolocator = null;
lacak = false;
btn_start.Content = "Mulai Melacak";
}
}
8. Buat event untuk menghandle geolocator_PositionChanged dan geolocator_StatusChanged
void geolocator_PositionChanged(Geolocator sender, PositionChangedEventArgs args)
{
Dispatcher.BeginInvoke(() =>
{
// menampilkan koordinat yang baru
txt_latitude.Text = args.Position.Coordinate.Latitude.ToString();
txt_longitude.Text = args.Position.Coordinate.Longitude.ToString();
// memindahkan pushpin berdasarkan koordinat yang baru
Pushpin pushpin = (Pushpin)this.FindName("pushpinlokasi");
pushpin.GeoCoordinate = new System.Device.Location.GeoCoordinate(args.Position.Coordinate.Latitude,args.Position.Coordinate.Longitude);
map.Center = new System.Device.Location.GeoCoordinate(args.Position.Coordinate.Latitude, args.Position.Coordinate.Longitude);
});
}
void geolocator_StatusChanged(Geolocator sender, StatusChangedEventArgs args)
{
string status = "";
switch (args.Status)
{
case PositionStatus.Disabled:
status = "Lokasi dinonaktifkan pada pengaturan telepon";
break;
case PositionStatus.Initializing:
status = "Menginisialisasi";
break;
case PositionStatus.NoData:
status = "Gagal mendapatkan lokasi";
break;
case PositionStatus.Ready:
status = "Lokasi telah di dapatkan";
break;
}
// menampilkan status pada label status
Dispatcher.BeginInvoke(() =>
{
lbl_status.Text = status;
});
}
9. Jalankan program dengan menekan F5 maka akan seperti gambar dibawah ini
 |
| Ketka pertama kali dijalankan |
 |
| Menemukan lokasi device |
 |
| Ketika lokasi device berpindah maka pushpin akan ikut berpindah |
Anda bisa mendownload source codenya disini
dan untuk passwordnya disini
Sekian pembahasan tentang Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone
Tunggu tutorial menarik lainnya, karena itu kunjungi terus blog ini
