DualView sample updated
This commit is contained in:
Jonathan Dick
Родитель
3f7f891140
Коммит
c1ebc82e86
|
|
@ -0,0 +1,49 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
/* Always set the map height explicitly to define the size of the div
|
||||
* element that contains the map. */
|
||||
#map {
|
||||
height: 100%;
|
||||
}
|
||||
/* Optional: Makes the sample page fill the window. */
|
||||
html, body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
</style>
|
||||
<title>Google Maps</title>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=false"></script>
|
||||
<script>
|
||||
var urlParams = new URLSearchParams(window.location.search);
|
||||
lat = urlParams.get('lat');
|
||||
lng = urlParams.get('lng');
|
||||
|
||||
var center = new google.maps.LatLng(lat, lng);
|
||||
var map;
|
||||
|
||||
function initialize() {
|
||||
var mapOptions = {
|
||||
zoom: 12,
|
||||
mapTypeId: google.maps.MapTypeId.ROADMAP,
|
||||
center: center,
|
||||
disableDefaultUI: true
|
||||
};
|
||||
map = new google.maps.Map(document.getElementById('map'),
|
||||
mapOptions);
|
||||
var marker = new google.maps.Marker({
|
||||
position: center,
|
||||
map: map
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body onload="initialize()">
|
||||
<div id="map">map</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -19,17 +19,14 @@
|
|||
|
||||
</style>
|
||||
<script>
|
||||
var place;
|
||||
var urlParams = new URLSearchParams(window.location.search);
|
||||
var place = urlParams.get('place');
|
||||
var map;
|
||||
var service;
|
||||
var infowindow;
|
||||
|
||||
function initMap() {
|
||||
searchMap('');
|
||||
}
|
||||
|
||||
function searchMap(thePlace) {
|
||||
place = thePlace;
|
||||
var msftVisitorCenter = new google.maps.LatLng(47.642232, -122.1389797);
|
||||
infowindow = new google.maps.InfoWindow();
|
||||
|
||||
|
|
@ -81,7 +78,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="map"></div>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR-APIKEY&libraries=places&callback=initMap"
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places&callback=initMap"
|
||||
async defer></script>
|
||||
</body>
|
||||
</html>
|
||||
Разница между файлами не показана из-за своего большого размера
Загрузить разницу
|
|
@ -104,5 +104,8 @@
|
|||
<ItemGroup>
|
||||
<AndroidAsset Include="Assets\googlemapsearch.html" />
|
||||
</ItemGroup>
|
||||
<ItemGroup>
|
||||
<AndroidAsset Include="Assets\googlemap.html" />
|
||||
</ItemGroup>
|
||||
<Import Project="$(MSBuildExtensionsPath)\Xamarin\Android\Xamarin.Android.CSharp.targets" />
|
||||
</Project>
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
<?xml version="1.0" encoding="utf-8" ?>
|
||||
<local:DuoPage
|
||||
xmlns:local="clr-namespace:Xamarin.Duo.Forms.Samples" xmlns="http://xamarin.com/schemas/2014/forms"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
|
||||
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
mc:Ignorable="d"
|
||||
x:Class="Xamarin.Duo.Forms.Samples.DualView">
|
||||
<ContentPage.Content>
|
||||
<StackLayout>
|
||||
<Label Text="Welcome to Xamarin.Forms!"
|
||||
VerticalOptions="CenterAndExpand"
|
||||
HorizontalOptions="CenterAndExpand" />
|
||||
</StackLayout>
|
||||
</ContentPage.Content>
|
||||
</local:DuoPage>
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Text;
|
||||
using System.Threading.Tasks;
|
||||
|
||||
using Xamarin.Forms;
|
||||
using Xamarin.Forms.Xaml;
|
||||
|
||||
namespace Xamarin.Duo.Forms.Samples
|
||||
{
|
||||
[XamlCompilation(XamlCompilationOptions.Compile)]
|
||||
public partial class DualView : DuoPage
|
||||
{
|
||||
public DualView()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<?xml version="1.0" encoding="utf-8" ?>
|
||||
<local:DuoPage
|
||||
xmlns:local="clr-namespace:Xamarin.Duo.Forms.Samples" xmlns="http://xamarin.com/schemas/2014/forms"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
|
||||
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
mc:Ignorable="d"
|
||||
x:Class="Xamarin.Duo.Forms.Samples.DualViewListPage">
|
||||
<local:TwoPaneView>
|
||||
<CollectionView SelectionMode="Single" x:Name="mapList">
|
||||
<CollectionView.ItemTemplate>
|
||||
<DataTemplate>
|
||||
<Grid Padding="10,5,10,5">
|
||||
<Frame Visual="Material" BorderColor="LightGray">
|
||||
<StackLayout Padding="5">
|
||||
<Label FontSize="Title" Text="{Binding Title}"></Label>
|
||||
</StackLayout>
|
||||
</Frame>
|
||||
</Grid>
|
||||
</DataTemplate>
|
||||
</CollectionView.ItemTemplate>
|
||||
</CollectionView>
|
||||
<local:DualViewMap x:Name="mapPage"></local:DualViewMap>
|
||||
</local:TwoPaneView>
|
||||
</local:DuoPage>
|
||||
|
|
@ -0,0 +1,90 @@
|
|||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Text;
|
||||
using System.Threading.Tasks;
|
||||
|
||||
using Xamarin.Forms;
|
||||
using Xamarin.Forms.Xaml;
|
||||
|
||||
namespace Xamarin.Duo.Forms.Samples
|
||||
{
|
||||
[XamlCompilation(XamlCompilationOptions.Compile)]
|
||||
public partial class DualViewListPage : DuoPage
|
||||
{
|
||||
DualViewMapPage mapPagePushed;
|
||||
|
||||
public DualViewListPage()
|
||||
{
|
||||
InitializeComponent();
|
||||
FormsWindow.PropertyChanged += OnFormsWindowPropertyChanged;
|
||||
mapList.SelectionChanged += OnTitleSelected;
|
||||
mapPagePushed = new DualViewMapPage();
|
||||
|
||||
mapList.ItemsSource = new List<MapItem>
|
||||
{
|
||||
new MapItem("New York", 40.7128f, -74.0060f),
|
||||
new MapItem("Seattle", 47.6062f, -122.3425f),
|
||||
new MapItem("Palo Alto", 37.444184f, -122.161059f),
|
||||
new MapItem("San Francisco", 37.7542f, -122.4471f)
|
||||
};
|
||||
}
|
||||
|
||||
async void OnTitleSelected(object sender, SelectionChangedEventArgs e)
|
||||
{
|
||||
if (e.CurrentSelection == null || e.CurrentSelection.Count == 0)
|
||||
return;
|
||||
|
||||
UpdateMapItem();
|
||||
await SetupViews();
|
||||
}
|
||||
|
||||
public MapItem SelectedItem { get; set; }
|
||||
|
||||
|
||||
void UpdateMapItem()
|
||||
{
|
||||
var item = mapList.SelectedItem as MapItem ?? (mapList.ItemsSource as IList<MapItem>)[0];
|
||||
|
||||
SelectedItem = item;
|
||||
|
||||
if (SelectedItem != null)
|
||||
{
|
||||
mapPage.UpdateMap(item);
|
||||
mapPagePushed.UpdateMap(item);
|
||||
}
|
||||
}
|
||||
|
||||
async Task SetupViews()
|
||||
{
|
||||
if (FormsWindow.IsSpanned && FormsWindow.IsPortrait)
|
||||
UpdateMapItem();
|
||||
|
||||
if (SelectedItem == null)
|
||||
return;
|
||||
|
||||
if (!FormsWindow.IsSpanned || FormsWindow.IsLandscape)
|
||||
{
|
||||
if (!Navigation.NavigationStack.Contains(mapPagePushed))
|
||||
{
|
||||
await Navigation.PushAsync(mapPagePushed);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
protected override void OnAppearing()
|
||||
{
|
||||
if (!FormsWindow.IsSpanned)
|
||||
mapList.SelectedItem = null;
|
||||
}
|
||||
|
||||
async void OnFormsWindowPropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
|
||||
{
|
||||
if (e.PropertyName == nameof(FormsWindow.IsSpanned) || e.PropertyName == nameof(FormsWindow.IsPortrait))
|
||||
{
|
||||
await SetupViews();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
|
||||
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
mc:Ignorable="d"
|
||||
x:Class="Xamarin.Duo.Forms.Samples.DualViewMap">
|
||||
<ContentView.Content>
|
||||
<WebView x:Name="webView" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" />
|
||||
</ContentView.Content>
|
||||
</ContentView>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Text;
|
||||
using System.Threading.Tasks;
|
||||
|
||||
using Xamarin.Forms;
|
||||
using Xamarin.Forms.Xaml;
|
||||
|
||||
namespace Xamarin.Duo.Forms.Samples
|
||||
{
|
||||
[XamlCompilation(XamlCompilationOptions.Compile)]
|
||||
public partial class DualViewMap : ContentView
|
||||
{
|
||||
public DualViewMap()
|
||||
{
|
||||
InitializeComponent();
|
||||
|
||||
webView.Source = $"file:///android_asset/googlemap.html";
|
||||
}
|
||||
|
||||
public void UpdateMap(MapItem item)
|
||||
=> webView.Source = $"file:///android_asset/googlemap.html?lat={item.Lat}&lng={item.Lng}";
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8" ?>
|
||||
<local:DuoPage
|
||||
xmlns:local="clr-namespace:Xamarin.Duo.Forms.Samples" xmlns="http://xamarin.com/schemas/2014/forms"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
|
||||
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
mc:Ignorable="d"
|
||||
x:Class="Xamarin.Duo.Forms.Samples.DualViewMapPage">
|
||||
<local:DualViewMap x:Name="map"></local:DualViewMap>
|
||||
</local:DuoPage>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Text;
|
||||
using System.Threading.Tasks;
|
||||
|
||||
using Xamarin.Forms;
|
||||
using Xamarin.Forms.Xaml;
|
||||
|
||||
namespace Xamarin.Duo.Forms.Samples
|
||||
{
|
||||
[XamlCompilation(XamlCompilationOptions.Compile)]
|
||||
public partial class DualViewMapPage : DuoPage
|
||||
{
|
||||
public DualViewMapPage()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
|
||||
public void UpdateMap(MapItem item)
|
||||
=> map.UpdateMap(item);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
|
||||
namespace Xamarin.Duo.Forms.Samples
|
||||
{
|
||||
public class MapItem
|
||||
{
|
||||
public MapItem(string title, double lat, double lng)
|
||||
{
|
||||
Title = title;
|
||||
Lat = lat;
|
||||
Lng = lng;
|
||||
}
|
||||
|
||||
public string Title { get; set; }
|
||||
public double Lat { get; set; }
|
||||
public double Lng { get; set; }
|
||||
}
|
||||
}
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
<ContentPage.Content>
|
||||
<Grid>
|
||||
<WebView x:Name="webView" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" />
|
||||
<SearchBar x:Name="searchBar" Placeholder="Search..." HorizontalOptions="FillAndExpand" VerticalOptions="Start" />
|
||||
<SearchBar x:Name="searchBar" Placeholder="Find a place..." BackgroundColor="DarkGray" Opacity="0.8" HorizontalOptions="FillAndExpand" VerticalOptions="Start" />
|
||||
</Grid>
|
||||
</ContentPage.Content>
|
||||
</local:DuoPage>
|
||||
|
|
@ -32,7 +32,7 @@ namespace Xamarin.Duo.Forms.Samples
|
|||
{
|
||||
var place = searchBar?.Text ?? string.Empty;
|
||||
|
||||
webView.EvaluateJavaScriptAsync("searchMap('" + place.Replace("\'", "") + "');");
|
||||
webView.Source = "file:///android_asset/googlemapsearch.html?place=" + System.Web.HttpUtility.UrlEncode(place);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -29,7 +29,7 @@ namespace Xamarin.Duo.Forms.Samples
|
|||
Navigation.PushAsync(new TwoPage());
|
||||
break;
|
||||
case "Dual View":
|
||||
Navigation.PushAsync(new DualView());
|
||||
Navigation.PushAsync(new DualViewListPage());
|
||||
break;
|
||||
case "Extend Canvas":
|
||||
Navigation.PushAsync(new ExtendCanvas());
|
||||
|
|
|
|||
|
|
@ -17,6 +17,9 @@
|
|||
</ItemGroup>
|
||||
|
||||
<ItemGroup>
|
||||
<Compile Update="DualView\DualViewListPage.xaml.cs">
|
||||
<DependentUpon>DualViewListPage.xaml</DependentUpon>
|
||||
</Compile>
|
||||
<Compile Update="MasterDetail\Master.xaml.cs">
|
||||
<DependentUpon>Master.xaml</DependentUpon>
|
||||
</Compile>
|
||||
|
|
@ -26,7 +29,13 @@
|
|||
<EmbeddedResource Update="CompanionPane\CompanionPane.xaml">
|
||||
<Generator>MSBuild:UpdateDesignTimeXaml</Generator>
|
||||
</EmbeddedResource>
|
||||
<EmbeddedResource Update="DualView.xaml">
|
||||
<EmbeddedResource Update="DualView\DualViewListPage.xaml">
|
||||
<Generator>MSBuild:UpdateDesignTimeXaml</Generator>
|
||||
</EmbeddedResource>
|
||||
<EmbeddedResource Update="DualView\DualViewMap.xaml">
|
||||
<Generator>MSBuild:UpdateDesignTimeXaml</Generator>
|
||||
</EmbeddedResource>
|
||||
<EmbeddedResource Update="DualView\DualViewMapPage.xaml">
|
||||
<Generator>MSBuild:UpdateDesignTimeXaml</Generator>
|
||||
</EmbeddedResource>
|
||||
<EmbeddedResource Update="ExtendCanvas.xaml">
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче