Uso do componente Slider

Quando uma ocorrência de Slider estiver com o foco, você poderá usar as seguintes teclas para controlá-la:

Para obter mais informações sobre o controle do foco, consulte a interface IFocusManager e a classe FocusManager na Referência do ActionScript 3.0 para Flash Professional e Trabalho com o FocusManager .

Uma visualização ao vivo de cada ocorrência de Slider reflete as alterações feitas nos parâmetros no Inspetor de propriedades ou no Inspetor de componentes durante a criação.

Você pode definir os parâmetros de autoria a seguir no Inspetor de propriedades ou no Inspetor de componentes de cada instância de Slider: direction , liveDragging , maximum , minimum , snapInterval , tickInterval e value . Cada um desses parâmetros tem uma propriedade ActionScript correspondente de mesmo nome. Para obter informações sobre os possíveis valores desses parâmetros, consulte a classe Slider na Referência do ActionScript 3.0 para Flash Professional .

O exemplo a seguir cria uma ocorrência de Slider para permitir que o usuário expresse seu nível de satisfação com algum evento hipotético. O usuário move o controle deslizante para a direita ou esquerda a fim de indicar o nível de satisfação mais alto ou mais baixo.

1. Crie um novo documento Flash (ActionScript 3.0).

2. Arraste um componente Label do painel Componentes para o centro do Palco.

   • Atribua a ele o nome de ocorrência valueLabel .

   • Atribua o valor 0 percent ao parâmetro text .

3. Arraste um componente Slider do painel Componentes e centralize-o abaixo de value_lbl .

   • Atribua a ele o nome de ocorrência aSlider .

   • Atribua a ele a largura (L:) 200 .

   • Atribua a ele a altura (L:) 10 .

   • Atribua o valor 100 ao parâmetro maximum .

   • Atribua o valor 10 aos parâmetros snapInterval e tickInterval .

4. Arraste outra ocorrência de Label do painel Biblioteca e centralize-a abaixo de aSlider.

   • Atribua a ele o nome de ocorrência promptLabel .

   • Atribua a ele a largura (L:) 250.

   • Atribua a ele a altura (L:) 22.

   • Digite Informe seu nível de satisfação no parâmetro text .

5. Abra o painel Ações, selecione Quadro 1 na Linha do tempo principal e digite o seguinte código do ActionScript:

   import fl.controls.Slider; 
   import fl.events.SliderEvent; 
   import fl.controls.Label; 
    
   aSlider.addEventListener(SliderEvent.CHANGE, changeHandler); 
    
   function changeHandler(event:SliderEvent):void { 
       valueLabel.text = event.value + "percent";     
   }

6. Selecione Controlar > Testar filme.

   Neste exemplo, quando você move a miniatura do controle deslizante de um intervalo para outro, um ouvinte do evento SliderEvent.CHANGE atualiza a propriedade text de valueLabel para exibir o percentual que corresponde à posição da miniatura.

O exemplo a seguir cria um controle deslizante usando o ActionScript. O exemplo baixa uma imagem de uma flor e usa o controle deslizante para permitir que o usuário esmaeça ou aplique brilho à imagem, alterando sua propriedade alpha para corresponder ao valor do controle deslizante.

1. Crie um novo documento Flash (ActionScript 3.0).

2. Arraste os componentes Label e Slider do painel Componentes para o painel Biblioteca do documento atual.

   Esse procedimento adicionará os componentes à biblioteca, mas não o tornará visível no aplicativo.

3. Abra o painel Ações, selecione Quadro 1 na Linha do tempo principal e digite o seguinte código para criar e posicionar ocorrências de componentes:

   import fl.controls.Slider; 
   import fl.events.SliderEvent; 
   import fl.controls.Label; 
   import fl.containers.UILoader; 
    
   var sliderLabel:Label = new Label(); 
   sliderLabel.width = 120; 
   sliderLabel.text = "< Fade - Brighten >"; 
   sliderLabel.move(170, 350); 
    
   var aSlider:Slider = new Slider(); 
   aSlider.width = 200; 
   aSlider.snapInterval = 10; 
   aSlider.tickInterval = 10; 
   aSlider.maximum = 100; 
   aSlider.value = 100; 
   aSlider.move(120, 330); 
    
   var aLoader:UILoader = new UILoader(); 
   aLoader.source = "http://www.flash-mx.com/images/image1.jpg"; 
   aLoader.scaleContent = false; 
    
   addChild(sliderLabel); 
   addChild(aSlider); 
   addChild(aLoader); 
    
   aLoader.addEventListener(Event.COMPLETE, completeHandler); 
    
   function completeHandler(event:Event) { 
       trace("Number of bytes loaded: " + aLoader.bytesLoaded); 
   } 
    
   aSlider.addEventListener(SliderEvent.CHANGE, changeHandler); 
    
   function changeHandler(event:SliderEvent):void { 
           aLoader.alpha = event.value * .01; 
   }

4. Selecione Controlar > Testar filme para executar o aplicativo.

5. Mova a miniatura do controle deslizante para a esquerda para esmaecer a imagem e para a direita para aplicar brilho a ela.