Personalizar o componente RadioButton

Você pode transformar um componente RadioButton horizontal e verticalmente, durante a autoria e em tempo de execução. 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() .

A caixa delimitadora de um componente RadioButton é invisível e também designa a área de pressionamento do componente. Se você aumentar o tamanho do componente, também aumentará o tamanho da área de pressionamento.

Se a caixa delimitadora do componente for muito pequena para ajustar-se ao seu rótulo, o rótulo será recortado para ajustar-se.

Usar estilos com o componente RadioButton

Você pode definir propriedades de estilo para alterar a aparência de um RadioButton. As propriedades de estilos de RadioButton especificam valores de capas, ícones, formatação de texto e preenchimento quando o componente é desenhado. Os estilos de RadioButton especificam valores para as capas e o preenchimento do layout quando o componente é desenhado.

O exemplo a seguir recupera o estilo textFormat de um componente CheckBox e o aplica a um RadioButton para tornar idêntico o estilo de seus rótulos.

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

  2. Arraste um componente CheckBox para o Palco e atribua a ele o nome de ocorrência de myCh no Inspetor de propriedades.

  3. Arraste um RadioButton para o Palco e atribua a ele o nome de ocorrência de myRb no Inspetor de propriedades.

  4. Adicione o seguinte código ao painel Ações no Quadro 1 da Linha do tempo.

    var tf:TextFormat = new TextFormat(); 
    tf.color = 0x00FF00; 
    tf.font = "Georgia"; 
    tf.size = 18; 
    myCh.setStyle("textFormat", tf); 
    myRb.setStyle("textFormat", myCh.getStyle("textFormat"));

    Esse código define o estilo textFormat para a CheckBox, e depois o aplica ao RadioButton chamando o método getStyle() na CheckBox.

  5. Selecione Controlar > Testar filme.

As capas e o componente RadioButton

O RadioButton tem as seguintes capas, cuja aparência você pode alterar editando-as:

Capas de RadioButton

Se um RadioButton está ativado e não selecionado, exibe sua capa de mouse acima quando um usuário move o ponteiro sobre ele. Quando um usuário clica em um RadioButton, ele recebe foco de entrada e exibe sua capa selected_down. Quando um usuário solta o mouse, o RadioButton exibe a capa selected_up. Se um usuário move o ponteiro para fora da área de pressionamento do RadioButton com o botão do mouse pressionado, o RadioButton volta a exibir a capa up.

Se um RadioButton está desativado, exibe seu estado desativado, independentemente da interação do usuário.

O exemplo a seguir substitui a capa selected_up, que indica o estado selecionado.

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

  2. Arraste o componente RadioButton para o Palco e clique nele duas vezes para abrir sua paleta de capas.

  3. Defina o controle de zoom como 800% para ampliar o ícone para edição.

  4. Clique duas vezes na capa selected_up para selecioná-la e pressione a tecla Delete para excluí-la.

  5. No painel Ferramentas, selecione a ferramenta Retângulo.

  6. No Inspetor de propriedades, defina a cor da linha como vermelha (#FF0000) e a cor de preenchimento, como preta (#000000).

  7. A partir das cruzes que marcam o ponto de registro do símbolo (também chamado de ponto de origem ou ponto zero ), clique e arraste o ponteiro, desenhando um retângulo.

  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. Selecione Controlar > Testar filme.

  10. Clique no RadioButton para selecioná-lo.

    O RadioButton no estado selecionado deve ter uma aparência semelhante à mostrada na ilustração a seguir.