Share
Een van de handigste functies voor gebruikers is kaartenintegratie. In de vorige aflevering van deze serie hebben we besproken hoe Google Maps voor Android kan worden ingesteld met behulp van de Google Developer Console en hoe een basis Google Maps-fragment te maken. We gingen toen over het toevoegen van verschillende soorten markeringen en hoe te tekenen op de kaart.
In deze zelfstudie gaat u verder op wat u in het laatste artikel hebt geleerd, zodat u boven aan een kaart weergaven kunt plaatsen, de bedieningselementen voor binnenniveau kunt opheffen en een Street View-component aan uw toepassingen kunt toevoegen. De broncode voor dit artikel is te vinden op GitHub.
Volg om te beginnen de stappen in het vorige artikel van deze serie om een basisproject te maken met een MapFragment, bevestig het aan een Activiteit, en activeer de Google Maps API via de Google Developers Console. Voor deze zelfstudie hoeft u geen gebruik te maken van de locaties Play Services-klassen, maar moet u wel Maps Play Services-bibliotheek importeren in uw build.gradle afhankelijkheden knooppunt.
afhankelijkheden compile fileTree (dir: 'libs', include: ['* .jar']) compileer 'com.android.support:appcompat-v7:23.0.0' compileer 'com.google.android.gms: afspeelservices -maps: 7.8.0 '
Zodra dat is gebeurd, krijg je een scherm dat er als volgt uitziet:
Vervolgens moet je je camera instellen. Voor deze zelfstudie richten we ons op Madison Square Garden in New York City, omdat het een geweldig voorbeeld is van een gebouw met behulp van de indoor level maps..
In onViewCreated, u kunt een oproep toevoegen aan de volgende helper-methode initCamera. Misschien herinnert u zich dat we moeten wachten tot onViewCreated om met Google Maps te werken, omdat we weten dat het kaartobject klaar is voor gebruik.
private void initCamera () CameraPosition position = CameraPosition.builder () .target (new LatLng (40.7506, -73.9936)) .zoom (18f). dragend (0.0f) .tilt (0.0f) .build (); getMap (). animateCamera (CameraUpdateFactory.newCameraPosition (positie), null); getMap (). setMapType (GoogleMap.MAP_TYPE_HYBRID);
De bovenstaande methode verplaatst de camera naar ons doel en zoomt zo dichtbij dat de binnenknop zichtbaar wordt. U zult merken dat er een strook cijfers aan de rechterkant van het scherm en een overlay op de kaart voor elke verdieping is. Wanneer u een ander niveau aan de rechterkant selecteert, wordt de huidige plattegrond geanimeerd in de nieuwe. Dit is de functie waarmee u later zult werken om uw eigen selectie op controleniveau te hebben.
Vervolgens moet u de drie interfaces implementeren die in deze zelfstudie worden gebruikt.
Accentsconagua
GoogleMap.OnIndoorStateChangeListener wordt gebruikt om te bepalen wanneer een binnenniveau-keuzeschakelaar de zichtbaarheid heeft gewijzigd.SeekBar.OnSeekBarChangeListener wordt gebruikt met een van onze view-overlays om de niveauselectie te regelen, in plaats van de standaardset knoppen aan de rechterkant te gebruiken.GoogleMap.OnMapLongClickListener wordt in dit voorbeeld gebruikt om de weergegeven locatie van uw Street View-component te wijzigen.public class MapFragment breidt SupportMapFragment implementeert GoogleMap.OnIndoorStateChangeListener, GoogleMap.OnMapLongClickListener, SeekBar.OnSeekBarChangeListener
Nadat u de vereiste methoden voor die drie interfaces hebt toegevoegd, kunt u beginnen met het toevoegen van weergaven bovenaan de kaart.
Hoewel de basisfuncties van Google Maps aan de meeste behoeften voldoen, zijn er soms momenten dat u extra weergaven op de kaart wilt toevoegen om acties uit te voeren. Voor deze zelfstudie voegen we een toe SeekBar en een beetje Tekstweergave objecten om de bedieningselementen voor de indoorlevelselector aan te passen.
Begin met het maken van een nieuw XML-lay-outbestand, view_map_overlay.xml. Voeg de volgende code toe om de basislay-out te maken die op het scherm wordt gebruikt.
Zodra uw lay-outbestand compleet is, kunt u het toevoegen als een overlay aan uw kaartenfragment. In onCreateView, je moet toegang hebben tot de ViewGroup ouder, blaas uw nieuwe lay-out-overlay op en koppel deze aan de ouder. Hier kunt u ook verwijzingen naar elk van de weergaven in uw overlay opslaan, zodat deze later in uw app kunnen worden gewijzigd.
@Override openbaar View onCreateView (LayoutInflater inflater, ViewGroup-container, Bundel savedInstanceState) ViewGroup bovenliggende = (ViewGroup) super.onCreateView (inflater, container, savedInstanceState); View overlay = inflater.inflate (R.layout.view_map_overlay, parent, false); mIndoorSelector = (SeekBar) overlay.findViewById (R.id.indoor_level_selector); mIndoorMinLevel = (TextView) overlay.findViewById (R.id.indoor_min_level); mIndoorMaxLevel = (TextView) overlay.findViewById (R.id.indoor_max_level); parent.addView (overlay); terugkeer ouder;
Wanneer u de toepassing uitvoert, ziet u uw weergaven boven aan de kaart. U zult echter ook nog steeds de keuzeknop voor het standaardniveau zien, die de weergave vervaagt.
Om dit op te lossen, maakt u een nieuwe methode genaamd initMapIndoorSelector en noem het van onViewCreated. Het enige wat nodig is om te doen, is uw luisteraars op de SeekBar en binnen niveau veranderingen, evenals het uitschakelen van de standaard indoor niveau picker.
private void initMapIndoorSelector () mIndoorSelector.setOnSeekBarChangeListener (this); getMap (). getUiSettings (). setIndoorLevelPickerEnabled (false); getMap (). setOnIndoorStateChangeListener (this);
Nu u uw weergave op de kaart hebt staan, moet u deze verbergen totdat deze nodig is. In onViewCreated, noem een nieuwe helper-methode genaamd hideFloorLevelSelector dat verbergt al uw overlay-weergaven.
private void hideFloorLevelSelector () mIndoorSelector.setVisibility (View.GONE); mIndoorMaxLevel.setVisibility (View.GONE); mIndoorMinLevel.setVisibility (View.GONE);
Als uw weergaven zijn gemaakt en verborgen, kunt u beginnen met het toevoegen van de logica om uw weergaven te laten verschijnen wanneer nodig en interactie met de kaart. Eerder hebt u het gemaakt onIndoorBuildingFocused methode als een onderdeel van de GoogleMap.OnIndoorStateChangeListener. In die methode moet je een verwijzing opslaan naar welk gebouw dan ook in focus is en vervolgens verbergen of tonen SeekBar controles indien nodig.
@Override public void onIndoorBuildingFocused () mIndoorBuilding = getMap (). GetFocusedBuilding (); if (mIndoorBuilding == null || mIndoorBuilding.getLevels () == null || mIndoorBuilding.getLevels (). size () <= 1 ) hideFloorLevelSelector(); else showFloorLevelSelector();
Een binnengebouw krijgt meer aandacht wanneer het gebouw zichtbaar is voor de kaartcamera en de kaart voldoende is ingezoomd. Als aan die voorwaarden niet langer wordt voldaan, wordt deze methode opnieuw gebeld en GetMap (). getFocusedBuilding zal terugkeren a nul waarde.
showFloorLevelSelector maakt alle overlay-weergaven zichtbaar, verplaatst het SeekBar naar de juiste geselecteerde waarde en stelt de tekstlabels in op waarden die de korte naam van de bovenste en onderste verdieping voor dat gebouw vertegenwoordigen. Wanneer u de niveaus van een haalt IndoorBuilding object, de onderste verdieping is het laatste item in de lijst en de bovenste verdieping bevindt zich op positie 0.
private void showFloorLevelSelector () if (mIndoorBuilding == null) retour; int numOfLevels = mIndoorBuilding.getLevels (). size (); mIndoorSelector.setMax (numOfLevels - 1); // Onderste verdieping is het laatste item in de lijst, bovenste verdieping is de eerste mIndoorMaxLevel.setText (mIndoorBuilding.getLevels (). Get (0) .getShortName ()); mIndoorMinLevel.setText (mIndoorBuilding.getLevels (). get (numOfLevels - 1) .getShortName ()); mIndoorSelector.setProgress (mIndoorBuilding.getActiveLevelIndex ()); mIndoorSelector.setVisibility (View.VISIBLE); mIndoorMaxLevel.setVisibility (View.VISIBLE); mIndoorMinLevel.setVisibility (View.VISIBLE);
De laatste methode die u moet implementeren voor uw niveauschakelaar voor binnen is onProgressChanged (SeekBar seekBar, int progress, boolean fromUser). Wanneer de SeekBar positie is gewijzigd, moet u een nieuw niveau op het huidige gebouw activeren. Omdat de niveaus van boven naar beneden worden besteld, moet je het niveau op positie activeren numOfLevels - 1 - voortgang om te correleren met de positie van de SeekBar.
@Override public void onProgressChanged (SeekBar seekBar, int progress, Boolean b) if (mIndoorBuilding == null) return; int numOfLevels = mIndoorBuilding.getLevels (). size (); mIndoorBuilding.getLevels (). get (numOfLevels - 1 - progress) .activate ();
Nu u weet hoe u de weergave op uw kaart moet overlappen en hoe u met de niveauschakelaar op binnenniveau kunt werken, laten we u eens kijken hoe u met Street View in uw apps kunt werken. Net als Google Maps kunt u in Street View een fragment of een weergave gebruiken. Voor dit voorbeeld gebruikt u een StreetViewPanoramaView en leg het op je MapFragment.
Deze weergave wordt geïnitialiseerd om de straat naast Madison Square Garden weer te geven en wanneer u lang op een ander deel van de kaart drukt, worden in Street View afbeeldingen weergegeven die horen bij de geselecteerde positie. Als u selecteert om een gebied weer te geven dat niet rechtstreeks is verbonden met een Street View-afbeelding, kiest Google het dichtstbijzijnde display als dit binnen een ingestelde afstand is. Als er geen Street View-afbeeldingen in de buurt zijn (bijvoorbeeld als u een locatie in het midden van de oceaan selecteert), wordt in Street View een zwart scherm weergegeven.
Iets anders om op te letten is dat je er maar één kunt hebben StreetViewPanoramaView of fragment zichtbaar voor de gebruiker tegelijk.
Om te beginnen, update view_map_overlay.xml om een toe te voegen StreetViewPanoramaView.
Wanneer uw lay-outbestand gereed is, gaat u naar onCreateView in uw MapFragment, bewaar een verwijzing naar uw nieuwe weergave en bel de onCreate methode voor het uitzicht. Het is belangrijk dat je belt onCreate, omdat het huidige fragment is onCreate is al gebeld voordat deze weergave was bijgevoegd en het Street View-onderdeel voert acties uit onCreate die nodig zijn voor initialisatie.
@Override openbaar View onCreateView (LayoutInflater inflater, ViewGroup-container, Bundel savedInstanceState) ViewGroup bovenliggende = (ViewGroup) super.onCreateView (inflater, container, savedInstanceState); View overlay = inflater.inflate (R.layout.view_map_overlay, parent, false); mIndoorSelector = (SeekBar) overlay.findViewById (R.id.indoor_level_selector); mIndoorMinLevel = (TextView) overlay.findViewById (R.id.indoor_min_level); mIndoorMaxLevel = (TextView) overlay.findViewById (R.id.indoor_max_level); mStreetViewPanoramaView = (StreetViewPanoramaView) overlay.findViewById (R.id.steet_view_panorama); mStreetViewPanoramaView.onCreate (savedInstanceState); parent.addView (overlay); terugkeer ouder;
Volgende, in onViewCreated, voeg een nieuwe methode toe genaamd initStreetView. Deze nieuwe methode zal asynchroon de StreetViewPanorama object wanneer het gereed is en gebruik de weergave van uw eerste Street View-positie. Het is belangrijk om dat op te merken getStreetViewPanoramaAsync (OnStreetViewPanoramaReadyCallback callback) kan alleen worden aangeroepen vanuit de hoofdthread.
private void initStreetView () getMap (). setOnMapLongClickListener (this); mStreetViewPanoramaView.getStreetViewPanoramaAsync (nieuwe OnStreetViewPanoramaReadyCallback () @Override public void onStreetViewPanoramaReady (StreetViewPanorama panorama) mPanorama = panorama; showStreetView (nieuwe LatLng (40.7506, -73.9936)););
Ten slotte moet u de definiëren showStreetView (LatLng Latlng) helper-methode hierboven weergegeven. Deze methode creëert een StreetViewPanoramaCamera object waarmee u de kanteling, zoom en peiling van de Street View-camera kunt wijzigen. Voor dit voorbeeld is de camera ingesteld op de standaardwaarden.
Vervolgens moet u de camerapositie instellen. In dit voorbeeld schakelen we ook een optionele instelling in om straatnamen weer te geven.
private void showStreetView (LatLng latLng) if (mPanorama == null) retour; StreetViewPanoramaCamera.Builder builder = new StreetViewPanoramaCamera.Builder (mPanorama.getPanoramaCamera ()); builder.tilt (0.0f); builder.zoom (0.0f); builder.bearing (0.0f); mPanorama.animateTo (builder.build (), 0); mPanorama.setPosition (latLng, 300); mPanorama.setStreetNamesEnabled (true);
Zodra je showStreetView (LatLng Latlng) methode is voltooid, het kan ook worden aangeroepen onMapLongClick (LatLng latLng) dus je kunt eenvoudig veranderen welk gebied wordt getoond.
@Override public void onMapLongClick (LatLng latLng) showStreetView (latLng);
In deze zelfstudie hebt u geleerd over enkele geavanceerde manieren waarop u kunt communiceren met Google Maps door extra weergaven toe te voegen aan de MapFragment en je hebt geleerd hoe je de niveauschakelaar voor binnen gebouwen beheert. We hebben ook de basisbeginselen besproken van het toevoegen van de Street View-functionaliteit aan uw toepassing om uw gebruikers een ander gezichtspunt te bieden.
In de volgende aflevering van deze serie leert u meer over het Google Maps-hulpprogramma's bibliotheek en hoe u deze kunt gebruiken om markeringsclusters, heatmaps en andere handige functies voor uw toepassingen toe te voegen.
