DUMMY
Tech Note
Tech Note
자료 참고 안내 1. 본 자료실의 모든 자료 저작권은 ㈜에이치앤에스에 있습니다.

본 자료는 개발하시는데 참고자료 용도로 사용하실 수 있으며 저작권 표시 없이 복사,게재, 출판 하실 수 없습니다. 외부 게재 사용 시 반드시 출처 항목에 회사명과 사이트 주소를 반드시 명시해 주시기 바랍니다.
[표기 예] 출처 : ㈜에이치앤에스(www.hnsts.co.kr) 또는 ㈜HNS(www.hnsts.co.kr)

2. 제품 개발 시 내용과 예제 코드는 수정 및 검증작업을 직접 하셔야 하며 문제 발생에 대한 책임은 ㈜HNS사와 무관합니다.

본사는 자료를 최신내용으로 유지하기 위해 노력하고 있으며 제공되는 정보의 오류 및 내용이 정확하지 않을 경우 사전 공지 없이 업데이트 될 수 있습니다. 자료의 문제점 발견 시 본사로 문의주시면 검토하여 자료를 수정하도록 하겠습니다.

이전 목록 다음
SmartKeyboard와 SmartKeyPad의 디자인 가이드
작성일 2018-08-28 수정일 2022-10-06 조회수 2236
분류 SmartX Framework
적용
플랫폼
키워드 SmartKeyboard, SmartKeyPad, 키보드, 키패드
첨부파일 TechNote57_Example.zip

본 자료는
1. SmartKeyboard 활용
[TYPE-1] 한/영 표준 키보드(Normal Type)
[TYPE-2] 숫자 입력 표준 키보드(Numerical Type)
2. SmartKeyPad 활용
[TYPE-3] 한/영 사용자 정의 키보드(Code를 사용한 설정)
[TYPE-4] 숫자(16진수) 입력 사용자 정의 키보드(KeyItemInfos를 사용한 설정)
[TYPE-5] 영문자 전용 사용자 정의 키보드(공용 KeyImage 사용)
순서로 진행합니다.

Windows CE에서 기본적으로 제공되는 키보드는 크기가 작아 사용하는데에 불편함이 있습니다. 이러한 불편함을 개선하여 만들어진 SmartKeyboard와 SmartKeyPad는 디자인을 할 수 있기 때문에 Windows CE에서 기본적으로 제공하는 키보드보다 SmartKeyboard 혹은 SmartKeyPad를 사용하는 것을 권장하고 있습니다. 본 자료는 SmartKeyboard와 SmartKeyPad를 사용해 제작할 수 있는 키보드의 형태와 디자인을 제시하고 제작 방법을 설명합니다.

1. SmartKeyboard 활용 [TYPE-1] 한/영 표준 키보드(Normal Type)
SmartKeyboard
형태 [CASE-1] 이미지 사용
[CASE-2] 이미지 미사용
[테마 사용]

[속성 변경]
키 구성
한글, 영문(대/소문자), 숫자, 각종 기호
형태 / Layout
배치 변경 불가
변경 가능 요소
키 이미지, 키보드 배경 이미지, 키보드 크기, 키 테두리 라운드 여부, 키 텍스트 색상 등
구현 케이스
- [CASE-1] 이미지 사용
- [CASE-2] 이미지 미사용
1) 테마 사용 : SmartKeyboard에 기본적으로 제공되는 테마를 적용 (이미지를 사용한 테마와 속성을 변경하여 제작한 테마가 있음)
2) 속성 변경 : Keyboard의 키 색상, 키 텍스트 색상 등을 직접 변경
SmartKeyboard
형태 [CASE-1] 이미지 사용
[CASE-2] 이미지 미사용
[테마 사용]

[속성 변경]
키 구성
한글, 영문(대/소문자), 숫자, 각종 기호
형태 /
Layout
배치 변경 불가
변경 가능 요소
키 이미지, 키보드 배경 이미지, 키보드 크기, 키 테두리 라운드 여부, 키 텍스트 색상 등
구현 케이스
- [CASE-1] 이미지 사용
- [CASE-2] 이미지 미사용
1) 테마 사용 : SmartKeyboard에 기본적으로 제공되는 테마를 적용 (이미지를 사용한 테마와 속성을 변경하여 제작한 테마가 있음)
2) 속성 변경 : Keyboard의 키 색상, 키 텍스트 색상 등을 직접 변경

[CASE-1] 이미지를 사용하는 경우
STEP-1 필요한 이미지 요소
SmartKeyboard의 한/영 표준 키보드에 사용되는 공통 키는 세 가지 크기로 나뉩니다. 세 가지의 키를 UP 상태의 이미지와 Down 상태의 이미지를 각각 제작해야 하며 해당 이미지는 공통적으로 모든 키에 사용되기 때문에 이미지에 키 텍스트를 포함하지 않아야 합니다.
키 상태 UP DOWN
적용
이미지
속성 KeyUp
Image1		 KeyUp
Image2		 KeyUp
Image3		 KeyPress
Image1		 KeyPress
Image2		 KeyPress
Image3
적용
리소스명		 Resource1.
UpImage1		 Resource1.
UpImage2		 Resource1.
UpImage3		 Resource1.
DownImage1		 Resource1.
DownImage2		 Resource1.
DownImage3
필요
이미지 개수		 총 6개

주의 제작 시 반드시 마스킹 영역을 포함해야 합니다. 마스킹 관련된 자세한 정보는 “자료실→ SmartX Framework 관련 → SmartX Framework Reference Guide → Part 2. 사용자 인터페이스(UI) 컴포넌트 → 1. 사용자 인터페이스(UI) 공통사항 및 장점 → 3) 이미지 관련 주의사항 → 3-3) 투명(Masking) 처리 영역 제작 가이드” 내용을 참고하시기 바랍니다.

STEP-2 ThemeStyle 속성값을 CUSTOMIZED_SKIN으로 설정 후 키보드 이미지 적용 및 디자인
이미지를 적용하기 전 ThemeStyle 속성값을 반드시 CUSTOMIZED_SKIN으로 설정해야 합니다.
- KeyUpImage1/KeyPressImage1 : 1x1 사이즈의 일반 키
- KeyUpImage2/KeyPressImage2 : 2x1 사이즈의 Enter 키
- KeyUpImage3/KeyPressImage3 : 4x1 사이즈의 SpaceBar 키
각 속성에 맞는 이미지를 알맞게 적용 후 세부적인 디자인(Key Text 색상/크기, Top/Left Margin 등)을 적용합니다.

// 키보드 타입을 일반으로 설정
smartKeyboard1.KeyboardType = SmartX.SmartKeyboard.KEYBOARDTYPES.NORMAL;
// 키보드 크기 설정
smartKeyboard1.Size = new Size(623, 243);
// 키보드에 이미지를 적용하기 위해 Theme Style을 CUSTOMIZED_SKIN으로 설정
smartKeyboard1.ThemeStyle = SmartX.SmartKeyboard.KEYBOARDTHEMESTYLE.CUSTOMIZED_SKIN;
// Up 상태의 이미지 설정
smartKeyboard1.KeyUpImage1 = Resource1.UpImage1;
smartKeyboard1.KeyUpImage2 = Resource1.UpImage2;
smartKeyboard1.KeyUpImage3 = Resource1.UpImage3;
// Down 상태의 이미지 설정
smartKeyboard1.KeyPressImage1 = Resource1.DownImage1;
smartKeyboard1.KeyPressImage2 = Resource1. DownImage2;
smartKeyboard1.KeyPressImage3 = Resource1. DownImage3;
// Up 상태의 폰트 컬러
smartKeyboard1.KeyTextColor = Color.MidnightBlue;
// Down 상태의 폰트 컬러
smartKeyboard1.KeyPressTextColor = Color.White;


[적용 완료 모습]


[CASE-2] 이미지 미적용 1) 테마 사용

SmartKeyboard는 Keyboard의 스타일을 변경할 수 있는 18가지의 테마를 제공하고 있습니다. 테마에는 이미지를 사용한 테마와 사용하지 않은 테마로 나뉩니다. ThemeStyle 속성으로 적용할 테마를 설정하여 스타일을 간단하게 변경할 수 있습니다.

참고ThemeStyle 속성값에 따른 SmartKeyboard의 스타일은 “자료실 → SmartX Framework 관련 → SmartX Framework Reference Guide → Part 2. 사용자 인터페이스(UI) 컴포넌트 → 13. SmartKeyboard” 내용을 확인하시기 바랍니다.

// 키보드 타입을 일반으로 설정
smartKeyboard2.KeyboardType = SmartX.SmartKeyboard.KEYBOARDTYPES.NORMAL;
// 키보드 크기 설정
smartKeyboard2.Size = new Size(623, 243);
// 키보드의 테마 설정
smartKeyboard2.ThemeStyle = SmartX.SmartKeyboard.KEYBOARDTHEMESTYLE.COOLBLUE_SKIN;


[적용 완료 모습]


2) 속성 변경

SmartKeyboard의 ThemeStyle 속성값을 CUSTOMIZED_LITE로 설정 후 속성창에서 원하는 키의 디자인을 디자인 관련 속성값 변경을 통해 적용합니다.

참고SmartKeyboard의 변경 가능한 디자인 관련 속성은 “자료실 → SmartX Framework 관련 → SmartX Framework Reference Guide → Part 2. 사용자 인터페이스(UI) 컴포넌트 → 13. SmartKeyboard” 내용을 확인하시기 바랍니다.

// 키보드 타입을 일반으로 설정
smartKeyboard3.KeyboardType = SmartX.SmartKeyboard.KEYBOARDTYPES.NORMAL;
// 키보드 크기 설정
smartKeyboard3.Size = new Size(623, 243);
// 키보드의 속성을 변경하여 디자인하기 위해 ThemeStyle을 CUSTOMIZED_LITE로 설정
smartKeyboard3.ThemeStyle = SmartX.SmartKeyboard.KEYBOARDTHEMESTYLE.CUSTOMIZED_LITE;
// 키보드의 외곽선 굵기
smartKeyboard3.KeyOutLineWidth = 2;

// Up 상태의 폰트 컬러
smartKeyboard3.KeyTextColor = Color.MidnightBlue;
// Up 상태의 키 배경 색
smartKeyboard3.KeyFillColor = Color.SkyBlue;
// Up 상태의 외곽선 색
smartKeyboard3.KeyOutLineColor = Color.DarkGray;

// Down 상태의 폰트 컬러
smartKeyboard3.KeyPressTextColor = Color.SkyBlue;
// Down 상태의 키 배경 색
smartKeyboard3.KeyPressFillColor = Color.MidnightBlue;
// Down 상태의 외곽선 색
smartKeyboard3.KeyPressOutLineColor = Color.DarkGray;


[적용 완료 모습]


[TYPE-2] 숫자 입력 표준 키보드(Numerical Type)
SmartKeyboard
형태 [CASE-1] 이미지 사용
[CASE-2] 이미지 미사용
[테마 사용]

[속성 변경]
키 구성
숫자 키
형태 / Layout
배치 변경 불가
변경 가능 요소
키 이미지, 키보드 배경 이미지, 키보드 크기, 키 텍스트 색상
구현 케이스
- [CASE-1] 이미지 사용
- [CASE-2] 이미지 미사용
1) 테마 사용 : 제공되는 Keyboard의 테마를 적용(이미지를 사용한 테마와 속성을 변경하여 제작한 테마가 있음)
2) 속성 변경 : Keyboard의 키 색상, 키 텍스트 색상 등을 직접 변경
SmartKeyboard
형태 [CASE-1] 이미지 사용
[CASE-2] 이미지 미사용
[테마 사용]

[속성 변경]
키 구성
숫자 키
형태 /
Layout
배치 변경 불가
변경 가능 요소
키 이미지, 키보드 배경 이미지, 키보드 크기, 키 텍스트 색상
구현 케이스
- [CASE-1] 이미지 사용
- [CASE-2] 이미지 미사용
1) 테마 사용 : 제공되는 Keyboard의 테마를 적용(이미지를 사용한 테마와 속성을 변경하여 제작한 테마가 있음)
2) 속성 변경 : Keyboard의 키 색상, 키 텍스트 색상 등을 직접 변경

[CASE-1] 이미지를 사용하는 경우
STEP-1 필요한 이미지 요소
SmartKeyboard의 숫자 입력 표준 키보드에 사용되는 공통 키는 두 가지 크기로 나뉩니다. 두 가지의 키를 UP 상태의 이미지와 Down 상태의 이미지를 각각 제작해야 합니다. 해당 이미지는 공통적으로 모든 키에 사용되기 때문에 이미지에 키 텍스트를 포함하지 않아야 합니다.
키 상태 UP DOWN
적용
이미지
속성 KeyUpImage1 KeyUpImage2 KeyPressImage1 KeyPressImage2
적용
리소스명		 Resource1.UpImage1 Resource1.UpImage2 Resource1.DownImage1 Resource1.DownImage2
필요
이미지 개수		 총 4개

주의KeyImage 제작 시 반드시 마스킹 영역을 포함해야 합니다. 마스킹 관련 자세한 정보는 “자료실→ SmartX Framework 관련 → SmartX Framework Reference Guide → Part 2. 사용자 인터페이스(UI) 컴포넌트 → 1. 사용자 인터페이스(UI) 공통사항 및 장점 → 3) 이미지 관련 주의사항 → 3-3) 투명(Masking) 처리 영역 제작 가이드” 내용을 참고하시기 바랍니다.

STEP-2 SmartKeyboard의 ThemeStyle 속성값을 CUSTOMIZED_SKIN으로 설정 후 키보드 이미지 적용
이미지를 적용하기 전 ThemeStyle 속성값을 반드시 CUSTOMIZED_SKIN으로 설정해야 합니다.
- KeyUpImage1/KeyPressImage1 : 1x1 사이즈의 일반 키
- KeyUpImage2/KeyPressImage2 : 2x1 사이즈의 Enter 키
각 속성에 맞는 이미지를 알맞게 적용 후 세부적인 디자인(Key Text 색상/크기, Top/Left Margin 등)을 적용합니다.

// 키보드 타입을 Numerical으로 설정
 smartKeyboard1.KeyboardType = SmartX.SmartKeyboard.KEYBOARDTYPES.NUMERICAL;
// 키보드 크기 설정
smartKeyboard1.Size = new Size(249, 249);
// 키보드에 이미지를 적용하기 위해 Theme Style을 CUSTOMIZED_SKIN으로 설정
smartKeyboard1.ThemeStyle = SmartX.SmartKeyboard.KEYBOARDTHEMESTYLE.CUSTOMIZED_SKIN;
// Up 상태의 이미지 설정
smartKeyboard1.KeyUpImage1 = Resource1.UpImage1;
smartKeyboard1.KeyUpImage2 = Resource1.UpImage2;
// Down 상태의 이미지 설정
smartKeyboard1.KeyPressImage1 = Resource1.DownImage1;
smartKeyboard1.KeyPressImage2 = Resource1.DownImage2;
// 배경 이미지 설정
smartKeyboard1.KeyBoardBackImage = Resource1.BackImage;
// Up 상태의 폰트 컬러
smartKeyboard1.KeyTextColor = Color.White;
// Down 상태의 폰트 컬러
smartKeyboard1.KeyPressTextColor = Color.White;


[적용 완료 모습]


[CASE-2] 이미지 미적용 1) 테마 사용

SmartKeyboard는 Keyboard의 스타일을 변경할 수 있는 18가지의 테마를 제공하고 있습니다. ThemeStyle 속성으로 적용할 테마를 설정하여 스타일을 간단하게 변경할 수 있습니다.

참고ThemeStyle 속성값에 따른 SmartKeyboard의 스타일은 “자료실 → SmartX Framework 관련 → SmartX Framework Reference Guide → Part 2. 사용자 인터페이스(UI) 컴포넌트 → 13. SmartKeyboard” 내용을 확인하시기 바랍니다.

// 키보드 타입을 Numerical으로 설정
smartKeyboard2.KeyboardType = SmartX.SmartKeyboard.KEYBOARDTYPES.NUMERICAL;
// 키보드 크기 설정
smartKeyboard2.Size = new Size(249, 249);
// 키보드의 테마 설정
smartKeyboard2.ThemeStyle = SmartX.SmartKeyboard.KEYBOARDTHEMESTYLE.COOLBLUE_SKIN;


[적용 완료 모습]


2) 속성 변경

SmartKeyboard의 속성창에서 원하는 키의 디자인을 디자인 관련 속성값 변경을 통해 적용합니다.

참고SmartKeyboard의 변경 가능한 디자인 관련 속성은 “자료실 → SmartX Framework 관련 → SmartX Framework Reference Guide → Part 2. 사용자 인터페이스(UI) 컴포넌트 → 13. SmartKeyboard” 내용을 확인하시기 바랍니다.

// 키보드 타입을 Numerical으로 설정
smartKeyboard3.KeyboardType = SmartX.SmartKeyboard.KEYBOARDTYPES.NUMERICAL;
// 키보드 크기 설정
smartKeyboard3.Size = new Size(245, 246);
// 키보드의 속성을 변경하여 디자인하기 위해 ThemeStyle을 CUSTOMIZED_LITE로 설정
smartKeyboard3.ThemeStyle = SmartX.SmartKeyboard.KEYBOARDTHEMESTYLE.CUSTOMIZED_LITE;
// 배경 이미지 설정
smartKeyboard1.KeyBoardBackImage = Resource1.BackImage;
// 키보드의 외곽선 굵기
smartKeyboard3.KeyOutLineWidth = 1;

// Up 상태의 폰트 컬러
smartKeyboard3.KeyTextColor = Color.White;
// Up 상태의 키 배경 색
smartKeyboard3.KeyFillColor = Color.DarkOrange;
// Up 상태의 외곽선 색
smartKeyboard3.KeyOutLineColor = Color.Black;

// Down 상태의 폰트 컬러
smartKeyboard3.KeyPressTextColor = Color.SaddleBrown;
// Down 상태의 키 배경 색
smartKeyboard3.KeyPressFillColor = Color.White;
// Down 상태의 외곽선 색
smartKeyboard3.KeyPressOutLineColor = Color.Black;


[적용 완료 모습]


2. SmartKeyPad 활용 [TYPE-3] 한/영 사용자 정의 키보드(Code를 사용한 설정)
SmartKeyPad
형태

  • [Layer0] 한글 기본

  • [Layer1] 한글 된소리

  • [Layer2] 영문 소문자

  • [Layer3] 영문 대문자

  • [Layer4] 숫자 및 기호
키 구성
한글/영문/숫자/각종 기호
형태 / Layout
키 구성 및 위치 변경 가능
변경 가능 요소
모두 가능
구현 케이스
모든 키의 이미지를 제작하여 SetKetInfoAdd 메서드를 사용하여 KeyItem을 추가합니다.
SmartKeyPad
형태

  • [Layer0] 한글 기본

  • [Layer1] 한글 된소리

  • [Layer2] 영문 소문자

  • [Layer3] 영문 대문자

  • [Layer4] 숫자 및 기호
키 구성
한글/영문/숫자/각종 기호
형태 /
Layout
키 구성 및 위치 변경 가능
변경 가능 요소
모두 가능
구현 케이스
모든 키의 이미지를 제작하여 SetKetInfoAdd 메서드를 사용하여 KeyItem을 추가합니다.

모든 키의 이미지를 제작하여 Code를 사용해 설정
STEP-1 필요한 이미지 요소
SmartKeyPad를 통해 모든 키의 이미지를 사용하는 경우 키 텍스트를 포함하여 필요한 모든 키 이미지를 제작 해야합니다.
키 상태 필요 이미지 필요 이미지
개수
UP
상태		 ... 246개
적용
리소스명		 Resource1.
Upkey_ㄱ		 Resource1.
Upkey_ㄴ		 Resource1.
Upkey_ㄷ		 Resource1.
Upkey_space
Down
상태		 ...
적용
리소스명		 Resource1.
Downkey_ㄱ		 Resource1.
Downkey_ㄴ		 Resource1.
Downkey_ㄷ		 Resource1.
Downkey_space

STEP-2 Key Text 출력 비활성화
Key Text를 포함하여 키 이미지를 제작하기 때문에 KeyTextVisible 속성을 false값으로 설정하여 키패드에 보여질 Key Text를 숨깁니다.
참고SmartKeyPad의 KeyTextVisible 속성의 자세한 설명은 “자료실 → SmartX Framework 관련 → SmartX Framework Reference Guide → Part 2. 사용자 인터페이스(UI) 컴포넌트 → 14. SmartKeyPad” 내용을 확인하시기 바랍니다.

smartKeyPad1.KeyTextVisible = false;


STEP-3 레이어별 구성될 키 정보 추가
SetKeyInfoAdd 메소드를 호출하여 각 키의 위치와 사용할 이미지, 키를 정의합니다. 반드시 제작한 키 이미지에 맞는 KeyCode를 정의하시기 바랍니다.
참고SmaetKeyPad의 SetKeyInfoAdd 메소드의 자세한 설명은 "자료실 – SmartX Framework 관련 – SmartX Framework 프로그래밍 가이드 – SmartKeyPad"를 참고하시기 바랍니다.

참고자세한 설명은 첨부된 예제 소스 코드를 확인하시기 바랍니다.
private void Form1_Load(object sender, EventArgs e)
{
// 현재 Form을 MainForm으로 설정합니다.
smartForm1.MainForm = this;
// Key Text를 포함한 이미지 사용하므로 Key Text를 미출력
smartKeyPad1.KeyTextVisible = false;
// 타겟 Label 설정
smartKeyPad1.TargetInputObject = labTarget1;

// Layer 0 : 한글 기본
smartKeyPad1.SetKeyInfoAdd(0, 0, 0, Resource1.Upkey_ㅂ, Resource1.Downkey_ㅂ, SmartX.SmartKeyPad_KeyItemInfos.KeyCode.ㅂ);
smartKeyPad1.SetKeyInfoAdd(58, 0, Resource1.Upkey_ㅈ, Resource1.Downkey_ㅈ, SmartX.SmartKeyPad_KeyItemInfos.KeyCode.ㅈ);
// 중략
smartKeyPad1.SetKeyInfoAdd(174, 197, Resource1.Upkey_space, Resource1.Downkey_space, SmartX.SmartKeyPad_KeyItemInfos.KeyCode.SpaceBar);
smartKeyPad1.SetKeyInfoAdd(493, 197, Resource1.Upkey_enter, Resource1.Downkey_enter, SmartX.SmartKeyPad_KeyItemInfos.KeyCode.Enter);

smartKeyPad1.Visible = true;
}

private void smartKeyPad1_OnKeyButtonUp(string strKeyText, int iLayer, object sender)
{
if (iLayer == 0)
{
if (strKeyText == "shift")
{
smartKeyPad1.LayerChange(1);
}
else if (strKeyText == "한영")
{
smartKeyPad1.LayerChange(2);
}
else if (strKeyText == ";12")
{
smartKeyPad1.LayerChange(4);
}
}
// 중략
else if (iLayer == 4)
{
if (strKeyText == "한영")
{
smartKeyPad1.LayerChange(0);
}
}
}


[적용 완료 모습]


[TYPE-4] 숫자(16진수) 입력 사용자 정의 키보드(KeyItemInfos를 사용한 설정)
SmartKeyPad
형태
키 구성
16진수 Key배열 / Backspace / 초기화
형태 / Layout
키 구성 및 위치 변경 가능
변경 가능 요소
모두 가능
구현 케이스
모든 키의 이미지를 제작하여 폼디자이너 창에서 SmartKeyPad_KeyItemInfos에 KeyItem을 추가합니다.
(폼 디자이너창에서 추가된 KeyItem을 확인할 수 있습니다.)
SmartKeyPad
형태
키 구성
16진수 Key배열 / Backspace / 초기화
형태 /
Layout
키 구성 및 위치 변경 가능
변경 가능 요소
모두 가능
구현 케이스
모든 키의 이미지를 제작하여 폼디자이너 창에서 SmartKeyPad_KeyItemInfos에 KeyItem을 추가합니다.
(폼 디자이너창에서 추가된 KeyItem을 확인할 수 있습니다.)

모든 키의 이미지를 제작하여 KeyItemInfos에 설정
STEP-1 필요한 이미지 요소
SmartKeyPad를 통해 최소의 이미지를 사용하는 경우 키 텍스트를 포함하지 않은 공통으로 사용되는 이미지를 제작하셔야 합니다.
키 상태 필요 이미지 필요 이미지
개수
UP
상태		 ... 36개
적용
리소스명		 Resource1.
Upkey_A		 Resource1.
Upkey_B		 Resource1.
Upkey_C		 Resource1.
Upkey_clear
Down
상태		 ...
적용
리소스명		 Resource1.
Downkey_A		 Resource1.
Downkey_B		 Resource1.
Downkey_C		 Resource1.
Downkey_clear

STEP-2 Key Text 출력 비활성화
Key Text를 포함하여 키 이미지를 제작하기 때문에 KeyTextVisible 속성을 false값으로 설정하여 키패드에 보여질 Key Text를 숨깁니다.
참고SmartKeyPad의 KeyTextVisible 속성의 자세한 설명은 “자료실 → SmartX Framework 관련 → SmartX Framework Reference Guide → Part 2. 사용자 인터페이스(UI) 컴포넌트 → 14. SmartKeyPad” 내용을 확인하시기 바랍니다.

smartKeyPad1.KeyTextVisible = true;


STEP-3 레이어별 구성될 키 정보 추가
폼 디자이너 창에서 SmartKeyPad_KeyItemInfos를 추가한 뒤 KeyItems 컬렉션에 키를 정의합니다.
(※ SmartKeyPad의 KeyItems 속성에 반드시 SmartKeyPad_KeyItemInfos를 설정하시기 바랍니다.)
참고SmartKeyPad_KeyItemInfos를 사용한 KeyItem 추가 방법은 “자료실 → SmartX Framework 관련 → SmartX Framework Reference Guide → Part 2. 사용자 인터페이스(UI) 컴포넌트 → 14. SmartKeyPad” 내용을 확인하시기 바랍니다.

[SmartKeyPad_KeyItemInfos에 추가된 키 정의]


참고자세한 설명은 첨부된 예제 소스 코드를 확인하시기 바랍니다.
private void Form1_Load(object sender, EventArgs e)
{
// 현재 Form을 MainForm으로 설정합니다.
smartForm1.MainForm = this;
// Key Text를 포함한 이미지를 사용하므로 Key Text를 미출력
smartKeyPad2.KeyTextVisible = false;
// 타겟 Label 설정
smartKeyPad2.TargetInputObject = labTarget1;
}

private void smartKeyPad2_OnKeyButtonUp(string strKeyText, int iLayer, object sender)
{
if (strKeyText == "AC")
{
labTarget1.Text = "";
}
}


[적용 완료 모습]


[TYPE-5] 영문자 전용 사용자 정의 키보드(공용 KeyImage 사용)
SmartKeyPad
형태 [CASE-1] 모든 키의 이미지 제작(Key Text 포함)
[영어 대문자]

[숫자/기호]
키 구성
영문 대문자, 숫자/기호
형태 / Layout
키 구성 및 위치 변경 가능
변경 가능 요소
모두 가능
구현 케이스
공용 키의 이미지를 제작하여 폼디자이너 창에서 SmartKeyPad_KeyItemInfos에 KeyItem을 추가합니다.
(폼 디자이너창에서 추가된 KeyItem을 확인할 수 있습니다.)
SmartKeyPad
형태 [CASE-1] 모든 키의 이미지 제작(Key Text 포함)
[영어 대문자]

[숫자/기호]
키 구성
영문 대문자, 숫자/기호
형태 /
Layout
키 구성 및 위치 변경 가능
변경 가능 요소
모두 가능
구현 케이스
공용 키의 이미지를 제작하여 폼디자이너 창에서 SmartKeyPad_KeyItemInfos에 KeyItem을 추가합니다.
(폼 디자이너창에서 추가된 KeyItem을 확인할 수 있습니다.)

공용 키 이미지를 제작하여 KeyItemInfos에 설정
STEP-1 필요한 이미지 요소
SmartKeyPad를 통해 공용 키 이미지를 사용하는 경우 키 텍스트를 포함하지 않은 공통으로 사용되는 이미지를 제작하셔야 합니다.
키 상태 필요 이미지 필요 이미지
개수
UP
상태		 4개
적용
리소스명		 Resource1.
Upkey_normal1		 Resource1.
Upkey_normal2
Down
상태
적용
리소스명		 Resource1.
Downkey_normal1		 Resource1.
Downkey_normal2

STEP-2 Key Text 출력 활성화
Key Text를 포함하지 않고 키 이미지를 제작하기 때문에 KeyTextVisible 속성을 true값으로 설정하여 키패드에 보여질 Key Text를 출력합니다.
참고SmartKeyPad의 KeyTextVisible 속성의 자세한 설명은 “자료실 → SmartX Framework 관련 → SmartX Framework Reference Guide → Part 2. 사용자 인터페이스(UI) 컴포넌트 → 14. SmartKeyPad” 내용을 확인하시기 바랍니다.

smartKeyPad1.KeyTextVisible = true;


STEP-3 레이어별 구성될 키 정보 추가
폼 디자이너 창에서 SmartKeyPad_KeyItemInfos를 추가한 뒤 KeyItems 컬렉션에 키를 정의합니다.
(※ SmartKeyPad의 KeyItems 속성에 반드시 SmartKeyPad_KeyItemInfos를 설정하시기 바랍니다.)
참고SmartKeyPad_KeyItemInfos를 사용한 KeyItem 추가 방법은 “자료실 → SmartX Framework 관련 → SmartX Framework Reference Guide → Part 2. 사용자 인터페이스(UI) 컴포넌트 → 14. SmartKeyPad” 내용을 확인하시기 바랍니다.

1) KeyDownImageCommon, KeyUpImageCommon 속성에 공용 키 이미지를 설정
2) SmartKeyPad_KeyItemInfos에 공용 키 이미지를 사용하는 Key의 경우 이미지 정의 생략

참고자세한 설명은 첨부된 예제 소스 코드를 확인하시기 바랍니다.
private void Form1_Load(object sender, EventArgs e)
{
// 현재 Form을 MainForm으로 설정합니다.
smartForm1.MainForm = this;
// Key Text를 포함하지 않은 이미지를 사용하므로 Key Text를 출력
smartKeyPad2.KeyTextVisible = true;
// 타겟 Label 설정
smartKeyPad2.TargetInputObject = labTarget1;

// 공용 키 이미지를 설정 - 폼 디자이너의 설정창에서 설정하거나 아래와 같이 코드로 설정합니다.
smartKeyPad2.KeyDownImageCommon = Resource1.DownKey_normal1;
smartKeyPad2.KeyUpImageCommon = Resource1.UpKey_normal1;
}

// 키를 눌렀다가 떼었을 때 발생되는 이벤트 : ";12"키 혹은 "영어"키를 클릭 레이어 변경
private void smartKeyPad2_OnKeyButtonUp(string strKeyText, int iLayer, object sender)
{
if (iLayer == 0)
{
if (strKeyText == ";12")
{
smartKeyPad2.LayerChange(1);
}
}
else if (iLayer == 1)
{
if (strKeyText == "영어")
{
smartKeyPad2.LayerChange(0);
}
}
}


[적용 완료 모습]


참고항목
SmartKeyboard

자료실 > SmartX Framework 관련 > Reference Guide > Part 2. 사용자 인터페이스(UI) 컴포넌트 > 13. SmartKeyboard

 SmartKeyPad

자료실 > SmartX Framework 관련 > Reference Guide > Part 2. 사용자 인터페이스(UI) 컴포넌트 > 14. SmartKeyPad
맨 위로
팝업닫기

(주)에이치앤에스('http://hnsts.co.kr/'이하 '(주)에이치앤에스 웹사이트')는 개인정보보호법에 따라 이용자의 개인정보 보호 및 권익을 보호하고 개인정보와 관련한 이용자의 고충을 원활하게 처리할 수 있도록 다음과 같은 처리방침을 두고 있습니다.

(주)에이치앤에스 웹사이트는 개인정보처리방침을 개정하는 경우 웹사이트 공지사항(또는 개별공지)을 통하여 공지할 것입니다.

○ 본 방침은 2011년 4월 1일부터 시행됩니다.

1. 개인정보의 처리 목적 (주)에이치앤에스 웹사이트는 개인정보를 다음의 목적을 위해 처리합니다. 처리한 개인정보는 다음의 목적 이외의 용도로는
사용되지 않으며 이용 목적이 변경될 시에는 사전동의를 구할 예정 입니다.
가. 민원사무 처리
민원인의 신원 확인, 민원사항 확인, 사실조사를 위한 연락 · 통지, 처리결과 통보 등을 목적으로 개인정보를 처리합니다.
2. 개인정보 파일 현황
1. 개인정보 파일명 : 고객의 소리
  • - 개인정보 항목 : 이메일, 휴대전화번호, 자택전화번호, 이름, 서비스 이용 기록, 접속 로그, 쿠키, 접속 IP 정보
  • - 수집방법 : 웹사이트
  • - 보유근거 : 이용자 동의
  • - 보유기간 : 3년
3. 개인정보의 제3자 제공에 관한 사항
① (주)에이치앤에스 웹사이트는 원칙적으로 이용자의 개인정보를 제1조에서 명시한 목적 범위 내에서 처리하며, 본래의 범위를 초과하여 처리하거나 제3자에게 제공하지 않습니다.
다만, 다음의 경우에는 개인정보를 제3자에게 제공할 수 있습니다.
  • – 이용자가 사전에 제3자 제공 및 공개에 동의한 경우
  • – 법령 등에 의해 제공이 요구되는 경우
  • – 서비스의 제공에 관한 계약의 이행을 위하여 필요한 개인정보로서 경제적/기술적인 사유로 통상의 동의를 받는 것이 현저히 곤란한 경우
  • – 개인을 식별하기에 특정할 수 없는 상태로 가공하여 이용하는 경우
4. 정보주체의 권리,의무 및 그 행사방법 이용자는 개인정보주체로서 다음과 같은 권리를 행사할 수 있습니다.
① 정보주체는 (주)에이치앤에스 웹사이트에 대해 언제든지 다음 각 호의 개인정보 보호 관련 권리를 행사할 수 있습니다.
  • 1. 개인정보 열람요구
  • 2. 오류 등이 있을 경우 정정 요구
  • 3. 삭제요구
  • 4. 처리정지 요구
② 제1항에 따른 권리 행사는 (주)에이치앤에스 웹사이트에 대해 개인정보 보호법 시행규칙 별지 제8호 서식에 따라 서면, 전자우편, 모사전송(FAX) 등을 통하여 하실 수 있으며 (주)에이치앤에스 웹사이트는
이에 대해 지체 없이 조치하겠습니다.
③ 정보주체가 개인정보의 오류 등에 대한 정정 또는 삭제를 요구한 경우에는 (주)에이치앤에스 웹사이트는 정정 또는 삭제를 완료할 때까지 당해 개인정보를 이용하거나 제공하지 않습니다.
④ 제1항에 따른 권리 행사는 정보주체의 법정대리인이나 위임을 받은 자 등 대리인을 통하여 하실 수 있습니다. 이 경우 개인정보 보호법 시행규칙 별지 제11호 서식에 따른 위임장을
제출하셔야 합니다.
5. 제3자에게의 개인정보 제공
① (주)에이치앤에스 웹사이트는 다음의 개인정보 항목을 처리하고 있습니다.
<민원사무 처리>
– 필수항목 : 이름, 휴대전화번호, 자택전화번호, 이메일, 서비스 이용 기록, 접속로그, 쿠키, 접속IP 정보
6. 개인정보의 파기
(주)에이치앤에스 웹사이트는 원칙적으로 개인정보 처리목적이 달성된 경우에는 지체없이 해당 개인정보를 파기합니다. 파기의 절차, 기한 및 방법은 다음과 같습니다.
  • –파기절차 이용자가 입력한 정보는 목적 달성 후 별도의 DB에 옮겨져(종이의 경우 별도의 서류) 내부 방침 및 기타 관련 법령에 따라 일정기간 저장된 후 혹은 즉시 파기됩니다. 이 때, DB로 옮겨진 개인정보는 법률에 의한 경우가 아니고서는 다른 목적으로 이용되지 않습니다.-파기기한이용자의 개인정보는 개인정보의 보유기간이 경과된 경우에는 보유기간의 종료일로부터 5일 이내에, 개인정보의 처리 목적 달성, 해당 서비스의 폐지, 사업의 종료 등 그 개인정보가 불필요하게 되었을 때에는 개인정보의 처리가 불필요한 것으로 인정되는 날로부터 5일 이내에 그 개인정보를 파기합니다.
  • –파기방법 전자적 파일 형태의 정보는 기록을 재생할 수 없는 기술적 방법을 사용합니다. 종이에 출력된 개인정보는 분쇄기로 분쇄하거나 소각을 통하여 파기합니다.
7. 개인정보의 안전성 확보 조치
(주)에이치앤에스 웹사이트는 개인정보보호법 제29조에 따라 다음과 같이 안전성 확보에 필요한 기술적/관리적 및 물리적 조치를 하고 있습니다.
1. 정기적인 자체 감사 실시
개인정보 취급 관련 안정성 확보를 위해 정기적(분기 1회)으로 자체 감사를 실시하고 있습니다.
2. 개인정보 취급 직원의 최소화 및 교육
개인정보를 취급하는 직원을 지정하고 담당자에 한정시켜 최소화 하여 개인정보를 관리하는 대책을 시행하고 있습니다.
3. 내부관리계획의 수립 및 시행
개인정보의 안전한 처리를 위하여 내부관리계획을 수립하고 시행하고 있습니다.
4. 해킹 등에 대비한 기술적 대책
(주)에이치앤에스 웹사이트는 해킹이나 컴퓨터 바이러스 등에 의한 개인정보 유출 및 훼손을 막기 위하여 보안프로그램을 설치하고 주기적인 갱신·점검을 하며 외부로부터 접근이 통제된 구역에
시스템을 설치하고 기술적/물리적으로 감시 및 차단하고 있습니다.
5. 개인정보의 암호화
이용자의 개인정보는 비밀번호는 암호화 되어 저장 및 관리되고 있어, 본인만이 알 수 있으며 중요한 데이터는 파일 및 전송 데이터를 암호화 하거나 파일 잠금 기능을 사용하는 등의
별도 보안기능을 사용하고 있습니다.
6. 접속기록의 보관 및 위변조 방지
개인정보처리시스템에 접속한 기록을 최소 6개월 이상 보관, 관리하고 있으며, 접속 기록이 위변조 및 도난, 분실되지 않도록 보안기능 사용하고 있습니다.
7. 개인정보에 대한 접근 제한
개인정보를 처리하는 데이터베이스시스템에 대한 접근권한의 부여,변경,말소를 통하여 개인정보에 대한 접근통제를 위하여 필요한 조치를 하고 있으며 침입차단시스템을 이용하여
외부로부터의 무단 접근을 통제하고 있습니다.
8. 문서보안을 위한 잠금장치 사용
개인정보가 포함된 서류, 보조저장매체 등을 잠금장치가 있는 안전한 장소에 보관하고 있습니다.
9. 비인가자에 대한 출입 통제
개인정보를 보관하고 있는 물리적 보관 장소를 별도로 두고 이에 대해 출입통제 절차를 수립, 운영하고 있습니다.
8. 개인정보 보호책임자 작성
① (주)에이치앤에스 웹사이트는 개인정보 처리에 관한 업무를 총괄해서 책임지고, 개인정보 처리와 관련한 정보주체의 불만처리 및 피해구제 등을 위하여 아래와 같이 개인정보 보호책임자를
지정하고 있습니다.
▶ 개인정보 보호책임자
성명 : 김진효
소속 : (주)에이치앤에스
전화번호 : 02-6402-8001
이메일 : hns@hnsts.co.kr
② 정보주체께서는 (주)에이치앤에스 웹사이트의 서비스(또는 사업)을 이용하시면서 발생한 모든 개인정보 보호 관련 문의, 불만처리, 피해구제 등에 관한 사항을 개인정보 보호책임자 및
담당부서로 문의하실 수 있습니다. (주)에이치앤에스 웹사이트는 정보주체의 문의에 대해 지체 없이 답변 및 처리해드릴 것입니다.
9. 개인정보침해 구제방법
정보주체는 개인정보침해로부터 구제받고자 하는 경우 다음과 같은 기관에 도움을 요청할 수 있습니다.
▶ 개인정보 침해신고센터 (한국인터넷진흥원 운영)
– 소관업무 : 개인정보 침해사실 신고, 상담 신청
– 홈페이지 : privacy.kisa.or.kr
– 전화 : (국번없이) 118
– 주소 : (138-950) 서울시 송파구 중대로 135 한국인터넷진흥원 개인정보침해신고센터
▶ 개인정보 분쟁조정위원회 (한국인터넷진흥원 운영)
– 홈페이지 : privacy.kisa.or.kr
– 전화 : (국번없이) 118
– 주소 : (138-950) 서울시 송파구 중대로 135 한국인터넷진흥원 개인정보침해신고센터
10. 개인정보 처리방침 변경
① 이 개인정보처리방침은 시행일로부터 적용되며, 법령 및 방침에 따른 변경내용의 추가, 삭제 및 정정이 있는 경우에는 변경사항의 시행 7일 전부터 공지사항을 통하여 고지할
것입니다.
팝업닫기

본 웹사이트에 게시된 이메일 주소가 전자우편 수집 프로그램이나 그 밖의 기술적 장치를 이용하여 무단으로 수집되는 것을 거부하며, 이를 위반시 정보통신망법에 의해 형사처벌됨을 유념하시기 바랍니다.

게시일 : 2011.4.1