키보드 기본 가이드

이 화면은 키보드 샘플화면이다.

텍스트를 입력할 필드를 settargetfield API로 지정 후 letterkey API 등으로 입력한다.

키보드 컴포넌트를 사용하기 위해서는 hangul 라이브러리가 필요하다.

hangul 라이브러리 위치는 xframe5.js의 ENGINEURL 하위에 /ext/lib 디렉토리이다(기본경로: C:/xframe5/xf5/ext/lib/hangul.min.js).

예시

템플릿 위치: /HTML5/COMPONENT/KEYBOARD/keyboard_basic

템플릿 파일

화면 스크립트

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
function screen_on_load()
{
    var i, btn_length;
 
    // 텍스트를 입력할 필드 지정
    this.keyboard.settargetfield("fld");
 
    // 버튼키에 마우스업 이벤트 등록
    btn_length = this.btn.length;
    for (i = 0; i < btn_length; i++) {
        this.btn[i].registerevent("on_mouseup", "btn_on_mouseup(objInst)");
    }
}
 
function btn_on_mouseup(objInst, index)
{
    var btn_length, i;
 
    // 키 눌렀을때 필드에 포커스 처리
    this.fld.setfocus();
 
    // 버튼의 개수 구하기
    btn_length = this.btn.length;
 
    switch (index) {
        case 13: // Backspace 키 눌렀을때 처리
            this.keyboard.backspacekey();
            break;
        case 27: // Delete 키 눌렀을때 처리
            this.keyboard.deletekey();
            break;
        case 28: // 한/영 키 눌렀을때 처리
            // 한/영 키가 눌려 있을 경우(한글키로 변경)
            if (objInst.getstatuspush()) {
                // Shift 키가 눌려 있는 경우
                if (this.btn[40].getstatuspush()) {
                    for (i = 0; i < btn_length; i++) {
                        this.btn[i].settext(this.keyboard.getshiftchar(this.btn[i].gettext()));
                        this.btn[i].settext(this.keyboard.getengchar(this.btn[i].gettext()));
                        this.btn[i].settext(this.keyboard.getshiftchar(this.btn[i].gettext()));
                    }
                }
                else {
                    for (i = 0; i < btn_length; i++) {
                        this.btn[i].settext(this.keyboard.getengchar(this.btn[i].gettext()));
                    }
                }
 
                // 한/영 키 눌림상태 false로 변경
                objInst.setstatuspush(false);
            }
            // 영문 키로 변경
            else {
                // Shift키가 눌려 있는 경우
                if (this.btn[40].getstatuspush()) {
                    for (i = 0; i < btn_length; i++) {
                        this.btn[i].settext(this.keyboard.getshiftchar(this.btn[i].gettext()));
                        this.btn[i].settext(this.keyboard.getengchar(this.btn[i].gettext()));
                        this.btn[i].settext(this.keyboard.getshiftchar(this.btn[i].gettext()));
                    }
                }
                else {
                    for (i = 0; i < btn_length; i++) {
                        this.btn[i].settext(this.keyboard.getengchar(this.btn[i].gettext()));
                    }
                }
 
                // 한/영 키 눌림상태로 변경
                objInst.setstatuspush(true);
            }
            break;
        case 40: // Shift 키 눌렀을때 처리
        case 51:
            // 버튼 눌림 상태 변경
            if (objInst.getstatuspush()) {
                this.btn[40].setstatuspush(false);
                this.btn[51].setstatuspush(false);
            }
            else {
                this.btn[40].setstatuspush(true);
                this.btn[51].setstatuspush(true);
            }
 
            // Shift키 처리
            for (i = 0; i < btn_length; i++) {
                this.btn[i].settext(this.keyboard.getshiftchar(this.btn[i].gettext()));
            }
            break;
        case 52: // 초기화
            this.fld.settext("");
            break;
        default: // 문자 입력
            this.keyboard.letterkey(objInst.gettext());
            break;
    }
}

  • guide/component/keyboard/keyboard_basic.txt
  • 마지막으로 수정됨: 2023/07/17 15:03
  • 저자 127.0.0.1