Mostrando entradas con la etiqueta aprender. Mostrar todas las entradas
Mostrando entradas con la etiqueta aprender. Mostrar todas las entradas

sábado, 30 de diciembre de 2017

Como hacer una linterna en Android con Xamarin


(No olvides suscribirte)

Linterna en android con Xamarin

  Una aplicación imprescindible, que en la mayoría de los casos no viene incluida en nuestros teléfonos, si tienes alguna duda puedes ver el tutorial de arriba, a continuación el código fuente 



using Android.App;
using Android.Widget;
using Android.OS;
using Android.Hardware;
using static Android.Hardware.Camera;
using Java.Lang;

namespace TutorialLinterna
{
    [Activity(Label = "TutorialLinterna", MainLauncher = true)]
    public class MainActivity : Activity
    {
        protected override void OnCreate(Bundle savedInstanceState)
        {
            base.OnCreate(savedInstanceState);

            // Set our view from the "main" layout resource
            SetContentView(Resource.Layout.Main);
            bool tieneFlash = ApplicationContext.PackageManager.HasSystemFeature(Android.Content.PM.PackageManager.FeatureCameraFlash);
            ToggleButton bswitch = FindViewById(Resource.Id.bswitch);
            TextView textoAviso = FindViewById(Resource.Id.TextoAviso);
            if (!tieneFlash)
            {
                AlertDialog alerta = new AlertDialog.Builder(this).Create();
                alerta.SetTitle("No tienes flash");
                alerta.SetMessage("Con que pensabas alumbrar si no tienes flash");
                alerta.SetButton("OK", (o, s) => { return; });
                alerta.Show();
            }
            Camera camara;
            try
            {
                camara = Camera.Open();
            }catch(RuntimeException ex)
            {
                camara = null;
            }

            bswitch.Click += (o, s) =>
            {
                if(camara != null)
                {
                    if (bswitch.Checked)
                    {
                        Parameters cparams = camara.GetParameters();
                        cparams.FlashMode = Parameters.FlashModeTorch;
                        camara.SetParameters(cparams);
                        camara.StartPreview();
                        textoAviso.Text = "Linterna encendida";
                    } else
                    {
                        Parameters cparams = camara.GetParameters();
                        cparams.FlashMode = Parameters.FlashModeOff;
                        camara.SetParameters(cparams);
                        camara.StartPreview();
                        textoAviso.Text = "Linterna apagada";
                    }
                } else
                {
                    AlertDialog alerta = new AlertDialog.Builder(this).Create();
                    alerta.SetTitle("Error!");
                    alerta.SetMessage("Hubo un error en la camara");
                    alerta.SetButton("OK", (o2, s2) => { return; });
                    alerta.Show();
                }
            };
            
        }
    }
}

Enlaces Sociales

domingo, 19 de noviembre de 2017

Como usar la Web Workers API

Para ver en youtube has clic aquí
(No olvides suscribirte)

Los Web Workers

   Normalmente javascript se ejecuta en un solo hilo, esto significa que todos los procesos corren uno detrás de otro, un proceso debe esperar a que termine el anterior para poder ejecutarse, esto significa que si tenemos una aplicación web compleja, y no tomamos en cuenta la complejidad de cada proceso individual, esta podría llegar a colgarse, esto podría ser el resultado de un solo proceso que este tomando mas tiempo del que teníamos previsto. Un web worker nos permite crear hilos independientes de ejecución, como los Threads en java, hilos que no se interrumpen entre sí, lo cual nos permite crear aplicaciones web mucho mas complejas y seguras.
  Mira el video tutorial para aprender como implementar esta API

Descargas



domingo, 1 de enero de 2017

Eventos y componentes Swing Curso de Java clase 11


Para ver en youtube clic aquí
(No olvides suscribirte)

Para una mejor comprensión se recomienda ver el siguiente material

Ejemplo KeyAdapter y KeyListener

Como prometí en el video a continuación podrás descargar un ejemplo en el cual respondemos a eventos usando tanto la interfaz como la clase, en clases futuras se tratará esto en profundidad, por ahora puedes observar y comparar que se hacer exactamante igual que con los otros ejemplos:

Código fuente de la clase

  En el enlace a continuación podrás descargar lo hecho en el vídeo:

sábado, 26 de noviembre de 2016

Como hacer un juego de Pong con Javascript y Canvas


Para ver en Youtube clic aquí
(No olvides suscribirte)


Uno de los primeros juegos comerciales

   Este juego fue creado y lanzado por Nolan Bushnell el 29 de Noviembre de 1972, para una de las primeras generaciones de videoconsolas, las famosas Atari y está basado en el tenis de mesa. Este clásico a su vez también esta rodeado de controversia, ya que en sus inicios fue objeto de una demanda por parte Magnavox Odyssey ya que estos poseían un juego similar.

Descargas

Plantilla HTML: Base inicial del código visto en el tutorial

sábado, 12 de noviembre de 2016

Juego del dinosaurio de Chrome en Javascript


Para ver en youtube clic aquí
(No olvides suscribirte)


Juego del T-rex

   El famoso dinosaurio de google, odiado por muchos, ya que su presencia se traduce automáticamente en la perdida de una de las cosas que mas anleamos en la actualidad: El internet, lo que algunos no conocen de este infame personaje es que puede cobrar vida con tan solo presionar la tecla de espacio, hecho esto tendremos que esquivar cactus y pterodactylus con forme la velocidad aumenta con el tiempo y a su vez nuestro puntaje, parece algo muy simple, pero contrario a todo pronostico se ha convertido en adicción de muchos.

  En el video de arriba aprenderás a programar tu propia versión del juego en Javascript, y acontinuación aprenderás a agregar algunos elementos que se omitieron en el video para no hacerlo muy largo

Nuestra versión hecha en Javascript

La versión original de Google Chrome

Implementando las nubes

  Si ya completaste el tutorial, no te será muy dificil implementar las nubes, lo haremos de forma similar a lo que hicimos con los cactus, pero como no necesitamos iterar a través de ellas, no llevaremos la cuenta de los elementos siguientes, solo las dibujaremos, debemos recordar que para darle un efecto de profundidad estas deben moverse a una menor velocidad, esto se conoce como parallax y en la imagen a continuación podemos ver un ejemplo


  Vamos a implementar las nubes de la forma más sencilla posible, por lo que no le daremos distancia ni tamaño aleatorio, si no fijo, en nuestro mundo agregamos las siguientes lineas al constructor:

                this.imgNube = document.createElement("img");
this.imgNube.src = "imagenes/nube.png";
this.nx = 350;
this.ny = 50;
this.nd = 250;
Acabamos de agregar la imagen con la cual vamos a dibujar las nubes, y luego procedemos a darle: posición "x", "y" y distancia, que como dije arriba serán fijos, pero no te desanimes por esto, el resultado de esta forma se ve bien.
  Luego en nuestro método "mover" haremos lo siguiente:
                
                this.nx-=2;
  
  Esto logrará que nuestras nubes se muevan mas lentamente que el resto de nuestro mundo, creando el efecto de profundidad

Descargar  imágenes y código fuente

Nota: al hacer clic en el enlace se abrirá una nueva ventana, deberás esperar a que aparezca el botón con el texto "Saltar publicidad" debes hacer clic en él y debería llevarte al archivo deseado, si no es así avísame inmediatamente en un comentario

Pack de imágenes y sonido  Este archivo es un winrar con todas las imagenes utilizadas en el tutorial

Plantilla HTML  Documento html con sus canvas divs botones e imagenes ya listo para que solo tengas que escribir Javascript

Código fuente del video  Este archivo representa lo hecho en el video tutorial, osea el juego sin las nubes ni los pterodactylus (Solo archivo javascript para el resto la plantilla HTML)

Código fuente completo  Todo lo hecho tanto en esta entrada como en el video (Solo archivo javascript para el resto la plantilla HTML)

Sigueme en mis redes sociales y suscríbete a mi canal de Youtube


miércoles, 14 de septiembre de 2016

La primera programadora y el primer programa, La historia de Ada Lovelace


Para ver en youtube clic aquí
(No olvides suscribirte)


¿Quien fue la primera persona que programó?

  Parece una pregunta difícil de responder, ya que para poder programar hacer falta un computador, esto hace que la pregunta sea comparable al famoso: ¿Quien fue primero el huevo o la gallina? Los biólogos evolucionistas han respondido esta pregunta, y por si no lo sabes, primero fue el huevo. Te invito a ver el video de arriba para que descubras la historia de la primera persona que programó y así responder a la pregunta: ¿Quien fue primero la computadora o el programador? 

Dame like en Facebook:


Sígueme en Twitter


Mi perfil de codepen

sábado, 3 de septiembre de 2016

Como hacer un Juego de Snake en Javascript


Para ver en youtube clic aquí
(No olvides suscribirte)


Juego de Snake

 Este juego fue lanzado a mediados de lo años 70, a diferencia de lo que muchos creen no fue desarrollado por la Nokia, pero gracias a esta última adquirió una popularidad masiva debido a que venia pre-instalado en los teléfonos de esta marca.
Fuente Wikipedia


Código fuente

Nota: Los enlaces están patrocinados por adfly, luego de hacer clic, debes esperar unos segundos y te aparecerá un boton con el texto "Saltar publicidad", al hacer clic en él te debe llevar directamente al archivo, si no lo hace comunicate conmigo a través de un comentario.



Ver en Codepen


domingo, 28 de agosto de 2016

Que lenguaje de programación Aprender primero | Mi recomendación


Para ver en youtube clic aquí
(No olvides suscribirte)

Mi recomendación

  En el video que acabas de ver yo te recomiendo considerar a Java y a C# como una buena opción para que sean tus primeros lenguajes de programación a aprender, ya que cumplen con los criterios descritos en el video:
  • Son orientados a objetos
  • Tienen una sintaxis común a varios otros lenguajes
  • No son ni muy fáciles ni muy difíciles
  • Son estrictamente orientados a objetos

Pseudocódigo

   Esta es una recomendación aparte, sea cual sea el lenguaje que decidas aprender de primero, combina ese aprendizaje con pseudocódigo

Links del Video

  Nota: Algunos enlaces están patrocinados por Adfly, luego de hacer clic, debes esperar unos segundos para luego hacer clic en el botón que dice "Saltar publicidad" luego de esto serás llevado directamente a la página solicitada, si no es así comunícate conmigo inmediatamente a través de un comentario


Entornos de programación




Curso de Java

  Yo tengo publicado un curso de Java en mi canal de youtube, a continuación de dejo el enlace a la lista de reproducción:

sábado, 20 de agosto de 2016

Efecto foto doblada CSS3


Para ver en youtube clic aquí
Para ir a mi canal de Youtube clic aquí (No olvides suscribirte)

Compatibilidad de la propiedad filter

   La propiedad filter no está implementada completamente en los navegadores, por lo que se deben utilizar prefijos para que sea compatible con todos los navegadores
  • -webkit-filter para Chrome Safari y Opera
  • filter (Forma standard) Internet explorer y Firefox

Código fuente y archivos

  Si quieres visualizar el código fuente, puedes visualizarlo o descargarlo.
Instrucciones: Luego de hacer clic espera unos segundos y luego haz clic en el botón que dice "Saltar publicidad" si esto te presenta algún problema comunícate conmigo inmediatamente a través de un comentario 



Para ver el código en mi perfil de codepen


Sitio web que inspiró el tutorial:

domingo, 14 de agosto de 2016

Validar formularios con HTML5 CSS3 y JavaScript


Para ver en youtube clic aquí
Para ir a mi canal de youtube clic aquí (No olvides suscribirte)
Para ir al canal de  Developero clic aquí


Descargar plantilla HTML

Puedes empezar el tutorial con el mismo html que yo utilicé aunque da igual si utilizas un formulario creado por tí
http://adf.ly/1dAUFG  (Lee la aclaratoria sobre los enlaces al final de la entrada)

 Si solo quieres las imágenes que yo utilicé las puedes descargar en el siguiente enlace:
http://adf.ly/1dAUJB (Lee la aclaratoria sobre los enlaces al final de la entrada)

La importancia de la validación

    La validación no es más que la verificación de los datos antes de que estos puedan ser procesados por nuestro servidor. 
  Existe un tipo de ataque conocido como Inyección SQL que consiste en enviar código malicioso a través de los formularios, más información sobre este tipo de ataque puedes ver el siguiente enlace:
http://adf.ly/1dAP3c  (Leer aclaratoria sobre los enlaces abajo)

  La verificación más importante que debemos hacer consiste en evitar que un atacante pueda ingresar Javascript o SQL a través de nuestros formularios, también en evitar que se envíen espacios en blanco para que nuestra base de datos no se llene de datos basura

La diferencia entre el servidor y el cliente

   En el cliente, la validación ocurre en el navegador mismo, por lo tanto se lleva a cabo usando herramientas disponibles en el navegador, como por ejemplo HTML5 CSS3 y JavaScript.

En el servidor, la validación ocurre una vez que la información ha sido enviada a este a través de un formulario, esta se lleva a cabo con tecnologías disponibles en el servidor como PHP JSP Node.JS ASP etc

Como escribir patrones para el atributo "pattern"

 Las llaves [ ]

 Indican que caracteres debemos colocar, a continuación unos ejemplos :
  • [abc] Solo se puede escribir "a","b" o "c" puede ser por ejemplo: "ccc", "bbb", "aaa" o cualquier combinación que solo tenga una de las tres letras
  • [^abc] Al colocar el "acento circunflejo" (Es el nombre de ese signo) estamos pidiendo que se permita cualquier carácter excepto "a", "b" o "c", esto significa que se van a admitir, números, caracteres especiales y letras, siempre y cuando estas últimas no sean una de esas tres
  • [a-z], [0-9] o [A-Z] Con el guión podemos especificar un rango de caracteres, en el primer caso cualquier letra que vaya de la "a" hasta la "z" en minúscula, estos se pueden combinar sin necesidad de espacios de la siguiente forma: [a-zA-Z0-9]
  • [\s] o [\n] De igual forma que hicimos en el primer ejemplo podemos especificar estos caracteres para pedir que se solicite un espacio en blanco o una nueva linea respectivamente
  • \ El "slash invertido" lo usamos para poder identificar caracteres especiales por ejmplo si queremos solicitar que se coloquen guiones [\-] si se colocara el guión solamente pudiera causar conflicto ya que como vimos arriba este se usa para denotar rangos
  • \d Cualquier número, en este caso no es necesario colocar las llaves ([])
  • \D Cualquier letra o carácter especial, la igual que arriba no es necesario colocar as llaves

Los corchetes { }

  Indican la cantidad de caracteres que debemos colocar:
  • {7} Aquí exigimos 7 caracteres obligatoriamente, ni mas ni menos
  • {2,9} Siempre tiene que haber como mínimo 2 y no más de 9
En resumen, con la coma (,) creamos rangos para cantidad y con el guión (-) creamos rangos para el tipo de carácter

Ejemplos de patrones

Código postal Venezolano : Deben ser 4 números entre 0 y 9
[0-9]{4}

Código postal Mexicano : Contiene 5 dígitos 4 números agrupados de dos en dos y separados por un guión
[0-9]{2}[\-]{1}[0-9]{2} o también    \d{2}[\-]\d{2}

Número de teléfono formato USA internacional : debe ser algo así +99(99)9999-9999
[\+]\d{2}[\(]{1}\d{2}[\)]\d{4}[\-]{1}\d{4}

También cuando queramos un solo carácter no hace falta que especifiquemos el {1} por lo que lo de arriba puede quedar de forma más corta de la siguiente manera:
 [\+]\d{2}[\(]\d{2}[\)]\d{4}[\-]\d{4}

Fecha formato dd/mm/aa: 
\d{2}[/]\d{2}[/]\d{2}

Más información sobre los patrones

  A continuación comparto contigo una enlace a un sitio web que contiene una lista grande de patrones ya creados que puedes usar, adicionalmente te permite crear tus propios patrones de forma muy sencilla, el único problema es que este sitio está en inglés:
http://adf.ly/1dASXo  (Lee la aclaratoria sobre los enlaces al final de la entrada)

Códigos fuente

 En el enlace a continuación puedes descargar el formulario ya terminado, para que leas y compares el código fuente que yo escribí:
http://adf.ly/1dAUNf  (Lee la aclaratoria sobre los enlaces al final de la entrada)

Aclaratoria sobre los enlaces

  Los enlaces en este blog tienen un pequeño anuncio publicitario patrocinado por Adfly, luego de hacer clic esperas unos segundos y aparecerá un botón con el texto "Saltar publicidad" debes hacer clic ahí para llegar a la página de destino. Este patrocinio me permite producir más material como este, si te parece que los anuncios son incómodos o no llevan la página de destino escríbeme inmediatamente, puedes hacer un comentario aquí o en mi canal de Youtube



domingo, 7 de agosto de 2016

¿Cual es la diferencia entre PHP y Javascript?


Para ver en youtube clic aquí
Para mas videos como este clic aquí (Recuerda suscribirte)


   En el video que acabas de ver se explican la diferencia entre los que podemos considerar los lenguages de programación más importantes en el desarrollo web. Acontinuación podrás descargar los códigos fuente de los ejemplos y podrás descargar los diferentes servidores web disponibles.

Aclaratora sobre los enlaces: Todos los enlaces que aparezcan a partir de este punto, tienen un pequeño anuncio publicitario, patrocinado por adfly, luego de hacer clic, puedes undir en donde dice "Saltar publicidad" para ir a la página de destino. Estos anuncios me permiten poder hacer más material como este, pero si te resultan molestos por favor escríbeme para buscar una mejor forma de trabajar

Servidores Web y sus diferencias

  Todos los programas que te voy a recomendar a continuación, son 100% gratis, ya que son software libre

  1. WampServer: El que yo uso, este servidor contiene: El interprete PHP, el servidor Web propiamente dicho y un servidor de bases de datos MYSQL. Todo ya configurado y enlazado para que puedas hacer scripts PHP que se comuniquen con tu base de datos. Adicional-mente viene con utilidades web como phpMyAdmin que permite administrar tus bases de datos desde el navegador web, en el ejemplo de PHP uso esta utilidad para verificar la base de datos. Para descargar wamp clic aquí
  2. AppServer: Nunca lo he usado, pero tienen las mismas características de Wamp. Para descargar AppServ has clic aquí
  3. XamppServer: Este es como Wamp pero con esteroides, tiene todo lo que tiene Wamp pero muchas otras cosas más, como por ejemplo un servidor de correo, una entidad emisora de certificados SSL para cifrar las páginas web que creemos, servidor FTP, interprete PERL, y un interprete JSP. Para descargar XAMPP has clic aquí
  4. MAMP: Este es para los que tienen Mac, es lo mismo que Wamp pero para Mac. Para descargar MAMP clic aquí
  5. EasyPHP: Tampoco nunca lo he usado, es similar a WAMP pero con algunos agregados como lo son Nginx, phyton, ruby etc. Para descargar EasyPHP haz clic  aquí
  6. NMP-Server: Es un servidor portátil, lo que significa que no tienes que instalar nada, solo ejecutarlo, contiene: PHP, Nginx y MYSQL. Clic aquí para descargar

Códigos fuente para descargar

 Recuerda leer la aclaratoria sobre los enlaces al inicio de la entrada.




   Recuerda comentar en el video cualquier cosa que creas que no haya sido cubierta por el video, igualmente comenta las cosas que creas que se puedan hacer con uno o con otro.