Slider HTML RGB para Arduino vía Serial (3 / 5 paso)

Paso 3: Involt HTML rangesliders

Ahora es el momento para la parte HTML que es tan simple como el paso anterior. Involt traduce las clases CSS para cada elemento de la interfaz de usuario para comunicarse con el hardware. Es necesario definir qué elemento de la interfaz de usuario se comunica con que pin (o que la variable a enviar) y parámetros básicos como valor o su gama. Para deslizador RGB necesitamos añadir tres rangesliders en index.html que clases CSS tendrá el siguiente aspecto:

 <p><div class="ard rangeslider P9"></div></p><p><div class="ard rangeslider P10"></div></p><p><div class="ard rangeslider P11"></div></p> 

El P9, P10, P11 números representan el pin pwm de destino. La rangeslider tiene por defecto Inicio valor 0 y rango 0-255 para no tener que incluir parámetros adicionales en este ejemplo. Para definir propiedades personalizadas sólo añadirlos como otra clase CSS.

 <p><div class="ard rangeslider P9 value-50 range-0-100"></div></p> 

Para entender cómo Involt funciona Revise la introducción página.

Ahora abre la aplicación, selecciona tu puerto de arduino y compruebe los resultados. Deberías ver algo igual a los cuadros adjuntos. Para uso básico de esto es el final de este tutorial. Siguiente paso es agregar JQuery basado en pantalla a color que no está obligado a trabajar.

Artículos Relacionados

RGB LCD Shield para Arduino 65K color KIT V2 Asamblea guía

RGB LCD Shield para Arduino 65K color KIT V2 Asamblea guía

protector de la pantalla RGB para Arduino 65K color KIT incluye todos los componentes para armar una lista para usar protector de pantalla LCD para Arduino y placas compatibles como Freeduino.(visita http://store.nkcelectronics.com/rgb-lcd-shield-for
ArduDroid: Un Simple controlador de Android basado en el modo Bluetooth 2 para Arduino RGB led tira

ArduDroid: Un Simple controlador de Android basado en el modo Bluetooth 2 para Arduino RGB led tira

INTRODUCCIÓNCONSEGUIR en el app de google PLAY "ardudroid"ARDUDROID (antes Andruino) es una aplicación Android sencilla para ayudarle a controlar los pines de tu Arduino Uno (o clon) de tu teléfono Android sin cables. Es una aplicación Android y
Arduino/Android BLUETOOTH Serial Monitor APP para arduino usando el HC-06 y ANDROID

Arduino/Android BLUETOOTH Serial Monitor APP para arduino usando el HC-06 y ANDROID

¡ Hola mundo! Hoy he hecho una aplicación para Android que simplemente Lee valores o texto que se imprimen en el arduino serial usando el módulo bluetooth HC-06/05 o cualquier otros módulos. No necesitas configurar nada en el código de arduino. Simpl
SensoDuino: Convertir su teléfono Android en un concentrador de sensores inalámbricos para Arduino

SensoDuino: Convertir su teléfono Android en un concentrador de sensores inalámbricos para Arduino

Actualizaciones23 de noviembre de 2013: SensoDuino 0.160 obtiene una cara izquierda.19 de noviembre. 2031: opinión: la increíble sinergia entre Arduino y Android.19 de noviembre de 2013: SensoDuino 0.159 está hacia fuera. Fecha teléfono Android (y, m
Usando un LED RGB para detectar colores

Usando un LED RGB para detectar colores

te voy a mostrar cómo se puede utilizar un LED RGB y una fotocélula Cds como un sensor de color para un microcontrolador. Ilustrará el método para recuperar un color usando Arduino, y le mostrará un cómo usted puede verificar el color se analizan con
Touche para Arduino: avanzado sensor de tacto.

Touche para Arduino: avanzado sensor de tacto.

Actualización: nueva interfaz - mira el último paso.Créditos: Arduino detección realizada por DZL, procesamiento de bosquejo y Instructable realizado por Hobye Mads.Laboratorio de investigación de Disney diseñó una manera novedosa de detección táctil
ESP8266 Wifi adiciónales para Arduino fácil

ESP8266 Wifi adiciónales para Arduino fácil

ActualizaciónEl proceso descrito aquí ya no se recomienda. Este instructivo ha sido reemplazado por ESP8266 WiFi Shield para Arduino y otros micros que proporciona una función de configuración de página web más universal.IntroducciónESP8266 es un chi
Sintetizador digital VRA8-P para Arduino Uno

Sintetizador digital VRA8-P para Arduino Uno

Hecho por ISGK instrumentoshttps://github.com/risgk/digital-Synth-vra8-pConcepto3 voz sintetizador polifónico de Pseudo para Arduino UnoCaracterísticasVoz 3 Pseudo Polyphonic Synthesizer (sintetizador de Paraphonic), módulo de sonido MIDISerial MIDI
Sintetizador digital VRA8-X para Arduino Uno

Sintetizador digital VRA8-X para Arduino Uno

Hecho por ISGK instrumentoshttps://github.com/risgk/digital-Synth-vra8-xConceptoExperimental sintetizador para Arduino UnoCaracterísticasMonophonic sintetizador (o módulo de sonido MIDI)Serial MIDI en (38400 bps), tasa de salida (Pin 6), de Audio PWM
3 canales Dimmer/atenuador para Arduino u otro microcontrolador

3 canales Dimmer/atenuador para Arduino u otro microcontrolador

En un anterior instructable presenté un simple AC TRIAC fader/atenuador que podría controlarse con un Arduino. En varias reacciones que tiene, un número de personas que expresaron su interés en un atenuador de 3 canales RGB. Pero ya no he visto todav
TEA5767 FM Radio Breakout Junta para Arduino

TEA5767 FM Radio Breakout Junta para Arduino

recientemente no ha podido resistir comprar dos módulos de Radio de FM de TEA5767 de eBay para casi nada. Estos pequeños módulos utilizan el protocolo serial I2C y así que son ideales para conectar un Arduino.Hay más información y otros proyectos de
Sintetizador digital VRA8-M para Arduino Uno

Sintetizador digital VRA8-M para Arduino Uno

Hecho por ISGK instrumentoshttps://github.com/risgk/digital-Synth-vra8-mConceptoSintetizador monofónico (módulo de sonido MIDI) para Arduino UnoCaracterísticasSerial MIDI en (38400 bps), tasa de salida (Pin 6), de Audio PWM PWM: 62500 hertziosTarifa
ArduDroid: Un Simple 2-Way Bluetooth controlador basado en Android para Arduino

ArduDroid: Un Simple 2-Way Bluetooth controlador basado en Android para Arduino

ACTUALIZACIONES:19 de noviembre. 2031: opinión: la increíble sinergia entre Arduino y Android.30 de octubre de 2013: Andruino está ahora oficialmente ARDUDROID y pronto estará disponible en Google Play. Este cambio de nombre para evitar conflicto con
Solución: avrdude stk500_getsync(): no en sync resp = error 0 x 30 para Arduino

Solución: avrdude stk500_getsync(): no en sync resp = error 0 x 30 para Arduino

para el lector es consciente: este artículo cubre las principales causas de este problema, pero algunos de los otros usuarios Instructable han encontrado algo "nicho" hace que el problema de que no fueron cubiertos en este artículo y se discuten