Share
Eine der nützlichsten Funktionen für Benutzer ist die Integration von Karten. In der vorherigen Ausgabe dieser Serie wurde erläutert, wie Sie Google Maps für Android mithilfe von einrichten Google Developer Console und wie Sie ein einfaches Google Maps-Fragment erstellen. Wir haben dann verschiedene Arten von Markierungen hinzugefügt und auf der Karte gezeichnet.
In diesem Lernprogramm werden Sie das, was Sie im letzten Artikel gelernt haben, erweitern, um Ansichten auf eine Karte zu legen, die Steuerelemente für die Auswahl der Innenebene zu überschreiben und Ihren Anwendungen eine Street View-Komponente hinzuzufügen. Den Quellcode für diesen Artikel finden Sie auf GitHub.
Führen Sie zunächst die im vorherigen Artikel dieser Serie aufgeführten Schritte aus, um ein Basisprojekt mit a zu erstellen MapFragment, befestige es an einem Aktivität, und aktivieren Sie das Google Maps-API über die Google Developers Console. Für dieses Lernprogramm müssen Sie nicht die Play-Services-Klassen für Standorte verwenden. Sie müssen jedoch Karten-Play-Services-Bibliothek in Ihre importieren build.gradle Abhängigkeiten Knoten.
Abhängigkeiten compile fileTree (Verzeichnis: 'libs', include: ['* .jar'])) compile 'com.android.support:appcompat-v7:23.0.0' compile 'com.google.android.gms: play-services -maps: 7.8.0 '
Sobald dies erledigt ist, erhalten Sie einen Bildschirm, der wie folgt aussieht:
Als Nächstes müssen Sie Ihre Kamera einrichten. In diesem Tutorial konzentrieren wir uns auf den Madison Square Garden in New York City, da dies ein großartiges Beispiel für ein Gebäude ist, das die Karten auf Innenebene verwendet.
Im onViewCreated, Sie können der folgenden Hilfsmethode einen Aufruf hinzufügen initCamera. Sie erinnern sich vielleicht, dass wir bis warten müssen onViewCreated mit Google Maps zu arbeiten, da wir wissen, dass das Kartenobjekt einsatzbereit ist.
private void initCamera () CameraPosition position = CameraPosition.builder () .target (neue LatLng (40.7506, -73.9936)) .zoom (18f) .bearing (0.0f) .tilt (0.0f) .build (); getMap (). animateCamera (CameraUpdateFactory.newCameraPosition (position), null); getMap (). setMapType (GoogleMap.MAP_TYPE_HYBRID);
Die obige Methode bewegt die Kamera zu unserem Ziel und zoomt so weit heran, dass die Innenauswahl sichtbar wird. Sie werden bemerken, dass sich auf der rechten Seite des Bildschirms ein Zahlenstreifen befindet und für jede Etage eine Überlagerung auf der Karte. Wenn Sie rechts eine andere Ebene auswählen, wird der aktuelle Grundriss in die neue Ebene animiert. Dies ist die Funktion, mit der Sie später arbeiten werden, um eine eigene Ansichtssteuerungsstufe auszuwählen.
Als Nächstes müssen Sie die drei Schnittstellen implementieren, die in diesem Lernprogramm verwendet werden.
Accentsconagua
GoogleMap.OnIndoorStateChangeListener wird verwendet, um zu bestimmen, wann ein Innenebenenwähler die Sicht geändert hat.SeekBar.OnSeekBarChangeListener wird bei einer Ansichtsüberlagerung verwendet, um die Ebenenauswahl zu steuern, anstatt die Standardschaltflächen auf der rechten Seite zu verwenden.GoogleMap.OnMapLongClickListener wird in diesem Beispiel verwendet, um den angezeigten Ort Ihrer Street View-Komponente zu ändern.public class MapFragment erweitert SupportMapFragment implementiert GoogleMap.OnIndoorStateChangeListener, GoogleMap.OnMapLongClickListener, SeekBar.OnSeekBarChangeListener
Nachdem Sie die erforderlichen Methoden für diese drei Schnittstellen hinzugefügt haben, können Sie Ansichten über der Karte hinzufügen.
Während die grundlegenden Funktionen von Google Maps für die meisten Anforderungen geeignet sind, gibt es Zeiten, zu denen Sie zusätzliche Ansichten über die Karte hinzufügen möchten, um Aktionen auszuführen. Für dieses Tutorial fügen wir ein Suchleiste und einige Textvorschau Objekte, um die Bedienelemente für den Innenebenen-Wahlschalter anzupassen.
Erstellen Sie zunächst eine neue XML-Layoutdatei, view_map_overlay.xml. Fügen Sie den folgenden Code hinzu, um das Basislayout zu erstellen, das auf dem Bildschirm verwendet wird.
Wenn Ihre Layoutdatei fertig ist, können Sie sie Ihrem Kartenfragment als Overlay hinzufügen. Im onCreateView, Sie müssen auf das zugreifen ViewGroup überziehen Sie das neue Layout-Overlay und befestigen Sie es an dem übergeordneten Element. Hier speichern Sie auch Verweise auf jede Ansicht in Ihrer Überlagerung, damit sie später in Ihrer App geändert werden können.
@Override public View onCreateView (LayoutInflater-Inflater, ViewGroup-Container, Bundle savedInstanceState) ViewGroup parent = (ViewGroup) super.onCreateView (Inflater, Container, savedInstanceState); View overlay = inflater.inflate (R.layout.view_map_overlay, übergeordnet, falsch); 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 (Überlagerung); Eltern zurückgeben;
Wenn Sie die Anwendung ausführen, sollten Sie Ihre Ansichten über der Karte sehen. Sie sehen jedoch auch immer noch die Standardebenenauswahl, die die Ansicht stört.
Um dies zu beheben, erstellen Sie eine neue Methode mit dem Namen initMapIndoorSelector und nenne es von onViewCreated. Alles, was es tun muss, ist, Ihre Hörer für die Suchleiste Änderungen in Innenräumen und Innenebenen sowie Deaktivieren der Standard-Innenebenenauswahl.
private void initMapIndoorSelector () mIndoorSelector.setOnSeekBarChangeListener (this); getMap (). getUiSettings (). setIndoorLevelPickerEnabled (false); getMap (). setOnIndoorStateChangeListener (this);
Nachdem Sie nun die Ansicht über die Karte gelegt haben, müssen Sie sie ausblenden, bis sie benötigt wird. Im onViewCreated, Rufen Sie eine neue Hilfsmethode mit dem Namen hideFloorLevelSelector das verbirgt alle Ihre überlagerten Ansichten.
private void hideFloorLevelSelector () mIndoorSelector.setVisibility (View.GONE); mIndoorMaxLevel.setVisibility (View.GONE); mIndoorMinLevel.setVisibility (View.GONE);
Wenn Ihre Ansichten erstellt und ausgeblendet sind, können Sie die Logik hinzufügen, damit Ihre Ansichten bei Bedarf erscheinen und mit der Karte interagieren. Sie haben zuvor die erstellt onIndoorBuildingFocused Methode als Teil der GoogleMap.OnIndoorStateChangeListener. Bei dieser Methode müssen Sie einen Verweis auf das Gebäude speichern, das sich im Fokus befindet, und dann das Fenster ein- oder ausblenden Suchleiste steuert bei Bedarf.
@Override public void onIndoorBuildingFocused () mIndoorBuilding = getMap (). GetFocusedBuilding (); if (mIndoorBuilding == null || mIndoorBuilding.getLevels () == null || mIndoorBuilding.getLevels (). size () <= 1 ) hideFloorLevelSelector(); else showFloorLevelSelector();
Ein Innengebäude fokussiert, wenn das Gebäude für die Kartenkamera sichtbar ist und die Karte ausreichend vergrößert ist. Wenn diese Bedingungen nicht mehr erfüllt sind, wird diese Methode erneut aufgerufen getMap (). getFocusedBuilding wird ein zurückkehren Null Wert.
showFloorLevelSelector macht alle überlagerten Ansichten sichtbar, verschiebt den Suchleiste auf den richtig ausgewählten Wert und setzt die Textbeschriftungen auf Werte, die den Kurznamen der oberen und unteren Etagen des Gebäudes darstellen. Wenn Sie die Ebenen von einem abrufen IndoorBuilding Objekt ist das unterste Stockwerk das letzte Element in der Liste und das oberste Stockwerk ist an Position 0.
private void showFloorLevelSelector () if (mIndoorBuilding == null) return; int numOfLevels = mIndoorBuilding.getLevels (). size (); mIndoorSelector.setMax (numOfLevels - 1); // Unteres Stockwerk ist das letzte Element in der Liste, oberstes Stockwerk ist das erste 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);
Die letzte Methode, die Sie für den Wahlschalter für den Innenbereich implementieren müssen, ist onProgressChanged (SeekBar seekBar, int progress, boolean von User). Wenn der Suchleiste Position geändert wird, müssen Sie eine neue Ebene im aktuellen Gebäude aktivieren. Da die Ebenen von oben nach unten angeordnet sind, müssen Sie die Ebene an der Position aktivieren numOfLevels - 1 - Fortschritt um mit der Position des zu korrelieren Suchleiste.
@Override public void onProgressChanged (Suchleiste, int progress, boolean b) if (mIndoorBuilding == null) return; int numOfLevels = mIndoorBuilding.getLevels (). size (); mIndoorBuilding.getLevels (). get (numOfLevels - 1 - progress) .activate ();
Nun, da Sie wissen, wie Sie Ansichten auf einer Karte überlagern und wie Sie mit der Indoor-Ebenenauswahl arbeiten können, lernen Sie in Ihren Apps die Arbeit mit Street View kennen. Wie bei Google Maps können Sie in Street View entweder ein Fragment oder eine Ansicht verwenden. Für dieses Beispiel verwenden Sie a StreetViewPanoramaView und überlagern Sie es auf Ihrem MapFragment.
Diese Ansicht wird so initialisiert, dass die Straße neben Madison Square Garden angezeigt wird. Wenn Sie lange auf einen anderen Bereich der Karte drücken, zeigt Street View Bilder an, die der ausgewählten Position zugeordnet sind. Wenn Sie auswählen, dass ein Bereich angezeigt werden soll, der nicht direkt mit einem Street View-Bild verbunden ist, wählt Google den nächstgelegenen für die Anzeige aus, wenn er sich innerhalb einer festgelegten Entfernung befindet. Wenn sich keine Street View-Bilder in der Nähe befinden (sagen Sie, Sie wählen einen Ort in der Mitte des Ozeans), zeigt Street View einen schwarzen Bildschirm.
Etwas anderes zu beachten ist, dass Sie nur einen haben können StreetViewPanoramaView oder Fragment sichtbar für den Benutzer zu einer Zeit.
Um zu beginnen, aktualisieren Sie view_map_overlay.xml um a StreetViewPanoramaView.
Wenn Ihre Layoutdatei fertig ist, gehen Sie zu onCreateView in deiner MapFragment, Speichern Sie einen Verweis auf Ihre neue Ansicht und rufen Sie die onCreate Methode für die Ansicht. Es ist wichtig, dass Sie anrufen onCreate, weil das aktuelle Fragment ist onCreate wurde bereits aufgerufen, bevor diese Ansicht angefügt wurde, und die Street View-Komponente führt Aktionen aus onCreate das sind für die Initialisierung notwendig.
@Override public View onCreateView (LayoutInflater-Inflater, ViewGroup-Container, Bundle savedInstanceState) ViewGroup parent = (ViewGroup) super.onCreateView (Inflater, Container, savedInstanceState); View overlay = inflater.inflate (R.layout.view_map_overlay, übergeordnet, falsch); 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 (Überlagerung); Eltern zurückgeben;
Als nächstes in onViewCreated, Fügen Sie eine neue Methode hinzu initStreetView. Diese neue Methode wird asynchron as erhalten StreetViewPanorama Objekt, wenn es fertig ist, und zeigen Sie Ihre anfängliche Street View-Position an. Es ist wichtig, das zu beachten getStreetViewPanoramaAsync (OnStreetViewPanoramaReadyCallback-Rückruf) kann nur vom Hauptthread aus aufgerufen werden.
private void initStreetView () getMap (). setOnMapLongClickListener (this); mStreetViewPanoramaView.getStreetViewPanoramaAsync (new OnStreetViewPanoramaReadyCallback () @Override public void onStreetViewPanoramaReady (StreetViewPanorama panorama)) mPanorama = panorama; showStreetView (neuer LatLng (40))
Zum Schluss müssen Sie das definieren showStreetView (LatLng Latlng) Hilfsmethode oben gezeigt. Diese Methode erstellt eine StreetViewPanoramaCamera Objekt, mit dem Sie die Neigung, den Zoom und die Ausrichtung der Street View-Kamera ändern können. Für dieses Beispiel ist die Kamera auf die Standardwerte eingestellt.
Als nächstes müssen Sie die Kameraposition einstellen. In diesem Beispiel aktivieren wir auch eine optionale Einstellung, um Straßennamen anzuzeigen.
private void showStreetView (LatLng latLng) if (mPanorama == null) return; 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);
Einmal dein showStreetView (LatLng Latlng) Methode abgeschlossen ist, kann es auch von aufgerufen werden onMapLongClick (LatLng LatLng) Sie können also leicht ändern, welcher Bereich angezeigt wird.
@Override public void onMapLongClick (LatLng latLng) showStreetView (latLng);
In diesem Lernprogramm haben Sie einige fortgeschrittene Möglichkeiten kennengelernt, mit denen Sie mit Google Maps interagieren können, indem Sie zusätzliche Ansichten hinzufügen MapFragment und Sie haben gelernt, wie Sie den Stufenschalter für Gebäude in Innenräumen steuern. Außerdem haben wir die Grundlagen zum Hinzufügen von Street View-Funktionen zu Ihrer Anwendung erläutert, um Ihren Benutzern einen anderen Standpunkt zu zeigen.
In der nächsten Ausgabe dieser Serie erfahren Sie mehr über die Google Maps-Dienstprogramme und wie Sie diese verwenden, um Marker-Cluster, Heatmaps und andere nützliche Funktionen für Ihre Anwendungen hinzuzufügen.
