Tipos de vistas Google Maps Xamarin.Android Componente Play Services


En esta entrada veremos como utilizar el componente Play Services para utilizar los mapas de google, posteriormente veremos como visualizar las diferentes vistas, para ello creamos un nuevo proyecto:
Abrimos Android SDK Manager y verificamos que tengamos instalado Google Play Services
Si no lo tenemos instalado, ahora es momento de instalarlo.


Borramos los datos que no necesitamos de nuestra actividad principal. una vez hecho nos vamos a componentes, hacemos clic secundaria y hacemos clic en Edit Components:
Nos aparece la siguiente ventana, damos clic en Add to Project:
Nos aparece nuestro componente asi como la referencia a play services en references:
Ahora necesitamos agregar los permisos a nuestra aplicacion para lo cual nos vamos a la carpeta Properties y abrimos nuestro archivo AndroidManifiest.xml


Editamos para que tenga los siguientes permisos:
Para usar Google Maps se necesita una ApiKey la cual puedes obtener aqui:
https://cloud.google.com/console
En las referencias dejare enlaces a como obtener el  Certificado SHA1 y apikey
Primero necesitas obtener el certificado SHA1, para ello abrimos simbolo de sistema en windows y hacemos lo siguiente:
Si tienes problemas con la ruta para obtener solo tienes que mover el archivo debug.keystore:
Ya que tenemos esto ingresamos al enlace y veremos algo semejante:
Damos clic donde dice Create new Android key...
Nos aparece la siguiente ventana:
Recuerden que nos pedira el paquete que tiene nuestra app, para saber cual es hacemos lo siguiente, doble clic sobre el nombre de nuestro proyecto nos muestra la siguiente ventana:
Copiamos el nombre del paquete y lo ponemos despues del ; una vez hecho hacemos clic en Create.
Ahora que ya tenemos los permisos regresamos a nuestra MainActivity.cs e importamos las siguientes librerias:
Estas librerias nos permirtiran el uso de de los mapas, asi como el uso de fragments, etc.
A continuacion declaramos dos variables:
La primera de ellas nos permitirá convertir nuestro frame layout en un Mapfragment.
La siguiente variable recibirá la vista como mapa del Mapfragment.
A continuacion agreamos los botones que nos permitiran cambiar las vistas que tendra nuestro mapa:
Será el archivo Main.axml, la vista grafica sera la siguiente:
Ya que tenemos la parte grafica completa, en nuestra MainActivity, agregamos el siguiente metodo:

Este metodo nos permitira cargar nuestro mapa con la vista predeterminada en nuestra app, asi como habilitar los botones de zoom para una mejor manipulacion de nuestro mapa.
Dentro de nuestro metodo OnCreate agregamos el metodo, y posteriormente declaramos nuestros botones:



Ya que los tenemos referenciados con nuestro Main.axml, procedemos a codificar las acciones que haran cuando se haga clic sobre cada uno de ellos, nuestra variable MapFragment recibe la vista del framelayout y la convierte a mapfragment, y a su vez pasamos esto a un tipo GoogleMap, verificamos si la variable mMap es diferente de null, si es asi le pasamos la vista que corresponde al boton, el codigo seria el siguiente:

Construimos nuestro proyecto y posteriormente ejecutamos, como lo hice en un dispositivo, tome fotos:
Asi quedarian las vistas:
Vista: GoogleMap.MapTypeNone;
Vista: GoogleMap.MapTypeTerrain;
Vista: GoogleMap.MapTypeNormal;
Vista: GoogleMap.MapTypeSatellite;

Vista: GoogleMap.MapTypeHybrid;

 Esto seria todo por esta entrada. Para cualquier duda o comentario.

Sigueme en twitter:
https://twitter.com/OsvaldoSan

No olvides consultar las referencias:
http://developer.android.com/reference/android/support/v4/app/package-summary.html
http://docs.xamarin.com/guides/android/platform_features/maps_and_location/
http://docs.xamarin.com/guides/android/platform_features/maps_and_location/maps/obtaining_a_google_maps_api_key/


Comentarios

Publicar un comentario

Entradas populares de este blog

Entry Show/Hide Password on Xamarin.Forms

Imagen
Hello, in this post i will talk about a way of how to implement a Show/Hide password on Entry control. In our Xamarin.Forms project, we add  a CustomRender for iOS, and  for Android we are using a Effects in order of have a result almost equals. I'm gonna start with the iOS functionality, so I will add a class render: using System ; using Xamarin.Forms ; namespace ShowHidePasswordEntryXF { public class ShowHidePasswordEntry : Entry { public ShowHidePasswordEntry () { } public string EntryText { get ; set ; } } } After that, in the iOS project, i will create the renderer, in which I add a UIButton and add a EventHandler in order to know if the user want to look the password or not: buttonRect . TouchUpInside   +=   ( object   sender ,   EventArgs   e1 )   = >                  {                      if   ( Control . SecureTextEntry )                      {                          Control . SecureTextEntry   =   false ;               
Leer más

Xamarin.Forms Frame

Imagen
Hello, in this post we gonna be look how we can use a Frame in Xamarin.Forms This simple rectangular view sometimes is very usefull for presentation purposes. The first, we add a new Page, called FramePage. in the constructor we add a new View, the Frame View, also we declare some properties, like OutlineColor, and if we want that has Shadow around of the frame:              this . Content   =   new  Xamarin . Forms . Frame   {              // It   has   a   few  properties                 OutlineColor = Color . Blue ,                 HasShadow = true , } So, to avoid that the frame fill all the page, we add the properties to center the frame inside of the page:                 HorizontalOptions = LayoutOptions . CenterAndExpand ,                 VerticalOptions = LayoutOptions . CenterAndExpand , And for last, we add the content of the frame, in this case we add a single Label, Content =   new   Label {                     Text = " This   is
Leer más

Xamarin.Forms Picker

Imagen
In this post, we gonna be see, the Picker Control in Xamarin.Forms The picker is a control that allows select one element from a predetermined list of options. The first thing that we need to do, is create a instance of Picker:             Xamarin . Forms . Picker   picker   =   new  Xamarin . Forms . Picker              {                 Title  =   " Chose   one   country " ,                 VerticalOptions  =   LayoutOptions . CenterAndExpand ,                 BackgroundColor = Color . Aqua              } ; Next, we need to asign the values for our Picker control, and we do it, on the next way:             picker . Items . Add   ( " Canada " ) ;              picker . Items . Add   ( " USA " ) ;              picker . Items . Add   ( " Mexico " ) ;              picker . Items . Add   ( " Brasil " ) ;              picker . Items . Add   ( " Argentina " ) ;              picker . Items . Add   ( &q
Leer más