Embed Size (px)
Citation preview
8-3. 버튼천안천일고등학교 류빈
www.skyone.hs.kr
2
Contents
1. 가장 기본적인 위젯인 TextView 를 통해 위젯의
일반적인 특징과 프로그래밍 방법을 상세하게
연구해보고 버튼의 사용 방법을 익힌다 .
학습목표
1. 리소스2. 텍스트 뷰3. 버튼
학습내용
3
8.3.1 버튼 – 나인 패치
Button 은 일반적인 푸쉬 버튼을 표현하며 손가락으로 눌러 명령을 내린다 .
버튼은 문자열과 배경으로 구성되어진다 .
문자열 : 내용 , 크기 , 색상 등을 선택 할 수 있다 .
배경 : background 속성으로 지정한다 .
다음 메서드로 코드에서 배경을 변경할 수 있는데 단색 , 드로블 , 드로블
리소스의 ID 를 전달 받는다 .
void setBackgroundColor (int color)
void setBackgroundDrawable (Drawable d)
void setBackgroundResource (int resid)
버튼의 배경으로 사용할 이미지를 drawable 폴더에 넣어두고 background
속성에 지정하면 이미지가 버튼의 배경에 나타나게 된다 .
4
8.3.1 버튼 – 나인 패치 - 예제
C08_noninepatch.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" ><Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/cloud" /><Button android:layout_width="200px" android:layout_height="100px" android:background="@drawable/cloud"/><Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ribbon" android:textSize="10pt" android:text="ribbon"/>
C08_noninepatch.xml
<Buttonandroid:layout_width="250px"android:layout_height="100px"android:background="@drawable/ribbon"android:textSize="10pt"android:text="ribbon"/></LinearLayout>
5
8.3.1 버튼 – 나인 패치
나인 패치 나인 패치는 아홉 조각의 천을 잘라 하나의 무늬를 만드는 이불 제작
기겁의 하나로 디지털 이미지에서 원리를 응용한 것이다 .
나인 패치 이미지는 PNG 포맷이며 .9.png 를 지정하여 일반적인
이미지와 구분한다 .
나인 패치는 이미지의 원래 모양 외에 바깥쪽에 1 픽셀 너비의 투명한
영역을 추가로 가지며 , 영역에 검정색 점을 찍어 확장 및 텍스트 배치
영역에 대한 정보를 기록한다 .
세로 내용물 영역세로 확장 영역
가로 확장 영역
가로 내용물 영역
6
8.3.1 버튼 – 나인 패치
안드로이드에 포함된 draw9patch 유틸리티 사용 . tools 디렉토리에
draw9patch.bat 파일을 실행하거나 tools/lib 폴더의 draw9patch.jar
파일을 바로 실행 .
7
8.3.1 버튼 – 나인 패치
바깥쪽 테두리 1px 에 점을 찍거나 지운다 .
8
8.3.1 버튼 – 나인 패치
마우스 왼쪽은 칠하게 되고 오른쪽은 지우게 된다 .
9
8.3.1 버튼 – 나인 패치
C08_ninepatch.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" ><Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/cloudpatch" /><Button android:layout_width="200px" android:layout_height="100px" android:background="@drawable/cloudpatch"/><Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/ribbonpatch" android:textSize="10pt" android:text="ribbon"/>
C08_ninepatch.xml
<Buttonandroid:layout_width="250px"android:layout_height="100px"android:background="@drawable/ribbonpatch"android:textSize="10pt"android:text="ribbon"/></LinearLayout>
10
8.3.2 화살표 버튼
public class Button extends TextView {public Button(Context context) {
this(context, null);}public Button(Context context, AttributeSet attrs) {
this(context, attrs, com.android.internal.R.attr.buttonStyle);}public Button(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);}}
안드로이드 표준 버튼은 처음은 회색 , 클릭하면 주황색 , 포커스가 있으면 빨간색 , 사용금지이면 회색
버튼은 스타일만 다른 텍스트 뷰이며 스타일은 결국 속성의 집합이므로
속성만 다른 텍스트 뷰이다 .
11
res/drawable/arrowback.xml
<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:state_window_focused="false" android:state_enabled="true"android:drawable="@drawable/arrow_normal" /><item android:state_window_focused="false" android:state_enabled="false" android:drawable="@drawable/arrow_disable" /><item android:state_pressed="true"android:drawable="@drawable/arrow_press" /><item android:state_focused="true" android:state_enabled="true"android:drawable="@drawable/arrow_focus" /><item android:state_enabled="true"android:drawable="@drawable/arrow_normal" /><item android:state_focused="true“android:drawable="@drawable/arrow_focus" /><itemandroid:drawable="@drawable/arrow_normal" /></selector>
속성 설명
state_active 활성 상태
state_checkable 체크 가능한 상태
state_checked 체크된 상태
state_enabled 사용 가능한 상태
state_focused 포커스를 받은 상태
state_pressed 눌려진 상태
state_selected 선택된 상태
state_window_focused
윈도우가 포커스를 가진 상태
8.3.2 화살표 버튼
12
c08_arrowbutton.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" ><Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/arrowback" android:text="Arrow Button" /><Button android:layout_width="150px" android:layout_height="70px" android:background="@drawable/arrowback" android:text="Arrow Button" /><Button android:layout_width="80px" android:layout_height="80px" android:background="@drawable/arrowback" android:text="Arrow Button" /></LinearLayout>
c08_arrowbutton.java
public class MainActivity extends Activity {public void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);}
public void mOnClick(View v) {switch (v.getId()) {case R.id.arrow1:Toast.makeText(this, "Arrow1 clicked", 0).show();break;case R.id.arrow2:Toast.makeText(this, "Arrow2 clicked", 0).show();break;case R.id.arrow3:Toast.makeText(this, "Arrow3 clicked", 0).show();break;}} }
8.3.2 화살표 버튼
13
8.3.3. 라디오 버튼
Button 으로부터 파생되는 서브 클래스들 .
CompoundButton 은 체크 , 언체크의 두 가지 상태를 가지며 , 코드에서 체크
상태를 변경 및 조사할 때는 다음 메서드를 사용한다 .
public void setChecked (boolean checked)
public void toggle ()
public boolean isChecked ()
Button
CompoundButton
CheckBox RadioButton ToggleButton
14
8.3.3. 라디오 버튼
15
8.3.3. 라디오 버튼
c08_radiocheck.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" ><CheckBox android:id="@+id/BigFont" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Use Big Font" /><RadioGroup android:id="@+id/ColorGroup" android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="vertical" android:checkedButton="@+id/Red" ><RadioButton android:id="@id/Red" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Red" /><RadioButton android:id="@+id/Green" android:layout_width="fill_parent"
c08_radiocheck.xml
android:layout_height="wrap_content" android:text="Green" /><RadioButton android:id="@+id/Blue" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Blue" /></RadioGroup><ToggleButton android:id="@+id/MyToggle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textColor="#ff0000" android:textOn=" 선택 " android:textOff=" 안선택 " android:textSize="20px" /></LinearLayout>
16
8.3.3. 라디오 버튼
c08_radiocheck.java
public class MainActivity extends Activity {private ToggleButton mTogBtn;public void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);
mTogBtn = (ToggleButton)findViewById(R.id.MyToggle);
RadioGroup ColGroup = (RadioGroup)findViewById(R.id.ColorGroup);ColGroup.setOnCheckedChangeListener(mRadioCheck);
CheckBox chkBig = (CheckBox)findViewById(R.id.BigFont);chkBig.setOnCheckedChangeListener(mCheckChange);}
RadioGroup.OnCheckedChangeListener mRadioCheck = new RadioGroup.OnCheckedChangeListener() {public void onCheckedChanged(RadioGroup group, int checkedId) {if (group.getId() == R.id.ColorGroup) {switch (checkedId) {case R.id.Red:mTogBtn.setTextColor(Color.RED);break;case R.id.Green:mTogBtn.setTextColor(Color.GREEN);break;case R.id.Blue:mTogBtn.setTextColor(Color.BLUE);break;}}}};
c08_radiocheck.java
CompoundButton.OnCheckedChangeListener mCheckChange = new CompoundButton.OnCheckedChangeListener() {public void onCheckedChanged (CompoundButton but-tonView, boolean isChecked) {if (buttonView.getId() == R.id.BigFont) {if (isChecked) {mTogBtn.setTextSize(40);} else {mTogBtn.setTextSize(20);}}}};}
17
8.3.4. 터치 필터링
버튼은 명령을 입력 받는 장치이며 누르는 즉시 게임 시작이나 옵션 변경 , 창닫기 등의 동작을 수행
탭재킹 (TabJacking) : 특정 버튼 위쪽에 토스트나 반투명한 대화상자 등을 띄워 사용자를 속이고 클릭을 유도하는 것 .( 웹의 클릭 재킹 (ClickJacking) 과 유사 .
터치 필터링 : 부정 클릭을 방지하기 위한 기능void setFilterTouchesWhenObscured (boolean enabled)boolean getFilterTouchesWhenObscured()
18
C08_faketoast.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/toastlayout" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" ><Button android:id="@+id/btnpurchase1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:onClick="mOnClick" android:text=" 최신형 노트북을 반값에 드립니다 .\n 다시 오지 않을 절호의 찬수 \n 이번 기회를 놓치지 마세요 \n 노트북을 받고 싶은 분은 \n 이 버튼을 눌러주세요 \n 감사합니다 ." /></LinearLayout>
C08_filtertouch.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" ><Button android:id="@+id/btnad" android:layout_width="wrap_content" android:layout_height="wrap_content" android:onClick="mOnClick" android:text=" 광고 보기 " /><Button android:id="@+id/btncard" android:layout_width="wrap_content" android:layout_height="wrap_content" android:onClick="mOnClick" android:filterTouchesWhenObscured="true" android:text=" 카드 결재 " /><Button android:id="@+id/calltoast" android:layout_width="wrap_content" android:layout_height="wrap_content" android:onClick="mOnClick" android:text=" 안내 토스트 보기 " /></LinearLayout>
8.3.4. 터치 필터링
android:filterTouchesWhenObscured
토스트나 대화 상자가 해당 액티비티위에 떠 있는 동안 터치 입력을 무시한다 .
19
C08_filtertouch.java
public class MainActivity extends Activity {public void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);}
public void mOnClick(View v){switch (v.getId()){case R.id.btnad:Toast.makeText(this, " 광고를 보았습니다 .", 1).show();break;case R.id.btncard:Toast.makeText(this, " 물품 대금을 카드 결재합니다 .", 1).show();break;case R.id.calltoast:LinearLayout linear = (LinearLayout)View.inflate(this, R.layout.c08_faketoast, null);Toast fake = new Toast(this);fake.setGravity(Gravity.LEFT|Gravity.TOP, 0, 20);fake.setDuration(Toast.LENGTH_LONG);fake.show();break;}}}
8.3.4. 터치 필터링 – 안드로이드 2.3 부터 적용됨
![· 테인먼트용 대용량 전송, 이동형 핫스팟(Hot-Spot), 디지털 지도 업데이트 등을 포함한다[3]. 대표 적인 몇몇 사용 사례에](https://img.pdfslide.tips/doc/110x75/5e25a541d87ca7670a304542/oee-eoee-e-oehot-spot-e-e.jpg)
