Share
Todos estos tres componentes tratan con números en rangos. En este Consejo rápido veremos cómo usarlos..
El paso numérico le permite establecer un número dentro de un cierto rango usando el teclado o haciendo clic en las teclas de flecha; el control deslizante le permite arrastrar un pulgar para seleccionar un número de un rango de una manera más gráfica, y la barra de progreso muestra a qué distancia de un rango está un número determinado.
En la vista previa de SWF verás dos Etiquetas, dos NumericSteppers, dos Botones, un Círculo azul y un Control deslizante. Los NumericSteppers se utilizan para establecer un rango de números a partir del cual generaremos un número aleatorio. Cuando se hace clic en el botón, la etiqueta cambiará para mostrar el número aleatorio que se generó. El control deslizante se usa para cambiar el tamaño del círculo; al arrastrar el control deslizante hacia la derecha, aumenta el tamaño del Círculo, mientras que al arrastrar hacia la izquierda disminuye el tamaño del Círculo.
El otro botón se utiliza para cargar un SWF; presione el botón y se agregará una barra de progreso a la etapa para mostrar el progreso de carga. Una vez que el cargador carga su contenido, se agrega a la etapa y se elimina la barra de progreso.
Abra un nuevo documento de Flash y establezca las siguientes propiedades
Abra la ventana de componentes yendo a Menú> Ventana> Componentes o presionando CTRL + F7.
Arrastre dos botones, dos etiquetas, dos Steppers numéricos y un control deslizante al escenario.
En el panel Propiedades, asigne a la primera etiqueta el nombre de instancia "StepperLabel"
(Si el panel de Propiedades no se muestra, vaya a Menú> Ventana> Componentes o presione CTRL + F3)
Coloca la etiqueta X en 19 y su Y en 9..
Usando el panel de Propiedades:
Dibuje un círculo azul con la herramienta ovalada (mantenga presionada la tecla shift para hacer que se ajuste a un círculo) y conviértalo en un clip de película seleccionándolo, haciendo clic con el botón derecho y luego seleccionando "Convertir en símbolo". Dale un nombre de instancia de "theCircle".
Cree un nuevo archivo ActionScript y asígnele el nombre Main.as
Estaremos declarando nuestros componentes en Main.as, por lo que debemos desactivar "autodeclara instancias de etapa". La ventaja de hacer esto es que obtiene sugerencias de código para la instancia.
Ir Menú> Archivo> Configuración de publicación
Haga clic en Ajustes al lado de Guión [ActionScript 3]
Desmarque "declarar automáticamente las instancias de la etapa"
En Main.as abrir la declaración del paquete e importar las clases que usaremos.
Agregue lo siguiente a Main.as.
package // Nuestros componentes en el escenario importan fl.controls.NumericStepper; importar fl.controls.Slider; importar fl.controls.ProgressBar; importar fl.controls.Label; importar fl.controls.Button; // Necesario para extender la clase import flash.display.MovieClip; // Necesario para cambiar el tamaño de nuestra etiqueta. Importación de texto flash.text.TextFieldAutoSize; // Los eventos que necesitamos en este proyecto import flash.events.MouseEvent; import flash.events.Event; import fl.events.SliderEvent; import flash.events.ProgressEvent; // Necesario cargar el archivo .swf import flash.net.URLRequest; importar flash.display.Loader;
Agreguemos la Clase, hagamos que extienda el Clip de Película y configuremos nuestra función de constructor.
Agregue lo siguiente a Main.as:
La clase pública Main extiende MovieClip public var StepperLabel: Label; public var sliderLabel: Label; public var fromStepper: NumericStepper; public var toStepper: NumericStepper; public var randomNumButton: Button; public var loaderButton: Button; control deslizante de var público: Control deslizante; public var progressBar: ProgressBar; public var theLoader: Loader; public var theCircle: Circle; función pública Main () setupLabels (); setupSteppers (); botones de configuración (); setupSlider ();
Aquí definimos las funciones que se utilizan en nuestro constructor..
En setupLabels () función hacemos una configuración básica en nuestras etiquetas utilizando tamaño automático de modo que cada etiqueta se redimensionará automáticamente para contener todo el texto que se le pase.
En setupSteppers () función configuramos las propiedades "mínima" y "máxima" de nuestros motores paso a paso. Estos se utilizan para restringir los números disponibles dentro del paso a paso. No estamos usando un detector de eventos con los controles deslizantes aquí (aunque puede usar Evento. CAMBIO para que los controles deslizantes detecten cuando su valor es alterado).
En botones de configuración () Añadimos nuestro texto a los botones a través de la etiqueta propiedad y añadir oyentes de eventos a los botones.
En setupSliders () establecemos el mínimo y máximo para los valores de los deslizadores. los snapInterval establece cuánto cambia el valor del control deslizante al arrastrar; Aquí usamos .1. los liveDragging se establece en cierto de modo que el valor del control deslizante esté disponible mientras se arrastra, si se configuró como falso No podríamos obtener el valor hasta que el usuario dejara de arrastrar. Finalmente, agregamos un oyente al deslizador..
Agregue lo siguiente a Main.as:
función privada setupLabels (): void StepperLabel.text = "Haga clic en el botón para obtener un número aleatorio"; // Automatiza la etiqueta para contener todo el texto StepperLabel.autoSize = StepperLabel.autoSize = TextFieldAutoSize.LEFT; sliderLabel.text = "Arrastre el control deslizante para cambiar el tamaño del círculo"; // Automatiza la etiqueta para contener todo el texto sliderLabel.autoSize = sliderLabel.autoSize = TextFieldAutoSize.LEFT; función privada setupSteppers (): void // Valores mínimos de los steppers fromStepper.minimum = 0; toStepper.minimum = 1; // Valores máximos de los steppers fromStepper.maximum = 99; toStepper.maximum = 100; // Establezca aquí el valor de los steppers fromStepper.value = 0; toStepper.value = 45; función privada setupButtons (): void randomNumButton.label = "Click"; randomNumButton.addEventListener (MouseEvent.CLICK, getrandomNumer); loaderButton.label = "Load Swf"; loaderButton.addEventListener (MouseEvent.CLICK, loadSwf); función privada setupSlider (): void // Valores mínimos y máximos para el control deslizante slider.minimum = 1; slider.maximum = 3; // Esto establece cuánto "incrementa" el deslizador por slider.snapInterval = .1; // liveDragging significa que el valor de los motores paso a paso está disponible al arrastrar // si se establece en falso, no obtenemos el valor hasta que dejamos de arrastrar slider.liveDragging = true; slider.addEventListener (SliderEvent.CHANGE, scaleCircle);
Aquí añadimos las funciones restantes..
En el getrandomNumber () función que llamamos otra función, generateRandomNumber (), que es de un tutorial aquí en Activetuts + por Carlos Yanez. Sigue adelante y echa un vistazo a ese tutorial para ver cómo funciona esto.!
los scaleCircle () función obtiene el valor del control deslizante y establece el escalaX y escalable del el círculo MovieClip. los escalaX y escalable se utilizan para cambiar el tamaño (escala) del clip de película.
los loadSwf () La función configura un cargador que utilizamos para cargar un SWF externo. Luego agregamos un detector de eventos al cargador. contentLoaderInfo; la contentLoaderInfo contiene información sobre lo que el cargador está cargando (aquí, un SWF).
Entonces creamos un Barra de progreso Y añádelo al escenario. Establecemos la barra de progreso fuente alcontentLoaderInfo del cargador, y desde el contentInfoLoader contiene información sobre lo que el cargador está cargando (incluida la bytes cargados y bytesTotal) así es como ProgressBar puede actualizarse para reflejar la cantidad de SWF que se ha cargado.
los doneLoading () La función establece la posición x e y del contenido del cargador (es decir, el SWF) y luego lo agrega al escenario. En este punto hemos terminado con la Barra de progreso, por lo que la eliminamos de la etapa.
Luego cerramos la clase y el paquete..
Accentsconagua
función privada getrandomNumer (e: Event): void // Aquí pasamos dos números (los valores de los steppers) generaRandomNumber (fromStepper.value, toStepper.value); private function generateRandomNumber (minNum: Number, maxNum: Number): void // Mantiene el número generado var randomNumber = (Math.floor (Math.random () * (maxNum - minNum + 1)) + minNum); // Aquí emitimos un número aleatorio a una cadena para que podamos usarlo en el texto de las etiquetas StepperLabel.text = "Su número aleatorio es" + String (randomNumber); private function scaleCircle (e: Event): void // scaleX and scaleY aumenta o disminuye el tamaño de un MovieClip // aquí usamos el valor del control deslizante de "1-3" theCircle.scaleX = e.target.value; theCircle.scaleY = e.target.value; función privada loadSwf (e: Evento): void theLoader = new Loader (); theLoader.x = 319.00; theLoader.y = 31.00; theLoader.load (new URLRequest ("dummy.swf")); // Aquí obtenemos el contentLoaderInfo del cargador, que es lo que el cargador // está cargando (aquí un swf) theLoader.contentLoaderInfo.addEventListener (Event.COMPLETE, completedLoading); progressBar = new ProgressBar (); progressBar.x = 323; progressBar.y = 244; addChild (progressBar); // La fuente de la barra de progreso se establece en contentLoaderInfo del cargador // contentLoaderInfo contiene la información sobre bytesLoaded / bytesTotal progressBar.source = theLoader.contentLoaderInfo; función pública finalizada Carga (e: Evento): void // Aquí configuramos el contenido del cargador.x y .y //I.E. .x y .y theLoader.content.x = 290 de swf; theLoader.content.y = 20; // Añadimos el contenido de los cargadores I.E. el swf addChild (theLoader.content); // Ya que el cargador ha terminado de cargar, ya no necesitamos la barra de progreso // Así que eliminamos removeChild (progressBar); // cerrar la clase // cerrar el paquete Una vez más, usar componentes es una excelente manera de agregar funcionalidad a sus películas Flash sin tener que compilarlas desde cero
Notará en el panel Parámetros de componentes de los componentes que puede verificar y seleccionar ciertas propiedades.
La imagen de arriba es para el componente NumericStepper
Las propiedades son las siguientes para el componente NumericStepper:
Las propiedades del control deslizante son las siguientes
SliderDirection.HORIZONTAL y SliderDirection.VERTICAL.Las propiedades de la barra de progreso son las siguientes
ProgressBarDirection.RIGHT indica que la barra de progreso está llena de izquierda a derecha. Un valor de ProgressBarDirection.LEFT Indica que la barra de progreso está llena de derecha a izquierda..ProgressBarMode.EVENT, ProgressBarMode.POLLED, ProgressBarMode.MANUAL Para ver las propiedades de las etiquetas y los botones, asegúrese de consultar la Sugerencia rápida sobre etiquetas y botones.
Los archivos de ayuda también son un buen lugar para aprender más sobre las propiedades de los componentes que puede configurar en el panel de parámetros.
Gracias por leer y esté atento a las próximas presentaciones de componentes.!
