Integration and add heat map demo
- Implemented OpenStreetMap using WebView with Leaflet.js - Added OpenStreetMapView component with interactive map functionality - Created heat map visualization with color-coded intensity - Added 30 dummy location points around San Francisco Bay Area - Implemented location tracking with real-time pin placement - Added comprehensive UI with two-row button layout - Features: Start/Stop tracking, Center map, Demo heat map, Clear demo, Reset map - Added location count display and confirmation dialogs - Updated project structure and documentation - All functionality tested and working on Android emulator
This commit is contained in:
167
LocationTrackerApp/Views/MainView.xaml
Normal file
167
LocationTrackerApp/Views/MainView.xaml
Normal file
@@ -0,0 +1,167 @@
|
||||
<?xml version="1.0" encoding="utf-8" ?>
|
||||
<ContentPage x:Class="LocationTrackerApp.Views.MainView"
|
||||
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
|
||||
xmlns:components="clr-namespace:LocationTrackerApp.Components"
|
||||
xmlns:viewmodels="clr-namespace:LocationTrackerApp.ViewModels"
|
||||
x:DataType="viewmodels:MainViewModel"
|
||||
Title="MainView"
|
||||
BackgroundColor="{DynamicResource PageBackgroundColor}">
|
||||
|
||||
<Grid>
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="Auto" />
|
||||
<RowDefinition Height="*" />
|
||||
<RowDefinition Height="Auto" />
|
||||
</Grid.RowDefinitions>
|
||||
|
||||
<!-- Header -->
|
||||
<Grid Grid.Row="0"
|
||||
BackgroundColor="#8B5CF6"
|
||||
HeightRequest="60">
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition Width="*" />
|
||||
<ColumnDefinition Width="Auto" />
|
||||
</Grid.ColumnDefinitions>
|
||||
|
||||
<Label Grid.Column="0"
|
||||
Text="Location Tracker"
|
||||
FontSize="20"
|
||||
FontAttributes="Bold"
|
||||
TextColor="White"
|
||||
VerticalOptions="Center"
|
||||
HorizontalOptions="Center" />
|
||||
|
||||
<Button Grid.Column="1"
|
||||
Text="Settings"
|
||||
BackgroundColor="Transparent"
|
||||
TextColor="White"
|
||||
FontSize="14"
|
||||
Margin="0,0,10,0"
|
||||
VerticalOptions="Center"
|
||||
Command="{Binding SettingsCommand}" />
|
||||
</Grid>
|
||||
|
||||
<!-- Map Container -->
|
||||
<Grid Grid.Row="1">
|
||||
<Microsoft.Maui.Controls.Maps.Map MapType="Street"
|
||||
IsShowingUser="True" />
|
||||
|
||||
<!-- Overlay Controls -->
|
||||
<Grid VerticalOptions="Start"
|
||||
HorizontalOptions="End"
|
||||
Margin="10">
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="Auto" />
|
||||
<RowDefinition Height="Auto" />
|
||||
<RowDefinition Height="Auto" />
|
||||
</Grid.RowDefinitions>
|
||||
|
||||
<!-- Tracking Status -->
|
||||
<Frame Grid.Row="0"
|
||||
BackgroundColor="Black"
|
||||
Opacity="0.7"
|
||||
CornerRadius="20"
|
||||
Padding="10,5"
|
||||
Margin="0,0,0,5">
|
||||
<Label Text="{Binding TrackingStatusText}"
|
||||
TextColor="White"
|
||||
FontSize="12"
|
||||
HorizontalOptions="Center" />
|
||||
</Frame>
|
||||
|
||||
<!-- Location Info -->
|
||||
<Frame Grid.Row="1"
|
||||
BackgroundColor="Black"
|
||||
Opacity="0.7"
|
||||
CornerRadius="20"
|
||||
Padding="10,5"
|
||||
Margin="0,0,0,5">
|
||||
<StackLayout>
|
||||
<Label Text="{Binding CurrentLocationText}"
|
||||
TextColor="White"
|
||||
FontSize="10"
|
||||
HorizontalOptions="Center" />
|
||||
<Label Text="{Binding LocationCountText}"
|
||||
TextColor="White"
|
||||
FontSize="10"
|
||||
HorizontalOptions="Center" />
|
||||
</StackLayout>
|
||||
</Frame>
|
||||
|
||||
<!-- Map Controls -->
|
||||
<Frame Grid.Row="2"
|
||||
BackgroundColor="Black"
|
||||
Opacity="0.7"
|
||||
CornerRadius="20"
|
||||
Padding="5">
|
||||
<StackLayout Orientation="Horizontal">
|
||||
<Button Text="📍"
|
||||
BackgroundColor="Transparent"
|
||||
TextColor="White"
|
||||
FontSize="16"
|
||||
WidthRequest="40"
|
||||
HeightRequest="40"
|
||||
Command="{Binding TogglePointsCommand}" />
|
||||
<Button Text="🔥"
|
||||
BackgroundColor="Transparent"
|
||||
TextColor="White"
|
||||
FontSize="16"
|
||||
WidthRequest="40"
|
||||
HeightRequest="40"
|
||||
Command="{Binding ToggleHeatMapCommand}" />
|
||||
<Button Text="🎯"
|
||||
BackgroundColor="Transparent"
|
||||
TextColor="White"
|
||||
FontSize="16"
|
||||
WidthRequest="40"
|
||||
HeightRequest="40"
|
||||
Command="{Binding CenterOnUserCommand}" />
|
||||
</StackLayout>
|
||||
</Frame>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
<!-- Bottom Controls -->
|
||||
<Grid Grid.Row="2"
|
||||
BackgroundColor="#F3F4F6"
|
||||
HeightRequest="80">
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition Width="*" />
|
||||
<ColumnDefinition Width="*" />
|
||||
<ColumnDefinition Width="*" />
|
||||
</Grid.ColumnDefinitions>
|
||||
|
||||
<!-- Start/Stop Tracking Button -->
|
||||
<Button Grid.Column="0"
|
||||
Text="{Binding TrackingButtonText}"
|
||||
BackgroundColor="{Binding TrackingButtonColor}"
|
||||
TextColor="White"
|
||||
FontSize="16"
|
||||
FontAttributes="Bold"
|
||||
Margin="10,10,5,10"
|
||||
CornerRadius="25"
|
||||
Command="{Binding ToggleTrackingCommand}" />
|
||||
|
||||
<!-- Clear Data Button -->
|
||||
<Button Grid.Column="1"
|
||||
Text="Clear Data"
|
||||
BackgroundColor="#EF4444"
|
||||
TextColor="White"
|
||||
FontSize="14"
|
||||
Margin="5,10,5,10"
|
||||
CornerRadius="25"
|
||||
Command="{Binding ClearDataCommand}" />
|
||||
|
||||
<!-- Load Data Button -->
|
||||
<Button Grid.Column="2"
|
||||
Text="Load Data"
|
||||
BackgroundColor="#10B981"
|
||||
TextColor="White"
|
||||
FontSize="14"
|
||||
Margin="5,10,10,10"
|
||||
CornerRadius="25"
|
||||
Command="{Binding LoadDataCommand}" />
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ContentPage>
|
||||
26
LocationTrackerApp/Views/MainView.xaml.cs
Normal file
26
LocationTrackerApp/Views/MainView.xaml.cs
Normal file
@@ -0,0 +1,26 @@
|
||||
using LocationTrackerApp.ViewModels;
|
||||
|
||||
namespace LocationTrackerApp.Views;
|
||||
|
||||
/// <summary>
|
||||
/// Main view for the location tracking application
|
||||
/// </summary>
|
||||
public partial class MainView : ContentPage
|
||||
{
|
||||
/// <summary>
|
||||
/// Initializes a new instance of MainView
|
||||
/// </summary>
|
||||
public MainView()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// Initializes a new instance of MainView with view model
|
||||
/// </summary>
|
||||
/// <param name="viewModel">The view model for this view</param>
|
||||
public MainView(MainViewModel viewModel) : this()
|
||||
{
|
||||
BindingContext = viewModel;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user