Ejemplos Gratis de Programacion

Arboles binarios sencillos en Java

2013-10-29T08:02:00.000-05:00

Buenas noches, estaba leyendo por hay cosas en Internet cuando de repente me encontré con una muchacha que hablaba acerca de los arboles y la implementacion de la búsqueda binaria, y pues recordé que muchos me piden que los ayuden con eso así que aquí esta:

Este arbol es muy sencillo, simplemente agrega nodos (sin eso de balancear el arbol, porque no recuerdo como se hace XD) y luego permite buscar un nodo.

Ademas me muestra el arbol graficamente y tambien su busqueda, espero les sirva, no le agrege nada del tipo de recorrido (pre orden,post-orden etc) porque no m quedo tiempo, espero les sirva y luego subire uno con todos los lujos

Recorridos (pre-orden, in-orden, post-orden) Arboles en Java

2013-10-29T07:52:00.000-05:00

Software que te permite crear arboles, en el cual puedes:

Añadir Nodo
Buscar Nodos
Eliminar Nodos
Recorre el Árbol:
- Pre-Orden
- In-Orden
- Post-Orden

Aquí un ejemplo tomado de http://www.mitecnologico.com/Main/RecorridosEnUnArbol

Pre Orden (RID) 18, 12, 5, 9, 28, 20, 35

En Orden (IRD) 5, 9, 12, 18, 20, 28, 35

Post Orden (IDR) 9, 5, 12, 20, 35, 28, 18

Arboles Binarios con eliminacion de Nodos

2013-10-29T07:46:00.001-05:00

Código de Arboles Binarios que permite al usuario:

Anadir Nodos

Buscar Nodos

Eliminar Nodos

Lo mas llamativo de este, es que permite hacer todo esto gráficamente así al momento de añadir un nuevo nodo el usuario lo podrá ver, al buscar podrá ver al eliminar también espero les sirva a mucho y ya saben compartan con sus amigos

Consultando Datos con CakePhp

2013-10-27T19:19:00.001-05:00

En este vídeo se explica como realizar consultas a una base de datos, sin escribir código sql. Para realizar este objetivo, se describen las convenciones que tenemos que seguir de CakePhp. Se describe como crear el modelo,controlador y vista, para poder consultar a todos los elementos de la tabla Usuarios de la base de datos.

http://jamper91.byethost7.com/
http://jamper91.hostei.com/
http://jamper91.blogspot.com/

Este videotutorial estan basados en el manual de cakePhp que redacte, y que podrán conseguir en estas direcciones:
http://jamper91.blogspot.com/2013/10/aprender-desarrollar-aplicacion-web-de.html
http://jamper91.byethost7.com/2013/10/03/aprender-a-desarrollar-aplicacion-web-de-una-manera-rapida-con-cakephp/

Instalando y Configurar CakePhp

2013-10-27T19:18:00.000-05:00

En este primer vídeo tutorial se muestra como instalar y configurar CakePhp, para poder desarrollar aplicaciones de una manera rápida y sencilla con el framework

http://jamper91.byethost7.com/
http://jamper91.hostei.com/
http://jamper91.blogspot.com/

Este videotutorial estan basados en el manual de cakePhp que redacte, y que podran conseguir en estas direcciones:
http://jamper91.blogspot.com/2013/10/aprender-desarrollar-aplicacion-web-de.html
http://jamper91.byethost7.com/2013/10/03/aprender-a-desarrollar-aplicacion-web-de-una-manera-rapida-con-cakephp/

Consultando Datos con CakePhp

2013-10-27T14:33:00.000-05:00

[caption id="attachment_1185" align="aligncenter" width="600"] Consultando datos con CakePhp[/caption]

En este vídeo se explica como realizar consultas a una base de datos, sin escribir código sql. Para realizar este objetivo, se describen las convenciones que tenemos que seguir de CakePhp. Se describe como crear el modelo,controlador y vista, para poder consultar a todos los elementos de la tabla Usuarios de la base de datos.

http://jamper91.byethost7.com/
http://jamper91.hostei.com/
http://jamper91.blogspot.com/

Este videotutorial estan basados en el manual de cakePhp que redacte, y que podrán conseguir en estas direcciones:
http://jamper91.blogspot.com/2013/10/aprender-desarrollar-aplicacion-web-de.html
http://jamper91.byethost7.com/2013/10/03/aprender-a-desarrollar-aplicacion-web-de-una-manera-rapida-con-cakephp/

Instalando y Configurar CakePhp

2013-10-27T14:26:00.000-05:00

[caption id="attachment_1189" align="aligncenter" width="600"] Instalando y onfigurando CakePhp[/caption]

En este primer vídeo tutorial se muestra como instalar y configurar CakePhp, para poder desarrollar aplicaciones de una manera rápida y sencilla con el framework

http://jamper91.byethost7.com/
http://jamper91.hostei.com/
http://jamper91.blogspot.com/

Este videotutorial estan basados en el manual de cakePhp que redacte, y que podran conseguir en estas direcciones:
http://jamper91.blogspot.com/2013/10/aprender-desarrollar-aplicacion-web-de.html
http://jamper91.byethost7.com/2013/10/03/aprender-a-desarrollar-aplicacion-web-de-una-manera-rapida-con-cakephp/

Leer numero y decir si son primos

2013-10-23T14:00:00.000-05:00

Lo sientos chicos este blog ya fue abandonado, perdonen las molestias, ahora todo lo puede conseguir aqui: http://jamper91.byethost7.com/

Digite una serie de numero y averiguar que si el anterior y el actual son primos, yo lo entendi así miren el ejemplo
digite numero: 4
digite numero: 7
47 es primo
digite numero:3
73 no es primo.

Lo pueden encontrar aqui, realizado en C, C++, C#, Java, Visual Basic

Aplicacion Grafica de Grafos

2013-10-23T08:07:00.000-05:00

Edición:
El código anterior, se perdió, al perder el acceso a la pagina, y no lo consigo, pero en su defecto les dejo un código muy similar sobre grafos. Es un editor gráfico que nos permite agregar nodo, y conexiones entre nodos, esto con el objeto de obtener le vector distancia entre routers (redes), pero para este caso servirá bien como ejemplo de grafos.

Manejo de zonas con OpenLayers

2013-10-21T09:02:00.000-05:00

En esta guía, veremos como podemos crear sobre el mapa de forma dinamia "zonas". Estas zonas son áreas que se muestran con otro color sobre el mapa, que delimitan lo que a nosotros nos apetece, pueden ser "zonas de cuidado", "areas de cobertura", etc.

Para poder crear estas zonas, debemos añadir una capa nueva al mapa, esta capa sera del tipo Vector

vectors = new OpenLayers.Layer.Vector("Capa Vectorial");
 mapa.addLayer(vectors);

También se usaran 2 variables para determinar que acción se va a realizar:

drawP: si dibujar una nueva área
editP: editar una ya existente

drawP=new OpenLayers.Control.DrawFeature(vectors,OpenLayers.Handler.Polygon)
mapa.addControl(drawP);
editP= new OpenLayers.Control.ModifyFeature(vectors);
mapa.addControl(editP);

En este caso, se instancia la variable drawP, para que pintara un polígono, pero también se puede escoger Point o RegularPolygon (para ver mas información sobre la clase OpenLayers.Handler, visitar la documentación oficial ).

var options =
{
hover: true,
onSelect: serialize
};
select = new OpenLayers.Control.SelectFeature(vectors, options);
mapa.addControl(select);

En esta sección, lo que se hace es agregar un control al evento "SelectFeature", esto con el fin de que cuando se coloque el mouse sobre un área (hover), se pinte su código en el cuadro de dialogo. Para realizar estas acciones se llama a la función "serialize", tal como se describe en la variable options, que se pasa al constructor de la variable select.

La funcion updateFormats es usada para determinar en que formato se mostrara la salida, con formato me refieron a las "medidas " de coordenadas.

Las funciones activarDrawFeacture y activarModifyFeacture son usadas para determina que accion a realizar, si pintar una zona (feature) o modificar una ya existente, para esto, solo basta con llamar dichas funciones desde los botones respectivos.

Para poder realizar todas las acciones anteriomente mencionadas, primero se debe llamar a la funcion iniciarDrawFeacture, que se encarga de iniciar todo lo necesario (capas, variables,controles,etc). Para hacer esto, lo realizamos desde la funcion onLoad del body

<body onload="iniciar(); iniciarDrawFeacture();">

Aqui esta el codigo de la pagina zonas.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script type="text/javascript" src="js/OpenLayers_base.js"></script>
<script type="text/javascript" src="js/OpenLayers_features.js"></script>
<style type="text/css">
     .smallmap {
      width: 929px;
      height: 300px;
     }
</style>
</head>
<body <body onLoad="iniciar();iniciarDrawFeacture();">
 <h3>Nuestro primer mapa con OpenLayers</h3>
 <div id="mapa" class="smallmap">

 </div>
 <table width="80%">
         <tr>
          <td align="center">
                 <input type="submit" name="crearFeature" id="crearFeature" value="Crear Zona" onclick="activarDrawFeacture()" /> 
          </td>
                <td align="center">
                 <input type="submit" name="editarFeature" id="editarFeature" value="Editar Zona" onclick="activarModifyFeacture()" />
                </td>
   </tr>
        </table>

        <p align="center"><strong>Coordenadas Zona</strong></p>
        <div align="center">
          <textarea name="coordenadasZona" cols="80" rows="10" id="coordenadasZona"></textarea>
          </input>    
</body>
</html>

Aqui esta el archivo OpenLayers_features.js

var drawP,editP,vectors,select,formats;

//Funcion se encarga de agregar los controles para poder dibujar y editar polygonos
function iniciarDrawFeacture()
{

 vectors = new OpenLayers.Layer.Vector("Capa Vectorial");
 mapa.addLayer(vectors);
 drawP=new OpenLayers.Control.DrawFeature(vectors,OpenLayers.Handler.Polygon)
 mapa.addControl(drawP);
 editP= new OpenLayers.Control.ModifyFeature(vectors);
 mapa.addControl(editP);
 updateFormats();
 var options = 
 {
        hover: true,
        onSelect: serialize
    };
    select = new OpenLayers.Control.SelectFeature(vectors, options);
 mapa.addControl(select);

}
//Esta funcion permite dibujar un feature()
function activarDrawFeacture()
{
 editP.deactivate();
 drawP.activate();
 select.activate();

}
//Esta funcion permite obtener el codigo de un poligono y mostrarlo en un string
function serialize(feature) 
{
    var type = "geojson";
    // second argument for pretty printing (geojson only)
    var pretty = 1;
    var str = formats['out'][type].write(feature, pretty);
    // not a good idea in general, just for this demo
    str = str.replace(/,/g, ', ');
 $("#coordenadasZona").attr('value','Codigo Zona: '+str);
    return str;
}
//Esta funcion es para tener unos formatos estandar de codificacion
function updateFormats() 
{
  var in_options = {
                'internalProjection': mapa.baseLayer.projection,
                'externalProjection': new OpenLayers.Projection("EPSG:4326")
            };   
            var out_options = {
                'internalProjection': mapa.baseLayer.projection,
                'externalProjection': new OpenLayers.Projection("EPSG:4326")
            };
            var gmlOptions = {
                featureType: "feature",
                featureNS: "http://example.com/feature"
            };
            var gmlOptionsIn = OpenLayers.Util.extend(
                OpenLayers.Util.extend({}, gmlOptions),
                in_options
            );
            var gmlOptionsOut = OpenLayers.Util.extend(
                OpenLayers.Util.extend({}, gmlOptions),
                out_options
            );
            var kmlOptionsIn = OpenLayers.Util.extend(
                {extractStyles: true}, in_options);
            formats = {
              'in': {
                wkt: new OpenLayers.Format.WKT(in_options),
                geojson: new OpenLayers.Format.GeoJSON(in_options),
                georss: new OpenLayers.Format.GeoRSS(in_options),
                gml2: new OpenLayers.Format.GML.v2(gmlOptionsIn),
                gml3: new OpenLayers.Format.GML.v3(gmlOptionsIn),
                kml: new OpenLayers.Format.KML(kmlOptionsIn),
                atom: new OpenLayers.Format.Atom(in_options),
                gpx: new OpenLayers.Format.GPX(in_options),
                encoded_polyline: new OpenLayers.Format.EncodedPolyline(in_options)
              },
              'out': {
                wkt: new OpenLayers.Format.WKT(out_options),
                geojson: new OpenLayers.Format.GeoJSON(out_options),
                georss: new OpenLayers.Format.GeoRSS(out_options),
                gml2: new OpenLayers.Format.GML.v2(gmlOptionsOut),
                gml3: new OpenLayers.Format.GML.v3(gmlOptionsOut),
                kml: new OpenLayers.Format.KML(out_options),
                atom: new OpenLayers.Format.Atom(out_options),
                gpx: new OpenLayers.Format.GPX(out_options),
                encoded_polyline: new OpenLayers.Format.EncodedPolyline(out_options)
              }
            };
}

function activarModifyFeacture()
{
 editP.activate();
 drawP.deactivate();
 select.deactivate();
 editP.mode = OpenLayers.Control.ModifyFeature.RESHAPE;
 editP.createVertices = true;
}

Si desean el código
fuente completo, con un buen diseño, pueden visitar el siguiente link

Manejo de marcadores con OpenLayers

2013-10-21T08:57:00.000-05:00

En esta guía, veremos como podemos hacer uso del evento clic del mouse para poder agregar marcadores a nuestro mapa, los marcadores no son mas que unas pequeñas imágenes que aparecen en el mapa indicándonos que hay se encuentra algo, un ejemplo muy claro lo pueden ver en la siguiente imagen.

Para este caso se ha creado un archivo llamado OpenLayers_marcadores.js, que tendrá una función encargada de crear los marcadores.

//Variable para determinar el tamaño de los popup
 AtoSizeAnchoredMinSize = OpenLayers.Class(OpenLayers.Popup.Anchored, {
            'autoSize': true, 
            'minSize': new OpenLayers.Size(400,400)
        });

//Se encarga de agregar un marcador en la posicion dada
/**
Longitud: Longitud en el mapa
Latitud: Latitud en el mapa
MensajeHtml: Codigo html que se mostrara en el popup
*/
function agregarMarcador(longitud,latitud,mensajeHtml,closeBox,overflow)
{
 ll = new OpenLayers.LonLat(longitud,latitud);
 var popupClass = AutoSizeAnchoredMinSize;
 var popupContentHTML = mensajeHtml;

 var feature = new OpenLayers.Feature(markers, ll); 
    feature.closeBox = closeBox;
    feature.popupClass = popupClass;
    feature.data.popupContentHTML = popupContentHTML;

    feature.data.overflow = (overflow) ? "auto" : "hidden";

    var marker = feature.createMarker();

    var markerClick = function (evt) {
    if (this.popup == null) 
 {
        this.popup = this.createPopup(this.closeBox);
        mapa.addPopup(this.popup);
        this.popup.show();
    } else {
        this.popup.toggle();
    }
  currentPopup = this.popup;
  OpenLayers.Event.stop(evt);
    };
    marker.events.register("mousedown", feature, markerClick);
 markers.addMarker(marker);
}

Dicha clase tiene una función principal que se llama agregarMarcador, esta funcion recibe 5 parametros, pero de los cuales solo 3 son necesarios:

Longitud: Longitud en el mapa
Latitud: Latitud en el mapa
MensajeHtml: Codigo html que se mostrara en el popup

Aparte de lo anterior se ha modificado el archivo OpenLayes_base.js

var mapa,capa,controls,markers;
var centerWGS84, centerOSM;
var projWGS84, projSphericalMercator;
var activarMensaje=0,activarMarcadores=0;
function iniciar()
{
 //Para tener coordenadas estandar
 projWGS84 = new OpenLayers.Projection("EPSG:4326");
 projSphericalMercator = new OpenLayers.Projection("EPSG:900913");
 //Centrar el mapa en el punto dado 
 centerWGS84=new OpenLayers.LonLat(-74.061674,4.661464);
 //Transformar coordenadas anteriores
 centerOSM = transformToSphericalMercator(centerWGS84);
 //Creacion del mapa
 mapa=new OpenLayers.Map("mapa");
 //Creacion de capas
 capa=new OpenLayers.Layer.OSM("Capa OSM");
 markers= new OpenLayers.Layer.Markers( "Marcadores" );
 //Adicion de capas al mapa
 mapa.addLayer(capa);
 mapa.addLayer(markers);
 //Centro el mapa en la posicion dada
 mapa.setCenter(centerOSM, 15);
 //Adicion de controles al mapa 
 //Evento para el movimiento del mouse
 mapa.events.register("mousemove", mapa, mouseMoveHandler);
 //Control para el click del mouse en el mapa
 var click = new OpenLayers.Control.Click();
    mapa.addControl(click);
    click.activate();
 mapa.addControl(new OpenLayers.Control.LayerSwitcher());
}
//Funcion que registrar el movimiento del mouse
function mouseMoveHandler(e) 
{
    var position = this.events.getMousePosition(e);
    var lonlat = mapa.getLonLatFromPixel(position);
 //Tras obtener las coordenadas, podemos hacer lo que deseemos

 $("#coordenadas").attr('value','Evento MouseMove: '+transformMouseCoords(lonlat));

}

function transformMouseCoords(lonlat) 
{
         var newlonlat=transformToWGS84(lonlat);
   var x = Math.round(newlonlat.lon*10000)/10000;
   var y = Math.round(newlonlat.lat*10000)/10000;
   newlonlat = new OpenLayers.LonLat(x,y);
   return newlonlat;
}
function transformToWGS84( sphMercatorCoords) 
{
         // Transforma desde SphericalMercator a WGS84
         // Devuelve un OpenLayers.LonLat con el pto transformado
         var clon = sphMercatorCoords.clone(); // Si no uso un clon me transforma el punto original
         var pointWGS84= clon.transform(
                    new OpenLayers.Projection("EPSG:900913"), // to Spherical Mercator Projection;
           new OpenLayers.Projection("EPSG:4326")); // transform from WGS 1984
         return pointWGS84;
}
function transformToSphericalMercator( wgs84LonLat) 
{
         // Transforma desde SphericalMercator a WGS84
         // Devuelve un OpenLayers.LonLat con el pto transformado
         var clon = wgs84LonLat.clone(); // Si no uso un clon me transforma el punto original
         var pointSphMerc= clon.transform(
                    new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
                    new OpenLayers.Projection("EPSG:900913")); // to Spherical Mercator Projection;
         return pointSphMerc;
}
//Es un evento que se activa cuando se da clic sobre el mapa
OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, 
{                
     defaultHandlerOptions: 
  {
        'single': true,
        'double': false,
        'pixelTolerance': 0,
        'stopSingle': false,
        'stopDouble': false
     },
 initialize: function(options) 
 {
        this.handlerOptions = OpenLayers.Util.extend({}, this.defaultHandlerOptions);
        OpenLayers.Control.prototype.initialize.apply(this, arguments); 
        this.handler = new OpenLayers.Handler.Click(this,{'click': this.trigger}, this.handlerOptions);
    }, 
 trigger: function(e) 
 {
        //Convierto la posicion del mouse, a coordenadas
  var lonlat = mapa.getLonLatFromPixel(e.xy);
  //Luego de obtener las coordenadas, podemos hacer lo que deseemos, en este caso, para mantener la compatibilidad con los ejemplos anteriores, se crea variables para saber que hacer al momento de dar un click, si se muestra un mensaje o se agrega un marcador
  if(activarMensaje==1){
   alert("Evento MouseClick: "+transformMouseCoords(lonlat));
  }
  //INICIO AGREGAR MARCADORES
  if(activarMarcadores==1)
  {
   var htmlStr='<div style="height: 200px; width: 400px; border: 1px  solid black;"> Titulo</br> Contenido, puedo digitar lo que desee y lo mejor es que puede ser codigo html, asi que podemos colocar imagenes, fondos, links, etc </div>';
   //Esta funcion se encuentra en el archivo OpenLayers_marcadores
   agregarMarcador(lonlat.lon,lonlat.lat,htmlStr,true,true);
  }
  //FIN AGREGAR MARCADORES

    }
});

Dicho archivo, ya había sido usado en las guías anteriores, por ende solo se explicaran las modificaciones (si no entiendes algo, puedes probar ir a los tutoriales anteriores y ver la información necesaria).

Se creo una nueva variable llamada markers, que se una capa que contendrá los marcadores

var markers;
markers= new OpenLayers.Layer.Markers( "Marcadores" );
mapa.addLayer(markers);

Se crearon dos nuevas variables, con el fin de determinar que acción realizar al momento de dar el clic, si se muestra un mensaje, o se agrega un marcador. Dichas variables son analizadas en el controlador clic del mouse, para determinar la accion

var activarMensaje=0,activarMarcadores=0;

.
.
.
if(activarMensaje==1){
   alert("Evento MouseClick: "+transformMouseCoords(lonlat));
  }
  //INICIO AGREGAR MARCADORES
  if(activarMarcadores==1)
  {
   var htmlStr='<div style="height: 200px; width: 400px; border: 1px  solid black;"> Titulo</br> Contenido, puedo digitar lo que desee y lo mejor es que puede ser codigo html, asi que podemos colocar imagenes, fondos, links, etc </div>';
   //Esta funcion se encuentra en el archivo OpenLayers_marcadores
   agregarMarcador(lonlat.lon,lonlat.lat,htmlStr,true,true);
  }

Por ultimo esta la pagina web que llamara a los javascript, dicha pagina, se llama marcadors.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script type="text/javascript" src="js/OpenLayers_base.js"></script>
<script type="text/javascript">
 //Habilito que se creen marcadores al dar clic en el mapa
 activarMarcadores=1;
</script>
<script type="text/javascript" src="js/OpenLayers_marcadores.js"></script>
<style type="text/css">
     .smallmap {
      width: 929px;
      height: 300px;
     }
</style>
</head>
<body <body onLoad="iniciar()">
 <h3>Nuestro primer mapa con OpenLayers</h3>
 <div id="mapa" class="smallmap">

 </div>
 <h4>Coordenadas: </h4>
 <input name="coordenadas" type="text" id="coordenadas" size="50"></input>
</body>
</html>

Y eso es todo, hay tiene un script que les permite agregar fácilmente marcadores a un mapa. Si desean descargar el código fuente, lo pueden obtener en el siguiente enlace.

Y eso es todo por el momento, en las siguiente guías encontraran mas información sobre como iniciarse en OpenLayers:

Crear un mapa con OpenLayers
Manejo de eventos del mouse con OpenLayers
Manejo de marcadores con OpenLayers
Manejo de Features ( figuras ) con OpenLayers

Manejo de eventos del mouse con OpenLayers

2013-10-21T08:20:00.002-05:00

En esta guía hablaremos sobre como manejar eventos del ratón, tales mousemove y mouseClick, esto con el fin de poder capturar las coordenadas del mouse para realizar las acciones que nosotros queramos (guardarlas en una base de datos, un archivo, mostrarla en un texto, etc).

Pagina index.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script type="text/javascript" src="js/OpenLayers_base.js"></script>
<style type="text/css">
    	.smallmap {
    		width: 929px;
    		height: 300px;
   		}
</style>
</head>
<body <body onLoad="iniciar()">
	<h3>Nuestro primer mapa con OpenLayers</h3>
	<div id="mapa" class="smallmap">

	</div>
	<h4>Coordenadas: </h4>
	<input name="coordenadas" type="text" id="coordenadas" size="50"></input>
</body>
</html>

Como vera, esta ves lo que hice fue escribir todo el código javascript escrito en las guías pasadas, y colocarlo en un archivo llamado OpenLayers_base, y luego enlazarlo en la pagina. Todo esto con el fin de tener un mayor orden.

OpenLayer_base.js

var mapa,capa,controls;

var centerWGS84, centerOSM;
var projWGS84, projSphericalMercator;
function iniciar()
{
	//Para tener coordenadas estandar
	projWGS84 = new OpenLayers.Projection("EPSG:4326");
	projSphericalMercator = new OpenLayers.Projection("EPSG:900913");
	//Centrar el mapa en el punto dado	
	centerWGS84=new OpenLayers.LonLat(-74.061674,4.661464);
	//Transformar coordenadas anteriores
	centerOSM = transformToSphericalMercator(centerWGS84);
	//Creacion del mapa
	mapa=new OpenLayers.Map("mapa");
	//Creacion de capas
	capa=new OpenLayers.Layer.OSM("Capa OSM");

	//Adicion de capas al mapa
	mapa.addLayer(capa);

	//Centro el mapa en la posicion dada
	mapa.setCenter(centerOSM, 15);
	//Adicion de controles al mapa	
	//Evento para el movimiento del mouse
	mapa.events.register("mousemove", mapa, mouseMoveHandler);
	//Control para el click del mouse en el mapa
	var click = new OpenLayers.Control.Click();
    mapa.addControl(click);
    click.activate();
}
//Funcion que registrar el movimiento del mouse
function mouseMoveHandler(e) 
{
    var position = this.events.getMousePosition(e);
    var lonlat = mapa.getLonLatFromPixel(position);
	//alert(lonlat);
    $("#coordenadas").attr('value','Evento MouseMove: '+transformMouseCoords(lonlat));
}

function transformMouseCoords(lonlat) 
{
        	var newlonlat=transformToWGS84(lonlat);
			var x = Math.round(newlonlat.lon*10000)/10000;
			var y = Math.round(newlonlat.lat*10000)/10000;
			newlonlat = new OpenLayers.LonLat(x,y);
			return newlonlat;
}
function transformToWGS84( sphMercatorCoords) 
{
        	// Transforma desde SphericalMercator a WGS84
        	// Devuelve un OpenLayers.LonLat con el pto transformado
        	var clon = sphMercatorCoords.clone(); // Si no uso un clon me transforma el punto original
        	var pointWGS84= clon.transform(
                    new OpenLayers.Projection("EPSG:900913"), // to Spherical Mercator Projection;
        			new OpenLayers.Projection("EPSG:4326")); // transform from WGS 1984
        	return pointWGS84;
}
function transformToSphericalMercator( wgs84LonLat) 
{
        	// Transforma desde SphericalMercator a WGS84
        	// Devuelve un OpenLayers.LonLat con el pto transformado
        	var clon = wgs84LonLat.clone(); // Si no uso un clon me transforma el punto original
        	var pointSphMerc= clon.transform(
                    new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
                    new OpenLayers.Projection("EPSG:900913")); // to Spherical Mercator Projection;
        	return pointSphMerc;
}
//Es un evento que se activa cuando se da clic sobre el mapa
OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, 
{                
     defaultHandlerOptions: 
	 {
        'single': true,
        'double': false,
        'pixelTolerance': 0,
        'stopSingle': false,
        'stopDouble': false
     },
	initialize: function(options) 
	{
        this.handlerOptions = OpenLayers.Util.extend({}, this.defaultHandlerOptions);
        OpenLayers.Control.prototype.initialize.apply(this, arguments); 
        this.handler = new OpenLayers.Handler.Click(this,{'click': this.trigger}, this.handlerOptions);
    }, 
	trigger: function(e) 
	{
        //Convierto la posicion del mouse, a coordenadas
		var lonlat = mapa.getLonLatFromPixel(e.xy);
		alert("Evento MouseClick: "+transformMouseCoords(lonlat));
    }
});

El archivo esta dividido en las siguiente funciones:

iniciar: Se encarga de instanciar los objetos requeridos y agregar los controles al mapa
mouseMoveHandler: Función que es llamada cuando se produce el movimiento del mouse
transformMouseCoords,transformToWGS84,transformToSphericalMercator: Son funciones implementadas para poder obtener convertir las coordenadas a las estándar, debido a que la capa OSM trabaja con otro sistema de medición.
OpenLayers.Control.Click: Es el evento que se encarga de manejar el Click del mouse

Las ultimas lineas de la funcion iniciar, se encargan de agregar los eventos al mapa.

En OpenLayers.Control.Click, nos permite realizar unas configuraciones para poder administrar el evento clic del mouse dentro del mapa, las mas destacada, por ejemplo es

defaultHandlerOptions: 
	 {
        'single': true,
        'double': false
     }

Donde single, si el valor es true, se ejecutara el código dentro del parámetro trigger si se hizo un solo clic con el mouse. Si double es true se ejecutara el código dentro del parámetro trigger si se hizo doble clic con el mouse.

Al final nos queda algo como esto:

Si desean descargar el código fuente de Manejo de eventos del mouse con OpenLayers con un buen Diseño, den clic en el siguiente enlace

Y eso es todo por el momento, en las siguiente guías encontraran mas información sobre como iniciarse en OpenLayers:

Crear un mapa con OpenLayers
Manejo de eventos del mouse con OpenLayers
Manejo de marcadores con OpenLayers
Manejo de Features ( figuras ) con OpenLayers

Crear un mapa con OpenLayers

2013-10-21T08:04:00.003-05:00

Buenos días, en nuestra guía anterior explicábamos como descargar la biblioteca de OpenLayers para poder empezar a trabajar con esta herramienta (puedes ver la guía aquí ) .

Ahora procederemos a agregar un mapa a nuestra pagina, para luego poder realizar cualquier acción que deseemos (agregar,quitar marcadores, figuras, etc ).

Para poder añadir un mapa a la pagina, debemos primero crear un elemento "div" dentro de la pagina web, que sera el encargado de contener dicho mapa, ese "div" por regla debe tener el atributo id y el atributo class.

El atributo id, no permitirá identificar ese div, para luego con javascript poder pintar el mapa, y el atributo class, nos permitirá enlazarle un css para poder definir la altura y anchura. Tendríamos algo como esto

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="OpenLayers.js"></script>
<style type="text/css">
    	.smallmap {
    		width: 929px;
    		height: 300px;
   		}
</style>
</head>
<body>
        <h3>Nuestro primer mapa con OpenLayers</h3>
	<div id="mapa" class="smallmap">

	</div>
</body>
</html>

Pero si abrimos ese código, nos daremos cuenta de que realmente no hace nada, eso es debido a que nos falta implementar el javascript que se encarga de pintar el mapa. Para poder crear el mapa, debemos (en javascript ) crear un objeto del tipo OpenLayers.Map. Dicho constructor recibe un parámetro, que es el id del div que lo contendrá

var mapa=new OpenLayers.Map("mapa");

Luego se debe crear y agregar una "capa" para mostrar, esta capa lo que tendrá es la manera como se visualizara el mapa ( para conocer todos los tipos de capas pueden visitar la documentación oficial ). También debemos centrar el mapa, para que cargue en una zona que queramos, para esto debemos darle las coordenadas de longitud y latitud

capa=new OpenLayers.Layer.OSM("OSM Map");
		mapa.addLayer(capa);
		mapa.setCenter(
                new OpenLayers.LonLat(-74.061674, 4.661464).transform(
                    new OpenLayers.Projection("EPSG:4326"),
                    mapa.getProjectionObject()
                ), 12
            );

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script type="text/javascript">
//Variables a utilizar
var mapa,capa;
function iniciar()
{
//Creando el mapa
mapa=new OpenLayers.Map("mapa");
//Creando la capa
capa=new OpenLayers.Layer.OSM("OSM Map");
//Agregando la capa
mapa.addLayer(capa);
//Establenciendo donde visualizara el mapa, para esto debemos pasarle las coordenadas
//de latitud y longitud, ademas del zoom, que indica que en este caso es 12
mapa.setCenter(
new OpenLayers.LonLat(-74.061674, 4.661464).transform(
new OpenLayers.Projection("EPSG:4326"),
mapa.getProjectionObject()
), 12
);
}
</script>
<style type="text/css">
.smallmap {
width: 929px;
height: 300px;
}
</style>
</head>
<body onload="iniciar()">
<h3>Nuestro primer mapa con OpenLayers</h3>
<div id="mapa" class="smallmap">

</div>
</body>
</html>

Quedándonos lo que sigue:

Pueden descargar el código fuente de Crear un mapa con OpenLayers con un buen Diseño en el siguiente enlace

Y eso es todo por el momento, en las siguiente guías encontraran mas información sobre como iniciarse en OpenLayers:

Crear un mapa con OpenLayers
Manejo de eventos del mouse con OpenLayers
Manejo de marcadores con OpenLayers
Manejo de Features ( figuras ) con OpenLayers

OpenLayers, mapas OpenSource para nuestros Proyectos

2013-10-21T07:55:00.001-05:00

Buenos días lectores.

Hoy les traigo una herramienta open source que nos permitirá manejar mapas para nuestro proyectos, y lo mejor es que es completamente open source y esta escrito en javascript. La herramienta mencionada se llama OpenLayers.

En esta serie de guías guía les explicare como podemos:

Crear un mapa.
Agregar marcadores (puntos en el mapa).
Pintar marcadores en el mapa.
Crear zonas de coberturas (pintar áreas en el mapa).
Modificar zonas de cobertura en el mapa

Lo primero que debemos hacer apenas conocemos una nueva tecnología es irnos a la documentación oficial, la cual podemos conseguir en ingles o español (no actualizada).

Iniciando con OpenLayer:

Para poder incrustar un mapa en nuestras paginas web, debemos primero enlazar el javascript correspondiente, para eso podemos descargarlo y almacenarlo en nuestro servidor, o bien podemos enlazarlo de la pagina oficial. Para descargarlo debemos ir a esta pagina y copiar todo el contenido y guardarlo en un archivo que llamaremos OpenLayers.js ubicado en una carpeta "js, script" o en una carpeta cualquiera de nuestra pagina

Luego de esto, podemos enlazar nuestro javascript de la siguiente forma

<script type="text/javascript" src="js/OpenLayers.js"></script>

O si lo que queremos es enlazar la version almacenada en el servidor de OpenLayers podemos hacer lo siguiente:

<script src="http://www.openlayers.org/api/OpenLayers.js"></script>

Y eso es todo por el momento, en las siguiente guías encontraran mas información sobre como iniciarse en OpenLayers:

Crear un mapa con OpenLayers
Manejo de eventos del mouse con OpenLayers
Manejo de marcadores con OpenLayers
Manejo de Features ( figuras ) con OpenLayers

Error al compilar proyecto en Cordova

2013-10-08T04:31:00.000-05:00

[caption id="attachment_1192" align="aligncenter" width="300"] Error al compilar proyecto en Cordova[/caption]

Si de pronto estas compilando tu proyecto en Cordova con el comando "cordova build" y te sale el siguiente error:

Error: An error occurred while building the android project.
module.js:340
    throw err;
          ^
Error: Cannot find module 'C:UsersUserDocumentsProyectos'
    at Function.Module._resolveFilename (module.js:338:15)
    at Function.Module._load (module.js:280:25)
    at Function.Module.runMain (module.js:497:10)
    at startup (node.js:119:16)
    at node.js:901:3

Es debido a que el proyecto se encuentra dentro de alguna carpeta cuyo nombre tiene un espacio en blanco, en mi caso, el proyecto estaba en una carpeta que se llamaba "Proyectos PhoneGap" y al tener el espacio en blanco, el buscaba solo en la ruta 'C:UsersUserDocumentsProyectos'. Para solucionar este error, basta con renombrar la carpeta que tiene el espacio en blanco, o crear el proyecto en otra locación.

Uso del GPS en Android con Cordova (phonegap)

2013-10-07T09:29:00.000-05:00

[caption id="attachment_1196" align="aligncenter" width="387"] Uso del GPS en Android con Cordova[/caption]

En esta guía se pretende explicar la manera de obtener la posición actual del dispositivo Android (coordenadas latitud, longitud), haciendo uso de la API del GPS de cordova (phonegap).

Uso del GPS en Android con Cordova (phonegap) by Jorge Andres Moreno Jaimes

Aprender a desarrollar aplicación web de una manera rápida con CakePhp

2013-10-07T09:13:00.003-05:00

Buenos días, hoy les traigo un excelente framework para desarrollar aplicaciones web de una manera rápida y ágil con CakepHP. El manual tiene el siguiente contenido:

Descargar CakePhp.
Instalar CakePhp.
Configurar CakePhp
Configuraciones de seguridad:
Security.salt:
Security.cipherSeed:
Configurar Base Datos:
Características de CakePhp:
Convenios de nombres:
Modelos:
Consultas a la base de datos
Find (tipo, parámetros):
FindBy<Campo> (valor):
Query(sql):
Almacenamiento de información:
Save(data):
Eliminación de Información:
Del(id):
Controladores:
Pasar datos a la vista:
Set(nombre,valor):
Vistas:

Manual CakePhp by Jorge Andres Moreno Jaimes

Lector de Códigos QR en Android con Cordova

2013-10-03T16:46:00.005-05:00

En este manual se describen los pasos para poder implementar un lector de códigos QR en el sistema operativo Android usando la API de zxing en Cordova

Lector de Códigos QR en Android con Cordova by Jorge Andres Moreno Jaimes

Lector de Códigos QR en Android con Cordova

2013-10-03T11:17:00.000-05:00

[caption id="attachment_1198" align="aligncenter" width="384"] Lector de Codigos QR en Android con Cordova[/caption]

En este manual se describen los pasos para poder implementar un lector de códigos QR en el sistema operativo Android usando la API de zxing en Cordova

Lector de Códigos QR en Android con Cordova by Jorge Andres Moreno Jaimes

Aprender a desarrollar aplicación web de una manera rápida con CakePhp

2013-10-03T06:58:00.000-05:00

[caption id="attachment_1201" align="aligncenter" width="600"] Aprender a desarrollar aplicaciones web de una manera rapida con CakePhp[/caption]

Buenos días, hoy les traigo un excelente framework para desarrollar aplicaciones web de una manera rápida y ágil con CakepHP. El manual tiene el siguiente contenido:

Descargar CakePhp.

Instalar CakePhp.

Configurar CakePhp

Configuraciones de seguridad:

Security.salt:

Security.cipherSeed:

Configurar Base Datos:

Características de CakePhp:

Convenios de nombres:

Modelos:

Consultas a la base de datos

Find (tipo, parámetros):

FindBy<Campo> (valor):

Query(sql):

Almacenamiento de información:

Save(data):

Eliminación de Información:

Del(id):

Controladores:

Pasar datos a la vista:

Set(nombre,valor):

Vistas:

Manual CakePhp by Jorge Andres Moreno Jaimes

Uso de la cámara con android

2013-09-24T10:16:00.001-05:00

Visita nuestra nueva pagina aqui: http://jamper91.byethost7.com/

El dia de hoy les traigo una guía sobre como usar la cámara implementado la API de android, para esto trate de recurrir a la documentación oficial de Android (http://developer.android.com/guide/topics/media/camera.html) pero tuve ciertos problemas, por lo que acudí a la gran G, para buscar soluciones.

Este pequeño ejemplo lo que hace es utilizar la cámara para tomar la foto y luego nos muestra la ruta donde queda alojada en nuestro dispositivo.

Para empezar creamos una aplicacion comun y corriente y le damos el nombre que deseamos, tras crear la aplicacion simplemente añadimos un boton y un textview al layout de nuestra aplicacion para que quede de la siguiene manera

Recuerden que pueden renombrar el id del boton y del TextView como deseen en mi caso los renombre de la siguiente manera:

Ahora lo siguiene que haremos sera determinar que hacer cuando se haga clic en el boton btnCamera, para este ejemplo en especifico llamaremos a una funcion que se encargara de iniciar la camara, para poder conseguir este objetivo agregamos una linea en el xml del boton, en concreto la linea "android:onClick"

Ahora nos falta algo muy importate, que es editar los permisos, en concreto los permisos es decirle al sistema operativo que nos permita acceder a algunos recursos del sistema, como lo son la camara, el internet, los datos, los contactos, etc. Para este tutorial usaremos 2, el permiso para escribir ( para poder guardar las fotos) y del uso de la camara, si no sabes como agrega los permisos, puedes seguir estos pasos:

Escojemos el proyeto
Abrimos el Manifiesto
Buscamos la pestaña XML
Escribimos los permisos

Tras lo anterior, ahora podemos manipula el codigo que nos permitira hacer lo anteriormente prometido.

1. Primero debemos agregar unas variables GLOBALES a nuestra aplicacion

photoPath: Es la encargada de almacenar la ruta donde se encuentra nuestra foto recien capturada
REQUEST_CAMERA: Nos permira determinar para que vamos a usar nuestra camara, en este tutorial sera para tomar fotos (pero puede ser para almacenar videos)

2. Editamos el codigo de la funcion que es llamada cuando oprimimos el boton btnCamera

No soy un experto en android, y si lo que acabo de explicar no les convence, o esta erroneo, estoy abierto a sugerencias para poder mejorar

Donde, como en casos anteriores, esta funcion debe recibir un objeto del tipo View, y que luego lo utilizamos en el "switch" para determinar cual objeto llamo a esa funcion, en caso de que fuese el boton "btnCamera" se realizara todo lo que se encuentre en el "case"
state: nos permite determinar el estado actualdel medio de almacenamieno externo
Environment.MEDIA_MOUNTED.equals(state): Aqui preguntamos si el dispositivo se encuentra correctamente montado y si esta listo para escritura/lectura
captureTime: Es un valor que usamos para que el nombre de las fotos no se repita
photoPath: almacenamos la localiacion de la foto
intent: (Explicacion de intent aqui) creamos un nuevo intent donde especificamos que deseamos usar la camara en modo de captura de imagen (tambien puede ser en video)
photo: creamos un nuevo archivo con la ruta de la imagen anteriormente tomada
intent.putExtra(MediaStore.EXTRA_OUTPUT,Uri.fromFile(photo)): agregamos unos "datos, variables" al intente anteriormente creado
Por ultimo iniciamos el intent, es decir iniciamos la camara para poder tomar la foto

3. Ahora debemos verificar que no a ocurrido a ningun error y estar atentos a lo que nos pudo responder la camra

En la primera linea simplemente creamos un objeto del tipo textView para poder mostrarle al usuario donde es la ruta de la foto creada
Como esta respuesta puede provenir de diferentes fuentes, la incluimod dentro de un "switch" y verificamos que sea del tipo REQUEST_CAMERA ( es decir del tipo tomar foto -esta variable la creamos globalmente)
Si la ruta no esta vacia y si es diferente de null, la mostramos en pantalla

Eso es todo, ya esta nuestra aplicacion funcionando

Descargar: SkyDrive

Curso Diseño de aplicaciones en Android Tutos4u

2013-09-24T09:59:00.002-05:00

Visita nuestra nueva pagina aqui: http://jamper91.byethost7.com/

Android es la plataforma lider en el mercado de aplicaciones para smartphones y tablets. Esta plataforma fue creada por Android Inc, una firma comprada por Google en el año 2005.

Aqui en tusguias, te traemos este pack de tutoriales que te guiaran en el diseño y programacion de aplicaciones en la plataforma Android. Estos tutoriales contienen temas como la introducción al mundo de Android, el manejo de los distintos sensores que tiene el dispositivo móvil, entorno web, geolocalizacion, el manejo de los perifericos del smartphone o tablet como son la camara, el microfono, entre otros, temas que ayudaran al programador a volverse un experto en esta plataforma.

El pack de tutoriales pesa 1.84 GB y fue grabado con el programa camtasia 8.

Agradecimientos a tutos4u por los tutoriales y a ideasforpc.blogspot.com

El contenido del pack de tutoriales es:

Contenido:

0.1.- Instalar Java JDK.

0.2.- Descargar Eclipse.

0.3.- Instalar Android ADT en Eclipse.

0.4.- Descargar Android SDK.

0.5.- Crear y correr emulador Android.

1.- Introducción. Crear proyecto Android.

2.- Interfaz de Usuario TextView, Button.

3.- Declarar TextView y Button en Java.

4.- onclickListener y Variables Java.

5.- Background (Fondo de Pantalla).

6.- ImageView (Imagen).

7.- ScrollView y HorizontalScrollView.

8.- Mas de ScrollView, HorizontalScrollView.

9.- Implementar onclickListener en la Clase.

10.- Switch y Case.

11.- AndroidManifest.

12.- Permisos (Wallpaper).

13.- Toast (Mensaje en Pantalla).

14.- EditText.

15.- Convertir Variable String a Int.

16.- If y else (Condicionales).

17.- Crear nuevo XML.

18.- Intents.

19.- Crear nueva Clase (Activity).

20.- Crear nueva Activity en el Manifest.

21.- Bundles.

22.- Random (Aleatorio).

23.- Layout Weight y Gravity.

24.- MediaPlayer (Audio, Sonido).

25.- SoundPool (Audio, Sonido).

26.- Toggle Button (Botón).

27.- OnCheckedChangeListener.

28.- RadioGroup y Radio Buttons (B. Radio).

29.- RadioGroup OnCheckedChangeListener.

30.- ListView (Listas).

31.- ArrayList y ArrayAdapter.

32.- Spinner.

33.- OnItemSelectListener.

34.- Crear Métodos.

35.- WebView (Navegador).

36.- WebView Métodos.

37.- WebView Client.

38.- Mas de WebView.

39.- SQLite (Base de Datos).

40.- SQLiteOpenHelper Métodos.

41.- Crear Base de Datos.

42.- Abrir SQLite.

43.- Cerrar SQLite.44.- Insertar datos en SQLite.

45.- Crear Dialog.

46.- Mostrar datos SQLite.

47.- Más de SQLite.

48.- Buscar Datos en SQLite.

49.- Editar Datos en SQLite.

50.- Eliminar Datos en SQLite.

51.- Threads.

52.- GridView.

53.- BaseAdapter para Imagenes.

54.- Métodos del BaseAdapter para Imagenes.

55.- OnItemClickListener.

56.- ViewFlipper.

57.- Métodos del ViewFlipper.

58.- OnLongClickListener.

59.- CountDownTimer (Cuenta Regresiva).

60.- TabHost.

61.- Declarar TabHost.

62.- Insertar Iconos en TabHost.

63.- Insertar Fondo en TabHost.

64.- Reloj Análogo.

65.- Personalizar Botones.

66.- Tiempo (Método Time).

67.- Actualizar Pantalla (Runnable).

68.- Notification Manager (Notificación).

69.- Notification (Notificación).

70.- Notificación Final.

71.- OnKeyListener.

72.- SimpleCursorAdapter -SQLite en ListView.

73.- Orientación de Pantalla (Layout-land).

74.- RelativeLayout.

75.- SlidingDrawer.

76.- FrameLayout.

77.- Métodos del SlidingDrawer.

78.- ViewPager - Preparando ambiente -.

79.- Crar XML para ViewPager.

80.- PagerAdapter.

81.- Métodos del ViewPager.

82.- LayoutInflater.

83.- Botones en ViewPager.

84.- Menú para Android.

85.- MenuInflater.

86.- OnOptionsItemSelected.

87.- Actividad con Temas(Theme).

88.- Preferences (Preferencias).

89.- PreferenceScreen (Pantalla Pref).

90.- Terminando Preferences (Preferencias).

91.- CheckBoxPreference (SharedPreferences).

92.- EditTextPreference y ListPreference.

93.- SeekBar (Barra de Ajuste).

94.- AudioManager (Control de Audio).

95.- Más de SeekBar (Barra de Ajuste).

96.- Google Maps (Preparando Ambiente).

97.- Map Key (Generar Clave Unica Mapas).

98.- MapView (Mostrar Mapa).

99.- Clase Overlay para Mapas.

100.- Método MotionEvent (Eventos).

101.- AlertDialog (Cuadro de Alerta).

102.- Controlador y Brujula.

103.- GeoPoint y GeoCoder.

104.- Localizar una dirección en el Mapa.

105.- Vista Satelite y de Calle.

106.- Dibujar en Mapa con ItemizedOverlay.

107.- Crear un punto en el Mapa.

108.- Colocar y Mostrar un punto en Mapa.

109.- GPS Permisos de Localización.

110.- Localitation Manager y Criterios.

111.- LocalitatonListener.

112.- Exportar y firmar proyecto Android.

113.- Obtener Key específico para el Mapa.

114.- Aumentar Velocidad al Emulador.

115.- Conectar Android y MySql con Php.

116.- Crear Nuevo Emulador Android.

117.- ArrayList -NameValuePair-.

118.- Base de Datos MySql para Android.

119.- PHP para conectar Android y MySql.

120.- HttpClient.

121.- HttpPost y HttpResponse.

122.- BufferedReader -Leer Datos de MySql-.

123.- Ejecutar HttpClient y HttpPost.

124.- Sensor Proximity (Proximidad).

125.- SensorEventListener.

126.- Gráficos clase View.

127.- OnDraw dibujar Rectangulos (Canvas).

128.- Dibujar Texto (Canvas).

129.- Agrear Fuentes a Assets.

130.- Dibujar Bitmap (Canvas).

131.- Animación de Bitmap.

132.- SurfaceView.

133.- onPause y on Resume para SurfaceView.

134.- Runnable para SurfaceView.

135.- Bitmap Canvas SurfaceView.

136.- MotionEvent.

137.- Mejorando Animación Bitmap.

138.- TimePicker.

139.- Métodos del TimePicker.

140.- TimePickerDialog.

141.- OnTimeSetListener.

142.- DatePicker.

143.- Métodos del DatePicker.

144.- DatePickerDialog.

145.- Clase Calendar (Calendario).

146.- OnDateSetListener.

147.- AutoCompleteTextView.

148.- Terminando el AutoCompleteTextView.

149.- TextWatcher.

150.- ExpandableListView.

151.- String Array Multiple.

152.- BaseExpandableListAdapter.

153.- Personalizar el ExpandableListView.

154.- View Inflate.

155.- OnChildClickListener.

156.- XML para Utilizar la Camara.

157.- ActivityForResult.

158.- OnActivityResult (Obtener Resultado).

159.- BitmapDrawable (Bitmap Background).

160.- Manejo del Flash de la Camara.

161.- Clases Camera y Parameters.

162.- Permisos para la Camara.

163.- PackageManager (Verificar Hardware)

Los links de descarga esta en un documento de google docs

https://skydrive.live.com/?cid=c7b01aa54a82ccd0&id=C7B01AA54A82CCD0%21154

Espero que les resulte de utilidad este post

Ajax con Jquery

2013-09-24T09:52:00.002-05:00

Hola, buenas tardes. El dia de hoy les traigo una guia para saber como manejar ajax con JQuery.

Pero antes de eso, muchos se preguntara, que es ajax? para que me sirve?.

Pues bueno, vamos a ver para que nos sirve:

Digamos que estas trabajando en un proyecto web cualquiera, y estas ante la siguiente situacion: debes mostrar una informacion nueva en la pagina basandote en una accion que hizo el usuario, pero sin tener que recargar la pagina. Un ejemplo de esto es que si el usuario da clic en algun elemento de la pagina web (puede ser un link, un boton , una imagen, etc) debes hacer una consulta a una base de datos y con esa consulta mostrar unos resultados.

Para entenderlo vamos a realizar el siguiente ejercicio: En una pagina web tienes una lista de ciudades, y necesitas que el usuario al dar clic en alguna ciudad, muestre las personas que viven en dicha ciudad.

Para eso, tienes la siguiente estructura sql:

CREATE TABLE IF NOT EXISTS `ciudad` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`Nombre` varchar(50) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ;

INSERT INTO `ciudad` (`id`, `Nombre`) VALUES
(1, 'Amazonas'),
(2, 'Cucuta'),
(3, 'Bucaramanga'),
(4, 'Bogota');

CREATE TABLE IF NOT EXISTS `persona` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`id_ciudad` int(11) NOT NULL,
`nombre` varchar(50) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=9 ;

INSERT INTO `persona` (`id`, `id_ciudad`, `nombre`) VALUES
(1, 1, 'Juan'),
(2, 1, 'Pedor'),
(3, 2, 'Eliana'),
(4, 2, 'Ericka'),
(5, 3, 'Ordoñez'),
(6, 4, 'Esteban'),
(7, 4, 'Peter'),
(8, 4, 'Oscar');

La pagina web que usaras sera la siguiente:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ejemplo Ajax</title>
<!-- Le decimos donde se encuentra el jquery -->
<script src="js/jquery-1.6.3.min.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function()
{
//Esta funcion se activara cuando se de clic en algun enlace cuyo id sea igual a ciudad
$("[id=ciudad]").click(function(e){
//Evito que el link funcione, es decir que no me llebe a algun lado
e.preventDefault();
//Determino el id_ciudad del link que dio clic
var id_ciudad=$(this).attr("id_ciudad");

$.ajax({
type:"POST",
url:"listar.php",//pagina a cual enviar
data: {ciudad:id_ciudad},//datos a enviar
success: function(data)
{
$("#resultado").html(data);//mostrar el resultado

}
});
});

});
</script>
</head>

<body>
<p align="center">Ejemplo Ajax con JQuery.</p>
<p>En este ejemplo, el usuario al hacer clic en alguna de las ciudades le mostrara los nombres de personas que vivan en esa ciudad</p>
<table width="100%" border="1">
<tr>
<td width="20%">Ciudad</td>
<td>Personas</td>
</tr>
<tr>
<td width="20%"><a href="#" id="ciudad" id_ciudad="1">Amazonas</a></td>
<td rowspan="4" id="resultado">&nbsp;</td>
</tr>
<tr>
<td width="20%"><a href="#" id="ciudad" id_ciudad="2">Cucuta</a></td>
</tr>
<tr>
<td width="20%"><a href="#" id="ciudad" id_ciudad="3">Bucaramanga</a></td>
</tr>
<tr>
<td width="20%"><a href="#" id="ciudad" id_ciudad="4">Bogota</a></td>
</tr>
</table>
</body>
</html>

La parte mas importante es la siguiete:

$.ajax({
type:"POST",
url:"listar.php",//pagina a cual enviar
data: {ciudad:id_ciudad},//datos a enviar
success: function(data)
{
$("#resultado").html(data);//mostrar el resultado

}
});

Esa, es la que nos permite realizar la llamada a otra pagina, sin la necesidad de recargar toda.

type: Es la manera como sera mandada la informacion a la otra pagina, puede ser GET o POST.
url: Es la url a la cual enviaremos la informacion.
data{nombre:valor}: Es donde colocaremos toda aquella informacion que deseemos enviar,no es unicamente una sola variable, puedes enviar varias, separas por coma. data{id_ciudad:3, pais:Colombia,cedula:103342}+
success: Esta funcion se ejecuta cuando la pagina (listar.php) termine de hacer todo lo que debe, y todo lo que esa pagina nos devuelva, se almacena en la variable data, luego podemos hacer lo que deseemos con esa informacion, en este caso se "pinto" en la columna que cuyo id es "resultado".

El resto del codigo lo pueden conseguir aqui

Aprender C en un 2x3

2013-09-24T09:44:00.000-05:00

Buenas noche, el día de hoy les traigo otro manual, en este caso se trata del lenguaje C. Es un manual aun inconcluso, pero con varias cosas que les puede aclarar unas dudas, se explica el uso de variables, y como se leen estas en el lenguaje C.

Aprender php en un 2x3

2013-09-24T09:24:00.003-05:00

Visita nuestra nueva pagina aqui: http://jamper91.byethost7.com/

En este articulo les enlazare un manual que realice ya hace algún tiempo sobre el lenguaje de programación web php. En este encontraran la explicación de conceptos básicos como los son: funciones, variables, ciclos, etc. Ademas de las herramientas necesarias para poder realizar pruebas y unos ejemplos muy bien explicados sobre como utilizar php y una base de datos (en este caso mysql) para poder insertar, consultar y borrar datos de una base de datos.

Sin mas preámbulos les dejo el documento para que lo puedan leer