フォーカスとキー イベント

{value
    let tf1:TextField = {TextField width=3.0in}
    let tf2:TextField = {TextField width=3.5in}
    let tf3:TextField = {TextField width=4.0in}
    let vbox:VBox={VBox
                      tf1,
                      tf2,
                      tf3
                  }
    let dialog:Dialog={Dialog vbox,
                          {on DialogShow do
                              || the 2nd TextField requests the keyboard focus
                              {tf2.request-key-focus}
                          }
                      }

    {CommandButton label="Click and Type",
        {on Action do
            {dialog.show
                modal?=false
            }
        }
    }
}

||  To display the key code as a Dynamic object
{let d:Dynamic = {Dynamic "(none)"}}
{Frame
    width=2in,
    height=1in,
    background={Color.from-string "#ab29df"},
    valign="center",
    halign="center",
    || Display the key code value
    {text Keycode: {value d}},

    || PointerPress event handler
    {on p:PointerPress at f:Frame do
        {f.request-key-focus}
        set f.background = "pink"
        || Consume the PointerPress event so that it is
        || not fired further up the graphic hierarchy
        {p.consume}
    },

    || Event handler for RawKeyPress
    {on rkp:RawKeyPress do
        || Sets the Dynamic object's value to the key code
        ||  that identifies the physical key pressed
        set d.value = {Keycode.name-for-keycode rkp.keycode}
        {if rkp.keycode == Keycode.home then
            {popup-message "You've hit the winning key!"}}
    }
}

{value
    let label:TextDisplay =
        {TextDisplay
            font-size = 9pt,
            font-family = "monospace",
            value="Click in the rectangle below to get the focus...."
        }

    let rect:RectangleGraphic =
        {RectangleGraphic
            fill-color = "red",
            width = 6in,
            height = 1in,
            {on e:PointerPress at r:RectangleGraphic do
                || Checks that the left mouse button was clicked
                {if e.button == left-button then
                    || The RectangleGraphic requests the keyboard focus
                    || for itself
                    {r.request-key-focus}
                    || Consumes the event to prevent further firing of
                    || the PointerPress event up the graphic hierarchy
                    {e.consume}
                }
            },
            || When the RectangleGraphic gets the keyboard focus,
            || FocusIn is fired at it
            {on e:FocusIn at r:RectangleGraphic do
                || Changes the color of the rectangle
                set r.fill-color = "green"
                || Changes its text
                set label.value =
                    "Press keys and see how this display changes...."
                {e.consume}
            },
            || When the RectangleGraphic loses focus,
            || FocusOut is fired at it
            {on e:FocusOut at r:RectangleGraphic do
                || Changes the color back to red
                set r.fill-color = "red"
                set label.value =
                    "Click in the rectangle below to get the focus...."
                {e.consume}
            },
            || This event handler handles cooked key events
            {on e:KeyPress do
                || Sets the text to show the key value and properties
                set label.value =

                || name-for-char converts key values to a String
                || This is necessary for undisplayable key
                || constant values (KeyPressValue.*)
                || format displays the String
                "Key Value="&
                {format "%-6s", {KeyPressValue.name-for-char e.value}}&

                || Displays the properties if they are true
                "  Flags="&
                {if e.normal? then "(Normal)" else ""}&
                {if e.shifty? then "(Shifty)" else ""}&
                {if e.keypad? then "(Keypad)" else ""}&
                {if e.repeat? then "(Repeat)" else ""}&
                {if e.unmodified? then "(Unmodified)" else ""}&
                {if e.insertable? then "(Insertable)" else ""}&

                || Displays the modifiers if they are true
                "  Modifiers="&
                {if e.alt? then "(Alt)" else ""}&
                {if e.ctrl? then "(Ctrl)" else ""}&
                {if e.shift? then "(Shift)" else ""}
                {e.consume}
            }
        }
    {VBox
        label,
        {Fill height=0.2in},
        rect
    }
}

{value
    || The instructions
    let instruct:TextDisplay =
        {TextDisplay
            font-size = 9pt,
            font-family="monospace",
            value="Click in the rectangle below to get the focus...."}
    || The editable text
    let txt:TextDisplay =
        {TextDisplay
            font-size = 9pt,
            font-family = "monospace",
            value = ""
        }
    || The rectangle that requests and gets the keyboard focus
    || after which, it gets all keyboard events
    let rect:RectangleGraphic =
        {RectangleGraphic
            fill-color="red",
            width=6in,
            height=1in,

            || Respond to pointer clicks
            {on e:PointerPress at r:RectangleGraphic do
                {if e.button == left-button then
                    {r.request-key-focus}
                    {e.consume}
                }
            },

            || Respond to getting the focus
            {on e:FocusIn at r:RectangleGraphic do
                set r.fill-color="green"
                set instruct.value =
                    "Press keys to edit the text below the rectangle...."
                {e.consume}
            },

            || Respond to losing the focus
            {on e:FocusOut at r:RectangleGraphic do
                set r.fill-color="red"
                set instruct.value =
                    "Click in the rectangle below to get the focus...."
                {e.consume}
            },

            || Respond to KeyPress events
            {on e:KeyPress do

                {if e.insertable? then

                    || The user has pressed a normal key without
                    || pressing any significant modifier keys, so the
                    || KeyPress is "insertable".

                    || Append the value to the txt
                    set txt.value = txt.value & e.value

                 elseif (e.value == KeyPressValue.backspace and
                         e.unmodified?) then

                    || The user has pressed the backspace key
                    || without significant modifier keys.

                    let str:String = txt.value

                    || Clear the text, replacing it with String
                    || less one character
                    {if str.size > 0 then
                        set txt.value = {str.substr 0, str.size - 1}
                    }

                 elseif (e.value == KeyPressValue.esc and
                         e.unmodified?) then

                    || The user has pressed the escape key
                    || without any significant modifier keys.

                    || Clear the text entirely
                    set txt.value = ""
                }
                {e.consume}
            }
        }

    {VBox
        instruct,
        {Fill height=0.2in},
        rect,
        {Fill height=0.2in},
        txt
    }
}

{let d-txt:Dynamic=
    {Dynamic "Click the Frame to get the keyboard focus."}}
{spaced-hbox
    valign="center",
    {Frame
        width=1in,
        height=1in,
        background="cyan",
        {on pp:PointerPress at fr:Frame do
            {fr.request-key-focus}
            {pp.consume}},
        {on FocusIn at fr:Frame do
            set fr.background = "blue"
            set d-txt.value="Press Shift+Home using different Home keys."},
        {on FocusOut at fr:Frame do
            set fr.background = "cyan"
            set d-txt.value=
            "Click the Frame to regain the keyboard focus."},
        || The event handler that responds to cooked key events
        {on kp:KeyPress do
            || Checks if the Home key on the keypad is used
            {if kp.value == KeyPressValue.home and kp.keypad? then
                || Checks if the Shift key is used
                {if kp.shift? then
                    || Checks if the Shift key was relevant to the app
                    {if kp.shifty? then
                        set d-txt.value =
                            "You used Shift+Home on the keypad, but " &
                        "did not use NumLock."

                     else
                        || This runs when Shift key was needed to compute
                        || the key value
                        set d-txt.value =
                            "You used Shift+Home on the keypad, and " &
                        "used NumLock too."
                    }
                 else
                    || This runs when Shift was not pressed
                    set d-txt.value = "You used Home on the keypad. " &
                    "Now try Shift+Home."
                }

             elseif kp.value == '7' and kp.keypad? then
                set d-txt.value = "The key value is not KeyPressValue.home; " &
                "it's '7'. NumLock is on."

             elseif kp.value == KeyPressValue.home then
                {if kp.shift? then
                    set d-txt.value = "You used Shift+Home on the special pad. " &
                    "Now use Home on the keypad."

                 else
                    set d-txt.value = "You used Home on the special pad. " &
                    "Now use Home on the keypad."
                }

             else
                set d-txt.value="Press Shift+Home using different " &
                "Home keys."
            }
        }
    },
    {TextFlowBox {value d-txt}}
}