Personalizar o componente UIScrollBar

Você pode transformar um componente UIScrollBar horizontal e verticalmente, durante a autoria e em tempo de execução. No entanto, uma UIScrollBar vertical não permite modificações de largura, e uma UIScrollBar horizontal não permite modificações de altura. Durante a autoria, selecione o componente no Palco e use a ferramenta Transformação livre ou qualquer um dos comandos Modificar > Transformar. Em tempo de execução, use o método setSize() ou qualquer propriedade aplicável da classe UIScrollBar, como width , height , scaleX e scaleY .

Nota: Se você usar o método setSize() , poderá alterar somente a largura de uma barra de rolagem horizontal ou a altura de uma barra de rolagem vertical. Durante a autoria, você pode definir a altura de uma barra de rolagem horizontal ou a largura de uma barra de rolagem vertical, mas os valores serão redefinidos quando o filme for publicado. Somente a dimensão correspondente ao comprimento de uma barra de rolagem pode ser alterada.

Usar estilos com o componente UIScrollBar

Os estilos do componente UIScrollBar especificam somente as classes de suas capas e um valor para FocusRectPadding, que especifica o número de pixels a serem usados no preenchimento entre a caixa delimitadora e o limite externo do componente. Para obter mais informações sobre o uso de estilos de capas, consulte Sobre capas .

Usar capas com o componente UIScrollBar

O componente UIScrollBar usa as capas a seguir.

Capas de UIScrollBar

As barras de rolagem horizontais e verticais usam as mesmas capas. Quando exibe uma barra de rolagem horizontal, o componente UIScrollBar gira as capas conforme for adequado.

Nota: Alterar a capa da ScrollBar em um componente causará a mesma alteração em todos os outros componentes que usam a ScrollBar.

O exemplo a seguir demonstra como alterar a cor da miniatura e dos botões de seta da UIScrollBar.

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

  2. Arraste o componente UIScrollBar para o Palco e atribua a ele o nome de ocorrência de mySb . Na guia Parâmetros, defina a direção como horizontal.

  3. Clique duas vezes na barra de rolagem para abrir seu painel de capas.

  4. Clique na capa Up para selecioná-la.

  5. Defina o controle de zoom como 400% para ampliar o ícone para edição.

  6. Clique duas vezes no plano de fundo da seta para a direita (ou da seta para cima, em uma barra de rolagem vertical) até que o plano de fundo seja selecionado e sua cor apareça no Seletor de cor de preenchimento, no Inspetor de propriedades.

  7. Selecione a cor #CC0033 para aplicá-la ao plano de fundo do botão.

  8. Clique no botão Voltar, do lado esquerdo da barra de edição acima do Palco, para voltar ao modo de edição de documento.

  9. Repita as etapas 6, 7 e 8 para os elementos de miniatura e de seta para a esquerda (ou de seta para baixo, em uma barra de rolagem vertical).

  10. Adicione o seguinte código ao painel Ações, no Quadro 1 da Linha do tempo, para anexar a barra de rolagem a um TextField.

    var tf:TextField = new TextField(); 
    addChild(tf); 
    tf.x = 150; 
    tf.y = 100; 
    mySb.width = tf.width = 200; 
    tf.height = 22; 
    tf.text = "All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy. All . . ."; 
    mySb.y = tf.y + tf.height; 
    mySb.x = tf.x + tf.width;x 
    mySb.scrollTarget = tf;
  11. Selecione Controlar > Testar filme.

    O componente UIScrollBar deverá aparecer como na ilustração a seguir.

    ScrollBar horizontal com miniatura e setas para a esquerda e para a direita em vermelho
    ScrollBar horizontal com miniatura e setas para a esquerda e para a direita em vermelho