Busquedas de palabras en textos con expresiones regulares
Este es un ejemplo de como realizar búsquedas de palabras dentro de cajas de texto haciendo uso de Expresiones Regulares de Actionscript 3.
Lo primero que haremos es crear un patrón con los caracteres de texto que queremos seleccionar. En este caso le indicaremos la palabra desde un TextInput
- var patron:RegExp = new RegExp(input.text);
Este patrón nos encontrará la primera cadena de texto que coincida con los caracteres introducidos en el campo de texto. Si al patrón le añadimos el indicador g (global) hará que nos encuentre no solo la primera coincidencia sino todas las que haya en el texto. También le añadiremos el indicador i (ignoreCase) para que no haga distinción entre mayúsculas y minúsculas.
- var patron:RegExp = new RegExp(input.text,"gi");
Ahora tendremos que solucionar el detalle de que nos encuentre palabras y no caracteres dentro de otras palabras. Es decir, si buscamos la palabra “mi” no queremos que nos la seleccione dentro de “camino”. Para ello utilizaremos grupos de búsqueda. Indicaremos que solo nos interesa cuando despues de la coincidencia haya un espacio, un punto o una coma. Y por el otro lado indicaremos que haya un espacio o que sea inicio de párrafo.
- var patron:RegExp = new RegExp("(^| )" + input.text + "[\ .,]","gi");
Utilizando este patrón dentro del método match() de la clase String podremos recuperar todas la concordancias que haya en el texto.
- var patron:RegExp = new RegExp("(^| )" + input.text + "[\ .,]","gi");
- var busqueda:Array = texto.text.match(patron);
- output.text = "Total: " + busqueda.length;
Ahora haremos que las palabras encontradas queden resaltadas en negrita, color rojo y subrayado. Para ello empezaremos escribiendo un estilo CSS, y asignándolo al campo de texto.
- var estilo:StyleSheet = new StyleSheet();
- estilo.parseCSS(".select{fontWeight:bold; color: #FF0000; text-decoration: underline;}");
- texto.styleSheet = estilo;
Con el método replace() de la clase String sustituiremos el contenido del patrón por un String que nos añadirá el tag que asignará el estilo CSS a la palabra. Como en el patrón hemos indicado que nos seleccione la palabra junto a los espacios en blanco o los puntos y comas, deberemos utilizar otro patrón que solo seleccione los caracteres de texto introducidos en el TextInput. Este segundo patrón lo colocaremos dentro de una función recursiva.
- texto.htmlText = texto.text.replace(patron,setSpan);
- function setSpan(txt:String, ...rest):String
- {
- var patron:RegExp = new RegExp(input.text,"i");
- var tag:String = txt.replace(patron,"<span class='select'>$&</span>");
- return tag;
- }
Ý listo, ya tenemos el ejemplo montado (coloquen una palabra en el TextInput y denle al botón):
Este es el código completo:
- var estilo:StyleSheet = new StyleSheet();
- estilo.parseCSS(".select{fontWeight:bold; color: #FF0000; text-decoration: underline;}");
- texto.styleSheet = estilo;
- boton.addEventListener(MouseEvent.CLICK, buscaPalabra);
- function buscaPalabra(e:MouseEvent=null):void
- {
- var patron:RegExp = new RegExp("(^| )" + input.text + "[\ .,]","gi");
- var busqueda:Array = texto.text.match(patron);
- output.text = "Total: " + busqueda.length;
- texto.htmlText = texto.text.replace(patron,setSpan);
- }
- function setSpan(txt:String, ...rest):String
- {
- var patron:RegExp = new RegExp(input.text,"i");
- var tag:String = txt.replace(patron,"<span class='select'>$&</span>");
- return tag;
- }
- buscaPalabra();
Y aquí el archivo .FLA para descargar. (archivo CS4)
Compártelo:
Visto 12.732 veces
Interesante lo usare en un pequeño projecto que estoy haciendo.
La verdad nunca habria pensado en usar expresiones regulares.
Gracias.
Muy util, de paso, acabo de aprender a usar css en un campo de texto en Flash, asi que 2 X 1.
muchas gracias por la info…
apenas estaba sufriendo con algo parecido…
saludos… 😉
__________
Necesitas una agenda para tus pacientes?
Agenda Business Customer
http : // www . ddsmedia . net
Buenísimo, muy bien detallado, me servirá mucho, gracias
Hola, estoy empezando en esto del ActionScript y ando bastante perdido, cada paso que doy me surgen más y más dudas 😛
Veréis, estoy intentado hacer que un archivo flash cargue un archivo de texto externo el cual contiene una lista de palabras, eso creo que lo consigo con:
var request:URLRequest = new URLRequest(“mitexto.txt”);
var loader:URLLoader = new URLLoader();
loader.load(request);
He de decir que la lista de palabras del archivo de texto está separada por INTROS y todas están en mayúsculas tal que así:
ANTE
ANTENA
ANTENISTA
BALA
BALAR
…
Ahora el problema viene en lo que quiero crear, es simplemente una caja de búsqueda en la cual consta de una caja de introducción de texto, un botón para buscar y un texto dinámico que me devuelva un mensaje diciendo si ha encontrado la palabra o no dentro de ese archivo de texto.
Seguro que es más fácil de lo que parece, pero no doy con ello. Te agradecería me ayudaras ya que veo por tu web y tutoriales dominas mucho ActionScript.
Gracias de antemano
Un saludo.
@Tito:
Para hacer esas comprobaciones tienes la función Test(). Sería algo así:
Te devolvería true o false según si encuentra la coincidencia.
Gracias por la informacion, pero me da errores y no se que falta o que sobra. Tengo:
– 1 boton con nombre de instancia “boton”
– 1 caja de introduccion de texto con nombre de instancia “textoabuscar”
– 1 texto dinamico con nombre de instancia “salidabusqueda”
– el archivo de texto llamado “diccionario.txt”
Y este es el código el cual me da errores y ya no se que poner ni que quitar:
————————
stop();
var request:URLRequest = new URLRequest(“diccionario.txt”);
var loader:URLLoader = new URLLoader();
loader.load(request);
buscar.addEventListener(MouseEvent.CLICK, func_buscar);
function func_buscar(e:MouseEvent=null):void
{
var textoabuscar:RegExp = new RegExp(“(^| )” + textoabuscar.text + “[\ .,]”,”gi”);
var busquedadetexto:Array = “diccionario.txt”.match(textoabuscar);
salidabusqueda.text = “Total: ” + busquedadetexto.length;
}
———————–
Que me falta por poner y por quitar? esto es desesperante.
Gracias de antemano
Mira, este código completo hace más o menos lo que quieres:
Muchisimas gracias, ahora si me funciona y hubiese sido imposible haberlo conseguido por mi mismo que estoy demasiado verde aun
Gracias!
Hola de nuevo, otra duda que me surge y no he podido encontrar solucion por ningun sitio:
Aplico a un campo de introduccion de texto la propiedad .restric para que lo que escriba sea en mayusculas:
Asi solo se pueden introducir mayusculas, ni caracteres especiales ni numeros ni nada, sol mayusculas:
miTexto.text.restrict = (A-Z);
Y asi se puede introducir de todo menos minusculas que es lo que yo quiero:
miTexto.text.restrict = (^a-z);
El problema viene con la letra Ñ que no sale, ¿sabéis cómo hay que escribirlo o alguna forma de hacerlo?
Gracias
@Tito:
¿Y por que no haces una función que te pase todo lo que se escriba a mayúsculas?
Pues porque no sabía como escribirlo
Muchas gracias de nuevo, que la vida os lo pague con muchos intentos de hacer hijos
Gracias!
Ayuda porfa alguien sabe como puedo realizar una busqueda similar a la de google o la de encarta premium 2009, etc. en actionscript 3 que al momento de escribir una palbra te aparece ya una serie de opciones. gracias por la ayuda