En av de mest nyttige funksjonene for brukere er kartintegrasjon. I den forrige delen av denne serien diskuterte vi hvordan du konfigurerer Google Maps for Android ved hjelp av Google Developer Console og hvordan du lager et grunnleggende Google Maps-fragment. Vi gikk da over å legge til forskjellige typer markører og hvordan å tegne på kartet.
I denne opplæringen vil du utvide på det du lærte i den siste artikkelen for å legge til visninger på toppen av et kart, overstyr innstillingene for innendørsnivåvalg og legge til en Street View-komponent i programmene dine. Kildekoden for denne artikkelen finnes på GitHub.
For å starte, følg trinnene som er oppført i forrige artikkel i denne serien for å opprette et grunnleggende prosjekt ved hjelp av en MapFragment
, legg det til en Aktivitet
, og aktiver Google Maps API gjennom Google Developers Console. For denne opplæringen trenger du ikke å bruke klassene Play Services-klasser, men du må importere kart Play Services-bibliotek til din build.gradle avhengig
node.
avhengigheter compile fileTree (dir: 'libs', inkluderer: ['* .jar']) kompilere 'com.android.support:appcompat-v7:23.0.0' compile 'com.google.android.gms: spilltjenester -kart: 7.8.0 '
Når det er gjort, slutter du med en skjerm som ser ut som følgende:
Deretter må du sette opp kameraet. For denne opplæringen vil vi fokusere på Madison Square Garden i New York City, fordi det er et godt eksempel på en bygning ved hjelp av innendørs nivå kartene.
I onViewCreated
, Du kan legge til en samtale til følgende hjelpemetode initCamera
. Du kan huske at vi må vente til onViewCreated
å jobbe med Google Maps, fordi dette er når vi vet at kartobjektet er klar til bruk.
privat tomt initCamera () CameraPosition position = CameraPosition.builder () .target (new LatLng (40.7506, -73.9936)) .zoom (18f) .bearing (0.0f) .tilt (0.0f) .build (); getMap (). animateCamera (CameraUpdateFactory.newCameraPosition (posisjon), null); getMap (). setMapType (GoogleMap.MAP_TYPE_HYBRID);
Ovennevnte metode beveger kameraet til målet vårt og zoomer nært nok til at innendørsvælgeren blir synlig. Du vil merke at det er en stripe med tall på høyre side av skjermen og et overlegg på kartet for hver etasje. Når du velger et annet nivå til høyre, animerer den nåværende planløsningen til den nye. Dette er funksjonen du vil jobbe med senere for å få ditt eget visnings kontrollnivåvalg.
Deretter må du implementere de tre grensesnittene som skal brukes i denne opplæringen.
GoogleMap.OnIndoorStateChangeListener
brukes til å bestemme når en innendørsnivåvelger har endret synlighet.SeekBar.OnSeekBarChangeListener
brukes med en av våre oversikter for å kontrollere nivåvalg, i stedet for å bruke standard sett med knapper til høyre.GoogleMap.OnMapLongClickListener
brukes i dette eksemplet for å endre den viste plasseringen til Street View-komponenten din.offentlig klasse MapFragment utvider SupportMapFragment implementerer GoogleMap.OnIndoorStateChangeListener, GoogleMap.OnMapLongClickListener, SeekBar.OnSeekBarChangeListener
Når du har lagt til de nødvendige metodene for de tre grensesnittene, kan du begynne å legge til visninger på toppen av kartet.
Selv om grunnfunksjonene i Google Maps passer de fleste behov, vil det være ganger du vil legge til flere visninger over kartet for å utføre handlinger. For denne opplæringen legger vi til en seekbar
og noe TextView
objekter for å tilpasse kontrollene for innendørsnivåvelgeren.
Start med å opprette en ny XML-layoutfil, view_map_overlay.xml. Legg til følgende kode for å lage grunnlayoutet som skal brukes på skjermen.
Når layoutfilen din er ferdig, kan du legge den til som et overlegg til kartfragmentet ditt. I onCreateView
, du må ha tilgang til ViewGroup
foreldre, oppblåser det nye layoutoverlegget, og legg det til foreldrene. Dette er også hvor du lagrer referanser til hver av visningene i overlegget ditt slik at de kan endres senere i appen din.
@Override public View onCreateView (LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) ViewGroup foreldre = (ViewGroup) super.onCreateView (oppblåsers, container, savedInstanceState); Se overlegg = inflater.inflate (R.layout.view_map_overlay, foreldre, 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 (overlegg); retur foreldre;
Når du kjører programmet, bør du se visningene dine på toppen av kartet. Du vil imidlertid likevel se standardnivåvelgeren, som clutters opp visningen.
For å fikse dette, opprett en ny metode som heter initMapIndoorSelector
og ring det fra onViewCreated
. Alt du trenger å gjøre, er satt dine lyttere for seekbar
og innendørs nivå endringer, samt deaktivere standard innendørs nivå plukkeren.
privat tomt initMapIndoorSelector () mIndoorSelector.setOnSeekBarChangeListener (dette); getMap (). getUiSettings (). setIndoorLevelPickerEnabled (false); getMap (). setOnIndoorStateChangeListener (dette);
Nå som du har visningen din overlapping kartet, må du gjemme det til det trengs. I onViewCreated
, ring en ny hjelpemetode som heter hideFloorLevelSelector
som gjemmer alle dine overlappede visninger.
privat tomrom hideFloorLevelSelector () mIndoorSelector.setVisibility (View.GONE); mIndoorMaxLevel.setVisibility (View.GONE); mIndoorMinLevel.setVisibility (View.GONE);
Med visningene dine opprettet og skjult, kan du begynne å legge til i logikken for å få dine synspunkter synlige når det trengs og samhandle med kartet. Tidligere skapte du onIndoorBuildingFocused
metode som en del av GoogleMap.OnIndoorStateChangeListener
. I den metoden må du lagre en referanse til hvilken bygning som er i fokus og deretter skjule eller vise seekbar
kontrollerer når det er nødvendig.
@Override public void onIndoorBuildingFocused () mIndoorBuilding = getMap (). GetFocusedBuilding (); hvis (mIndoorBuilding == null || mIndoorBuilding.getLevels () == null || mIndoorBuilding.getLevels (). size () <= 1 ) hideFloorLevelSelector(); else showFloorLevelSelector();
En innendørs bygning vil få fokus når bygningen er synlig for kartkameraet, og kartet er zoomet inn nok. Hvis disse betingelsene ikke lenger er oppfylt, blir denne metoden igjen og GetMap (). getFocusedBuilding
vil returnere a null
verdi.
showFloorLevelSelector
gjør alle de overlappede synene synlige, flyttes seekbar
til riktig valgt verdi, og setter tekstetikettene til verdier som representerer det korte navnet på topp- og bunngulvene for den bygningen. Når du henter nivåene fra en IndoorBuilding
objekt, nederste etasje er det siste elementet i listen og toppetasjen er på posisjon 0.
privat tomt showFloorLevelSelector () hvis (mIndoorBuilding == null) tilbake; int numOfLevels = mIndoorBuilding.getLevels () .størrelse (); mIndoorSelector.setMax (numOfLevels - 1); // nederste etasje er det siste elementet i listen, øverste etasje er den første 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);
Den endelige metoden du må implementere for innendørsnivåvelgeren er onProgressChanged (SeekBar seekBar, int fremgang, boolean fromUser)
. Når seekbar
posisjonen er endret, må du aktivere et nytt nivå i gjeldende bygning. Siden nivåene er bestilt fra topp til bunn, må du aktivere nivået på posisjon numOfLevels - 1 - fremgang
for å korrelere med posisjonen til seekbar
.
@Override public void onProgressChanged (SeekBar seekBar, int fremgang, boolsk b) if (mIndoorBuilding == null) tilbake; int numOfLevels = mIndoorBuilding.getLevels () .størrelse (); mIndoorBuilding.getLevels (). få (numOfLevels - 1 - fremgang) .aktiver ();
Nå som du vet hvordan du overlegger visninger på ditt kart og hvordan du arbeider med innendørsnivåvelgeren, la oss hoppe inn i hvordan du arbeider med Street View i appene dine. På samme måte som Google Maps, kan Street View du enten bruke et fragment eller en visning. For dette eksempelet vil du bruke en StreetViewPanoramaView
og legg det over på ditt MapFragment
.
Denne visningen vil bli initialisert for å vise gaten ved siden av Madison Square Garden, og når du trykker lenge på et annet område av kartet, vil Street View vise bilder tilknyttet den valgte plasseringen. Hvis du velger å vise et område som ikke er direkte koblet til et Street View-bilde, velger Google det nærmeste som vises hvis det er innenfor en bestemt avstand. Hvis det ikke er noen Street View-bilder i nærheten (si du velger et sted midt i havet), viser Street View en svart skjerm.
Noe annet å være klar over er at du bare kan ha en StreetViewPanoramaView
eller fragment synlig for brukeren om gangen.
For å starte, oppdater view_map_overlay.xml for å legge til en StreetViewPanoramaView
.
Når layoutfilen er klar, gå inn på onCreateView
i din MapFragment
, lagre en referanse til den nye visningen din, og ring til onCreate
metode for visningen. Det er viktig at du ringer onCreate
, fordi det nåværende fragmentet er onCreate
har allerede blitt kalt før denne visningen var vedlagt, og Street View-komponenten utfører handlinger i onCreate
som er nødvendige for initialisering.
@Override public View onCreateView (LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) ViewGroup foreldre = (ViewGroup) super.onCreateView (oppblåsers, container, savedInstanceState); Se overlegg = inflater.inflate (R.layout.view_map_overlay, foreldre, 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); retur foreldre;
Neste, i onViewCreated
, Legg til en ny metode som heter initStreetView
. Denne nye metoden vil asynkront få StreetViewPanorama
objekt når det er klart og håndtere å vise din første Street View-posisjon. Det er viktig å merke seg det getStreetViewPanoramaAsync (OnStreetViewPanoramaReadyCallback tilbakeringing)
kan bare hentes fra hovedtråden.
privat tomt initStreetView () getMap (). setOnMapLongClickListener (dette); mStreetViewPanoramaView.getStreetViewPanoramaAsync (ny OnStreetViewPanoramaReadyCallback () @Override public void onStreetViewPanoramaReady (StreetViewPanorama panorama) mPanorama = panorama; showStreetView (new LatLng (40.7506, -73.9936););
Til slutt må du definere showStreetView (LatLng latlng)
hjelpemetode vist ovenfor. Denne metoden skaper en StreetViewPanoramaCamera
objekt som lar deg endre tilt, zoom og lager av Street View-kameraet. For dette eksempelet er kameraet satt til standardverdiene.
Deretter må du sette kameraposisjonen. I dette eksemplet slår vi også på en valgfri innstilling for å vise gatenavn.
privat tomt showStreetView (LatLng latLng) hvis (mPanorama == null) tilbake; StreetViewPanoramaCamera.Builder builder = ny 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);
En gang din showStreetView (LatLng latlng)
Metoden er fullført, den kan også kalles fra onMapLongClick (LatLng latLng)
slik at du enkelt kan endre hvilket område som blir vist.
@Override public void onMapLongClick (LatLng latLng) showStreetView (latLng);
I denne opplæringen har du lært om noen avanserte måter du kan samhandle med Google Maps ved å legge til flere visninger til MapFragment
og du lærte hvordan du kontrollerer innendørsbyggingsnivåvelgeren. Vi dekket også grunnleggende om å legge til Street View-funksjonalitet i søknaden din for å vise et annet synspunkt for brukerne.
I neste utgave av denne serien vil du lære om Google Maps Verktøy bibliotek og hvordan du bruker det til å legge til markørklynger, varmekart og andre nyttige funksjoner for dine applikasjoner.