움직이는 위젯(App Widget)

어떻게 하면은 AppWidget(위젯)을 움직이게 할 수 있을까??? 하는 생각으로 시작을 하게 되었다. 이러한 방법을 알기전에 위젯이 어떤한 방식으로 구성이 되고 사용할 수 있는지에 대해서 알아야했다. 그럼 하나씩 차근차근 살펴보자.

위젯의 생명주기

1.     위젯 정의

2.     위젯 인스턴스 생성

3.     onUpdate() (시차가 만료되는 순간)

4.     클릭에 반응(메인화면의 위젯 뷰 상에)

5.     위젯 인스턴스 제거(메인화면에서)

6.     위젯 패키지 설치제거

[출처] 안드로이드 App Widget 이야기|작성자 휴우

App Widget은 다른 어플리케이션(예를 들어 홈 화면과 같은)에 포함될 수 있는 작은 어플리케이션 View이고 주기적으로 업데이트 이벤트를 받습니다. UX 적으로는 위젯이라고 하는데, 개발자들은 App Widget Provider를 통해 이를 구현할 수 있습니다. 홈 어플리케이션과 같이 App Widget들은 포함할 수 있는 어플리케이션 컴포넌트를 App Widget Host라고 부릅니다.

App Widget Provider는 리시버?

App Widget Provider의 계층구조를 살펴보면 아시겠지만 App Widget Provider는 BroadcastReceiver를 상속받아서 작성되었습니다. 그렇게 때문에 메니페스트에 리시버에 대해 기술해야합니다. 그리고 여기서 각 버튼 클릭 시 호스트에서 특정 액션을Broadcasting하라고 요청을 해야합니다.

App Widget의 구성은 어떻게 될까?

일반적인 BroadcastReceiver 와 App Widget 은 구체적으로 어떤 차이점을 갖고 있을까요? App Widget 의 핵심 요소는 App Widget Provider 라고 불리는 놈인데, 이 녀석은 몇 가지 정해진 형식을 따르는 좀 특이한 BroadcastReceiver 라고 할 수 있습니다. 차이점은 크게 두 가지입니다.

ž   App Widget 의 생명 주기와 관련된 시스템 Intent 를 수신합니다.

ž   위젯에 관한 기본 설정 값을 담고 있는 XML 리소스 경로를 포함합니다.

 다음은 실제 App Widget 을 선언하고 있는 안드로이드 메니페스트 파일의 일부 입니다.

<receiver android:name=".MySimpleWidget">

        <meta-data android:resource="@xml/simplewidget" android:name="android.appwidget.provider">

        </meta-data>

        <intent-filter>

               <action android:name="android.appwidget.action.APPWIDGET_UPDATE"></action>

        </intent-filter>

</receiver>

Intent Filter 항목에 APPWIDGET_UPDATE 를 포함하고 있으며, 추가로 meta-data 항목에 '@xml/simplewidget ' 이라는 특정한 XML 파일을 가리키고 있음을 확인 할 수 있습니다. 

<?xml version="1.0" encoding="utf-8"?>

<appwidget-provider

  xmlns:android="http://schemas.android.com/apk/res/android"

  android:minWidth="294dp"

  android:minHeight="72dp"

  android:initialLayout="@layout/simple_widget_layout"

  android:updatePeriodMillis="0">

</appwidget-provider>

'@xml/simplewidget' 이 나타내는 XML 파일의 내용을 살펴보면 위와 같습니다. 실재 화면상에 위치할 위젯 크기 정보와 화면 구성에 사용하게될 Layout 정보, 그리고 얼마나 자주 update 함수가 호출되어야 하는지에 관한 정보를 담고 있습니다. 

 

 즉, App Widget 을 다시 정의 하자면, APPWIDGET_UPDATE 를 처리하며, 위젯을 설정하기 위한 관련 정보를 갖고 있는 BroadcastReceiver 라고 말 할 수 있습니다. 

App Widget 은 어떻게 그려지는 걸까?

 App Widget 이 무엇이고 어떤 구성 요소를 갖고 있는지 대충 살펴 보았습니다. 하지만 실재로 App Widget 이 어떤식으로 작동하고 있는지에 관해 이해하고자 한다면 한 가지 좀더 자세하게 살펴봐야할 부분이 있습니다.  

App Widget 은 어떻게 화면상에 그림을 그릴 수 있을까요?

 기본적으로 BroadcastReceiver 는 GUI 구성요소를 포함 할 수 없습니다. 또한, 위젯이라는 것이 특정 어플리케이션에 부록 형태로 딸려들어가는 작은 어플리케이션을 말하는 만큼, 일반적인 경우와는 달리 특정 어플리케이션이 일부분만을 점유해서 그림을 그릴 수 있어야 합니다. GUI 를 그릴 수 없는 App Widget Provider 와 어떤 위젯이 자신에게 적용될지 알 수 없는어플리케이션 사이에 자리를 잡고, 두 요소간의 연결 고리를 형성해 주는 누군가가 필요한 셈입니다.  App Widget Host 가 바로 그 역할을 수행합니다.

App Widget Service 는 현재 시스템에 위치한 모든 App Widget 정보를 관리하며, 어플리케이션이 임대 사업을 위해 AppWidgetHost 를 시작할 때, 해당 호스트 정보 또한 저장해 둡니다. 저장되는 호스트 정보에는 해당 호스트를 구분하기 위한 ID 값과 더불어서 위젯 View 가 다시 그려져야할 때 호출되어야하는 콜백 함수 정보가 포함됩니다.

위젯 화면은 다음과 같은 과정을 통해 업데이트 됩니다. 위젯과 관련된 특정 이벤트가 발생되면, 우선  App Widget Provider 가 해당 내용을 처리하고, App Widget Service 의 API 를 호출 합니다(IPC). App Widget Service 는 해당 App Widget 과 연결되어 있는 AppWidgetHost 를 찾은 후에, 등록되어 있는 콜백 함수를 호출합니다(IPC). 해당 콜백 함수는 건물주인 격인 어플리케이션 상에서 호촐되게 됨으로, 별 다른 어려움 없이 위젯 View 의 그림을 갱신할 수 있습니다.

그렇다면은 어떻게 움직이는 위젯을 만들 수 있을까?

위와 같은 내용을 바탕으로 홈 화면상에서 위젯이 에니메이션과 같은 효과를 보기위해서 별도의 서비스와 쓰레드를 사용합니다. 

그와 관련된 코드는 아래와 같습니다.(서비스안에 있는 쓰레드 // 서비스가 실행이 되는 onStart()) 이러한 방법으로 손쉽게 화면에서 움직이는 App Widget을 작성하실 수 있습니다.

while( threadRun ) {

        if( mode == 1 ) {

               views = new RemoteViews(context.getPackageName(), R.layout.simple_widget_layout);

               views.setImageViewResource(R.id.AnimationImageView, R.drawable.ani_2);

               mode = 0;

        }else {

               views = new RemoteViews(context.getPackageName(), R.layout.simple_widget_layout);

               views.setImageViewResource(R.id.AnimationImageView, R.drawable.ani_1);

               mode = 1;

        }

        manager.updateAppWidget(thisWidget, views);

       

        try {

               Thread.sleep(1000);

        } catch (InterruptedException e) {

               // TODO Auto-generated catch block

               e.printStackTrace();

        }

       

        Log.d(TAG, "Widget Update" + " Mode : " + mode);

}

이렇게 간단하게 홈 화면에 App Widget을 작성하였습니다. 순서대로 보면 서비스를 실행하면은 서비스에서는 화면에 있는 위젯에 1초 간격으로 계속해서 화면을 갱신 하라는 updateAppWidget매서드를 호출함으로서 화면에 나타나있는 위젯의 그림을 바꾸어 줌으로써 애니메이션과 같은 효과를 가지게 됩니다.

간단한 위젯의 표준 크기.

밑의 사진은 구글에서 표준으로 정해주는 위젯의 크기이다. 이를 바탕으로하여 위젯을 만들면 될 것이다.


widget_sizes_landscape

widget_sizes_portrait

추가로 각 위젯별 크기