11장.다양한 뷰 활용

 

라이브러리의 다양한 뷰

Spannable : 뷰는 아니고 문자열 데이터의 UI정보

-안드로이드의 문자열 데이터는 String 보다 상위인 CharSequence 타입이다, UI 정보까지 포함하기 위함(Spannable)

-문자열에 왜 UI정보까지 필요하냐? XML로 세부 설정이 불가능 ex) 앞글자만 폰트를 바꾼다던가..

-여러 뷰로 짬뽕을 안 해도 spannable 속성을 만지면 세부 설정이 가능

-사용법

1. xml 설정

<TextView ~~~ android:bufferType="spannable"/> // 기본적으로 normal임

<EditText ~~~ android:bufferType="spannable"/> // 기본적으로 editable인데 spannable 내장함.

2. String을 SpannableStringBuilder 타입으로 표현 후 setSpan으로 spannable 속성 설정

String data = "복수초 \n img \n 이른봄 설산에서 만나는 복수초는~"

SpannableStringBuilder builder = new SpannableStringBuilder(data);

//세 번째 매개변수 : span적용된 좌우측 문자열에도 적용을 할 것인지

builder.setSpan(span,start,end, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)

ex)

-ImageSpan 사용 시 setBounds 함수로 이미지의 크기를 지정해줘야한다.

-문자열을 꾸미기 위한 다양한 라이브러리 Span 클래스가 존재한다.

 

fromHtml() 함수 - 티스토리 같은 블로그에서 문자열 꾸미기 가능

-Html 태그로도 문자열 꾸미기 가능->fromHtml() 함수 (사실 내부적으로 spannable이지만 이 함수가 대행). 문자열 사이사이에 Html 태그를 삽입하고 fromHtml 함수로 실현.

ex)

String html = "<font color='RED'>얼레지</font><br/><img src='img1'/><br/>곰배령에서 만난 봄꽃";

 

-두 번째 것 deprecated 함수, 호환성을 위해 가끔 씀.

-fromHtml의 두 번째 매개변수는 이미지를 갖기 위한 개발자 클래스, 직접 구현한다.

-<img> 태그 당 getDrawable 함수가 자동으로 호출하게 만든다. 이미지를 획득하여 <img>를 만났을 때 이미지를 반환하여 이미지가 출력되는 방식. 반환형이 이미지 말고 파일이나 네트워크 이미지도 가능하다.

 

WebView : 완벽한 브라우저는 아니고 화면에 HTML만 띄움, URL바, 뒤로가기 등 하나씩 빠져있음

-하이브리드 앱을 만들 때 핵심기술이다 ex) Html/Css/JS로 HTML만들고 이 HTML을 WebView로 띄우면 우려먹기 가능

-코드에서 Html 파일을 명시해주면 Html 파일을 parsing해서 화면에 출력.

cf) HTML Parse란?  HTML 문법 규칙에 따른 문자열을, 해당 문법을 바탕으로 단어의  의미나 구조를 분석하는 것을 의미합니다. 이렇게 HTML Parse를 행하는 프로그램을 일컬어 HTML Parser라고 말합니다.

-외부 permission INTERNET 쓰고 WebView 준비하고, URL 지정 / 내부 assets에 HTML 두고 loadUrl(파일 경로)

-자바스크립트가 실행되어야할 경우 setJavaScriptEnabled(true);

ex)

자바스트리브와 자바의 연동

-자바스크립트에서 자바 함수를 호출할 때

1.자바스크립트를 위한 클래스 생성(@JavascriptInterface 어노테이션 필수)

2.객체를 자바스크립트에 공개(addJavascriptInterface(new JavascriptTest(), "android"); ) // android는 사용자가 명명하는 객체명

3.호출 ( var data = window.android.getChartData(); )

-자바에서 자바스크립트 함수를 호출할 때 ->webView.loadUrl("javascript:lineChart()");

 

이벤트처리

-화면에 HTML이 출력되고, 거기서 발생하는 이벤트는 Java가 아니고 JS이다, but 간혹 JS 이벤트를 Java코드에서 처리할 경우가 생긴다.

-사용자 이벤트를 Java코드에서 처리하는 경우  ex) HTML링크를 클릭한 순간 자바에서 클릭을 인지하여 URL을 분석해야한다.

-여기서 핸들러는 WebViewClient를 상속받는 이벤트 핸들러를 정의한 후 WebViewClient가 제공하는 콜백 함수 중 하나를 재정의한다.

-브라우저 자체 이벤트를 처리해야할 경우 ex)브라우저에서 웹의 알림(alert)창을 띄우는 경우, 브라우저에서 html문서를 로딩 시작부터 완료까지 상태를 파악해야하는 경우.

-WebChromeClient를 상속받는 이벤트 핸들러를 정의, onJsAlert함수를 이용하여 브라우저에서 알림 창이 뜨는 순간을 처리한 코드. 매개변수로 알림 창의 메시지가 전달되며, 알림 창의 객체가 JsResult 타입으로 전달된다. Confirm()함수로 알림 창이 뜨지 않게 할 수도 있다.

기타 유용한 뷰

*콤보박스(Spinner) : 여러 항목 중 하나를 선택할 수 있게 제공하는 뷰, Adapter로 구성한다.

-XML에 Spinner준비

-Java코드에서 Adapter 작성, 문자열 하나만 주려면 ArrayAdapter 사용

ex)

//화살표 버튼 누르면 밑으로 쭉 내려오면서 목록 표시

ArrayAdapter<String> aa = new ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, datas,); 

aa.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

spinner.setAdapter(aa);

cf) xml에서 android:prompt 속성을 @string/spinner_prompt로 설정하면 다이얼로그 형토로 보이게 할 수 있다.

 

*텍스트 자동완성(AutoCompleteTextView)

-추천 단어를 나열한다는 점에서 AdapterView의 일종이고 Adapter 클래스를 사용한다. 한 항목에 하나의 문자열이므로 ArrayAdapter로 가능.

-XML에 AutoCompleteTextView 준비,  Adapter 작성

ex)

ArrayAdapter<String> auto =

new ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, autoDatas);

autoCompleteTextView.setAdapter(autoAdapter);

cf) 문자열을 코드로 필터링x, 전체 문자열을 주면 알아서 사용자가 입력하는 문자열에 겹치는 문자열을 출력해줌.

cf) android:completionThreshold="1" //기본은 두 글자를 쳤을 때 출력이지만, 이거 하면 한 글자

 

*프로그레스바(ProgressBar) : 원스타일(기본스타일, 시작과 끝 알 수 없을 때), 막대스타일(시작과 끝이 명활할 때)

-<ProgressBar ~~~ style="?android:attr/progressBarStyleHorizontal", android:max="100"> // 막대 스타일로 변경, max설정

-쓰레드로 동작 중 ProgressBar에 값 표시 가능

setProgress(int progress) : 매개변수로 ProgressBar의 값을 지정할 때 사용

incrementProgressBy(int diff) : 매개변수 값을 현재 값에서 더하거나 뺄 때 사용

ex) 10초동안 1초마다 10씩 ProgressBar의 값을 증가시킴.

class ProgressThread extends Thread {

  @Override

  public void run() {

    for(int i=0; i<10; i++) {

    SystemClock.sleep(1000);

    progressBar.incrementProgressBy(10);

 }

}

-ProgressBar 값을 진한선, 반투명선으로 두 가지 값을 동시에 표현할 수 있다.

setSecondaryProgress(int secondaryProgress)

incrementSecondaryProgressBy(int diff)

 

*SeekBar : 값을 입력받는 프로그레스바 : ProgressBar의 서브 클래스, 표시가 아닌 입력을 위한 Bar

-<SeekBar android:~~~/>

-화면밝기, 음량조절 등

-입력받은 값을 획득하는 이벤트 핸들러가 필요 -> OnSeekBarChangeListener

- 사용자가 막대를 터치하는 순간 onStartTrankingTouch()가 호출, 터치를 떼는 순간 onStopTrackingTouch()가 호출, 사용자가 막대를 터치해서 값을 조정하면 onProgressChanged()가 반복적으로 호출되어 매개변수로 값이 전달된다.

-현재 시점을 나타내는 원을 android:thumb = "@drawable/~~"로 임의로 바꿀 수 있다.