Posts Tagged ‘ Botón ’

46
22
Jul

El botón ON/OFF de música más sencillo para flashica

Música en flash
He estado trabajando un poco con flash estos últimos días, y entre otras cosas, he encontrado una forma realmente sencilla de hacer un botón on de apagar y encender la música para un sitio flash (Usando ActionScript 2.0).

Lo haremos en unos sencillos pasos:

Paso uno: Estando situados en el Escenario principal, lo que haremos será importar el sonido. Eso se puede hacer arrastrando el archivo de sonido directamente a la biblioteca de flash. Para el ejemplo, he usado este loop.

Nota: Una vez tenemos el sonido importado, en sus propiedades, si deseamos, podemos variar su calidad para hacer que pese menos en la película final.

Paso dos: Cuando tengamos esto, creamos un nuevo MC vacío (Ctrl+F8). Este MC, por decir un nombre, lo llamaremos “sonido“:

Este MC, tendrá únicamente 2 fotogramas. Para crearlos, usaremos fotogramas clave (F6). Debe quedarnos de esta forma:

Paso tres: Una vez esto, añadiremos al primer fotograma la instancia de “off”, y en el segundo fotograma, le ponemos de instancia “on” (Ver imagen inferior). Imagino que ya puedes imaginarte para que son los 2 fotogramas. Uno representará el estado de “apagado” y el otro de “encendido” de la música.

Paso cuatro: Hacemos dos dibujos que representen estos estados en cada respectivo fotograma:

Fotograma 1:



Fotograma 2:

Nota: Si deseas que el icono representativo del estado sea una animación, inserta un MC con las animaciones que quieras (barras subiendo y bajando, o un espectro de sonido ficticio, etc.) en vez de un dibujo estático. Para el caso usaré un dibujo estático para hacerlo más simple.

Nota 2: De todas formas ten en cuenta que el dibujo mismo actuará como zona activa del botón, por lo que si lo haces invisible, luego no se podrá hacer clic y el inventó se joderá

Ahora es cuando empieza la magia.

Paso cinco: Seleccionamos el fotograma que corresponde a la música encendida (el 2 en nuestro caso), y en el panel propiedades le añadimos el sonido solamente a ese fotograma:

Y le asignamos que haga un loop continuado (esto es a vuestra discreción, según cuantas veces queréis que se reproduzca el sonido):

Paso seis: Perfecto, lo que queda ahora es solo el código, el cual es realmente sencillo. Tanto como esto:

  1. En los ambos fotogramas de nuestro MC ponemos un: stop();
  2. Adicionalmente, en el fotograma que corresponde al estado “detenido” (es decir, el 1), lo pondremos un stopAllSounds();

De forma que al final tenemos:
Fotograma 1:
[as]//Fotograma 1
stop();
stopAllSounds();
[/as]
Fotograma 2:
[as]//Fotograma 2
stop();[/as]

Como pueden observar lo que hemos hecho hasta el momento no tiene misterio.

Paso siete: Ahora pongamos la parte de código principal, la que controla el MovieClip desde la escena principal. Nos ubicamos en el directorio raíz de la película (alias root), instanciamos a nuestro MC como “control“:

instancia

A continuación, en el fotograma en el que aparece nuestro control de sonido, le ponemos este código.

[as]var estado:Boolean = false
control.onPress = function() {
if(estado) {
control.gotoAndStop(“off”);
estado=false;
} else {
control.gotoAndStop(“on”);
estado=true;
}
}[/as]

Stage
Este código va en el fotograma donde estará el MC.

Aquí varios ejemplos:

  1. http://blog.bleend.net/wp-content/uploads/2008/07/sample_1.swf

    2.  

  2. http://blog.bleend.net/wp-content/uploads/2008/07/sample_2.swf

Flash Descargar Archivo fuente original

3
20
Jan

Añadir botones en el editor de WordPress

Cuando no usamos el editor visual de WordPress y editamos el código HTML, tenemos una serie de botones que nos ayudan a insertar etiquetas HTML en nuestro texto. En este post explicaré como aumentar y personalizar las acciones de esos botones en la cabecera del escritor de posts.

Botones del editor de WordPress

Método Manual

Para añadir botones nosotros mismos modificando los archivos de WordPress, lo haremos de esta forma, ya que nos permite personalizar más los botones, ya que podemos pedir parámetros al usuario con una caja de texto de entrada de datos.

modificaremos este archivo: [Dirección del blog]\wp-includes\js\quiktags.js con nuestro editor preferido. Al abrir, buscamos esta sección de código JavaScript:

edButtons[edButtons.length] =
new edButton('ed_em'
,'i'
,''
,''
,'i'
);

Si saben HTML, no necesitan que les explique nada mas. Simplemente, copiando el bloque este y cambiando las etiquetas de abrir y cerrar nos bastará. Por ejemplo, para justificar texto:

edButtons[edButtons.length] =
new edButton('ed_em'
,'justify'
,'
'
,'

'
,'justify'
);

Método Automático

Ok, ahora que ya sabemos la teoría, les puedo decir que hay un plugin que lo hace solo, únicamente le indicas las etiquetas de abrir/cerrar. Este plugin se llama WP-Quicktags

Pluguin para añadir Quick Tags

Pueden descargarlo Zip aquí, funciona como siempre: Lo pones en la carpeta “plugins”, lo activas desde Panel de control de WP y luego le pones las etiquetas que prefieras