Använda komponenten Button

Button-komponenten är en rektangulär knapp vars storlek kan ändras och som en användare kan klicka på med musen eller mellanslagstangenten för att initiera en åtgärd i programmet. Du kan lägga till en anpassad ikon på en Button. Du kan också ändra beteendet för en Button från push-knapp till en toggle-knapp. En alternativknappskontroll förblir nedtryck när användaren klickar på den, och återgår till uppåt-läget när användaren klickar på den igen.

En Button är en grundläggande del av många formulär och webbprogram. Du kan använda knappar när du vill att en användare ska initiera en händelse. De flesta formulär har till exempel en Skicka-knapp. Du kan också lägga till Föregående- och Nästa-knappar i en presentation.

Använda komponenten Button

Du kan aktivera eller inaktivera en knapp i ett program. I inaktiverat läge tar knappen inte emot inmatningar från musen eller tangentbordet. En aktiverad knapp får fokus om du klickar på den eller går till den med tabbtangenten. När en Button-förekomst har fokus kan du använda följande tangenter för att styra den:

Nyckel

Beskrivning

Skift+Tabb

Flyttar fokus till föregående objekt.

Mellanslagstangent

Trycker på eller släpper knappen och utlöser click -händelsen.

Tabb

Flyttar fokus till nästa objekt.

Enter/Retur

Flyttar fokus till nästa objekt om en knapp har angetts som standard-Button för FocusManager.

Mer information om hur du styr fokus finns i avsnittet om gränssnittet IFocusManager och klassen FocusManager i Referenshandbok för ActionScript 3.0 i Adobe Flash Professional och Arbeta med FocusManager .

En direktförhandsvisning av varje Button-förekomst reflekterar ändringar som gjorts för parametrar i egenskapsinspektören eller komponentinspektören vid redigeringen.

Obs! Om en ikon är större än knappen visas den utanför knappens gränser.

Om du vill ange en knapp som den push-knapp som är standard i ett program (knappen som tar emot click-händelsen när en användare trycker på Enter), anger du FocusManager.defaultButton . Följande kod anger till exempel att standardknappen ska vara en Button-förekomst som kallas submitButton . 

FocusManager.defaultButton = submitButton;

När du lägger till Button-komponenten i ett program kan du göra den åtkomlig för en skärmläsare genom att lägga till följande rader med ActionScript-kod: 

import fl.accessibility.ButtonAccImpl; 
 
ButtonAccImpl.enableAccessibility();

Du aktiverar bara en komponents åtkomlighet en gång, oavsett hur många förekomster du skapar.

Button-komponentparametrar

Du kan ange följande utvecklingsparametrar i egenskapsinspektören (Fönster > Egenskaper > Egenskaper) eller i komponentinspektören (Fönster > Komponentinspektören) för varje Button-förekomst: emphasized , label , labelPlacement , selected och toggle . Var och en av de här parametrarna har en motsvarande ActionScript-egenskap med samma namn. När du tilldelar ett värde till parametrarna anger du egenskapens startläge i programmet. Om du anger egenskapen i ActionScript åsidosätter det värdet som du anger i parametern. Information om möjliga värden på de här parametrarna finns i Button-klassen i Referenshandbok för ActionScript 3.0 i Adobe Flash Professional .

Skapa ett program med komponenten Button

I proceduren nedan beskrivs hur du lägger till en Button-komponent i ett program när du redigerar. I det här exemplet ändrar Button läget på en ColorPicker-komponent när du klickar på den.

  1. Skapa ett nytt Flash-dokument (ActionScript 3.0).

  2. Dra en Button-komponent från panelen Komponenter till scenen och ange följande värden för den i egenskapsinspektören:

    • Ange förekomstnamnet aButton .

    • Ange Visa som etikettparameter.

  3. Lägg till en ColorPicker på scenen och ge den förekomstnamnet aCp .

  4. Öppna åtgärdspanelen, markera bildruta 1 i huvudtidslinjen och ange följande ActionScript-kod: 

    aCp.visible = false; 
 
aButton.addEventListener(MouseEvent.CLICK, clickHandler); 
 
function clickHandler(event:MouseEvent):void { 
     
    switch(event.currentTarget.label) { 
        case "Show": 
            aCp.visible = true; 
            aButton.label = "Disable"; 
            break; 
        case "Disable": 
            aCp.enabled = false; 
            aButton.label = "Enable"; 
            break; 
        case "Enable": 
            aCp.enabled = true; 
            aButton.label = "Hide"; 
            break; 
        case "Hide": 
            aCp.visible = false; 
            aButton.label = "Show"; 
            break; 
    } 
}

    Den andra raden med kod registrerar funktionen clickHandler() som händelsehanterare för händelsen MouseEvent.CLICK . Händelsen inträffar när en användare klickar på Button, vilket gör att funktionen clickHandler() utför någon av följande åtgärder, beroende på vilket värdet Button har:

    • Visa gör ColorPicker synlig och ändrar Button-etiketten till Inaktivera.

    • Inaktivera inaktiverar ColorPicker och ändrar Button-etiketten till Aktivera.

    • Aktivera aktiverar ColorPicker och ändrar Button-etiketten till Dölj.

    • Dölj gör ColorPicker osynlig och ändrar Button-etiketten till Visa.

  5. Välj Kontroll > Testa filmen för att köra programmet.

Skapa ett program med komponenten Button

Följande procedur skapar en alternativknappskontroll med ActionScript och visar händelsetypen i utdatapanelen när du klickar på Button. I exemplet skapas Button-förekomsten genom att klassens konstruktor anropas och läggs till på scenen genom att anropa metoden addChild() .

  1. Skapa ett nytt Flash-dokument (ActionScript 3.0).

  2. Dra Button-komponenten från panelen Komponenter till det aktuella dokumentets bibliotekspanel.

    Komponenten läggs till i biblioteket, men den syns inte i programmet.

  3. Öppna åtgärdspanelen, markera bildruta 1 i huvudtidslinjen och ange följande kod för att skapa en Button-förekomst: 

    import fl.controls.Button; 
 
var aButton:Button = new Button(); 
addChild(aButton); 
aButton.label = "Click me"; 
aButton.toggle =true;  
aButton.move(50, 50);

    Metoden move() placerar knappen vid 50 (x-koordinat), 50 (y-koordinat) på scenen.

  4. Nu lägger du till följande ActionScript för att skapa en händelseavlyssnare och en händelsehanterarfunktion: 

    aButton.addEventListener(MouseEvent.CLICK, clickHandler); 
 
function clickHandler(event:MouseEvent):void { 
    trace("Event type: " + event.type); 
}

  5. Välj Kontroll > Testa filmen.

    När du klickar på knappen visar Flash meddelandet ”Händelsetyp: klick” på utdatapanelen.