Kotlin으로 Android 앱 만들기Proj. 홈화면에서 원터치 QR 체크인! App #5 홈 화면 QR 체크인 위젯 만들기

admin | | 조회 4


[주요 목차]

위젯 레이아웃 구성하기

QR 이미지 업데이트 함수 구현

클릭으로 강제 갱신과 마지막 업데이트 시간 표시


요즘 출퇴근할 때마다 매번 앱을 켜서 QR 체크인 하는 게 귀찮다는 분들 많으시죠. Kotlin으로 Android 앱을 만들면서 홈 화면에서 원터치 QR 체크인 위젯을 추가하면 이런 불편을 확 줄일 수 있어요. 특히 반복 작업이 많은 직장인이나 학생들에게 홈화면 QR 체크인 위젯은 실질적인 편의성을 제공하죠. 이 글을 읽으면 Kotlin Android 앱에 홈 화면 QR 체크인 위젯을 직접 만드는 전체 과정을 단계별로 이해할 수 있어요. 단순 따라하기가 아니라 레이아웃 구성부터 클릭 이벤트, 시간 표시까지 실전에서 바로 적용할 수 있는 팁도 함께 담았습니다. 영상을 보지 않아도 혼자서 위젯을 완성할 수 있도록 배경 지식도 보충했어요.


Kotlin으로 Android 앱 만들기Proj. 홈화면에서 원터치 QR 체크인! App #5 홈 화면 QR 체크인 위젯 만들기 - 핵심 장면 1 - KotlinAndroidKotlin으로 Android 앱 만들기Proj. 홈화면에서 원터치 QR 체크인! App #5 홈 화면 QR 체크인 위젯 만들기 · 핵심 장면 1

위젯 레이아웃 구성하기

Kotlin Android 프로젝트에서 홈 화면 QR 체크인 위젯을 만들 때 가장 먼저 할 일은 레이아웃을 예쁘고 실용적으로 잡는 거예요. AppWidgetProvider를 상속받은 위젯 클래스를 만들고, res/xml 폴더에 widget_info.xml을 정의한 다음 실제 UI는 layout 파일에서 작업하게 되죠.

예를 들어 기존에 있던 TextView를 지우고 ImageView 하나를 새로 추가해서 QR 코드를 보여주는 방식으로 진행합니다. background를 white로 설정하고, id는 checkin_qr_image로 지정하면 나중에 RemoteViews로 접근하기 편해요. layout_gravity를 center로 주면 화면 중앙에 QR이 깔끔하게 뜨는데, 실제로 테스트해 보면 기기마다 여백이 달라질 수 있으니 padding 값을 8dp 정도로 여유를 주는 게 좋습니다.

비교해 보면 기본 제공되는 위젯과 커스텀 위젯의 차이는 명확해요. 기본 위젯은 업데이트 주기가 30분 이상으로 길지만, 우리가 만드는 홈화면 QR 체크인 위젯은 클릭 한 번으로 즉시 갱신이 가능하다는 점이 강점입니다. 레이아웃을 만들 때 ImageView 외에 LinearLayout으로 감싸서 클릭 영역을 넓히면 사용자 경험이 훨씬 좋아져요.

Kotlin으로 Android 앱 만들기Proj. 홈화면에서 원터치 QR 체크인! App #5 홈 화면 QR 체크인 위젯 만들기 - 핵심 장면 2 - KotlinAndroidKotlin으로 Android 앱 만들기Proj. 홈화면에서 원터치 QR 체크인! App #5 홈 화면 QR 체크인 위젯 만들기 · 핵심 장면 2

QR 이미지 업데이트 함수 구현하기

위젯이 제대로 동작하려면 QR 이미지를 실시간으로 불러와서 표시하는 업데이트 함수가 핵심이에요. RemoteViews를 사용해 checkin_qr_image에 Bitmap을 setImageViewBitmap로 넣어주는 방식으로 진행합니다. 성공 시에는 교회 로고나 체크인 이미지도 함께 Bitmap으로 로드해서 보여주고, 실패하면 아무것도 하지 않도록 처리하는 게 안전합니다.

실제 코드에서는 updateAppWidget 함수 안에 success와 failure 클로저를 따로 만들어 관리하는 게 편해요. 성공할 때는 Glide나 Coil 같은 라이브러리로 QR 이미지를 미리 로드한 뒤 Bitmap으로 변환해서 넘기는 식으로 하면 메모리 관리도 수월하죠.

업데이트 주기가 15초로 설정돼 있어도 위젯 특성상 즉시 반영되지 않는 경우가 많아서, 이 함수를 호출할 때마다 AppWidgetManager를 통해 강제로 refresh하는 로직을 넣는 걸 추천해요. 이렇게 하면 데이터 변경이 바로 화면에 나타나는 걸 확인할 수 있습니다.

[이미지�입용태그3]

클릭으로 강제 갱신과 마지막 업데이트 시간 표시

위젯을 클릭했을 때 강제로 업데이트되게 하려면 PendingIntent를 활용해야 해요. LinearLayout에 id를 부여한 뒤, Intent에 AppWidgetManager.ACTION_APPWIDGET_UPDATE 액션을 넣고 PendingIntent.getBroadcast로 감싸서 setOnClickPendingIntent로 연결합니다.

이렇게 하면 사용자가 위젯을 터치할 때마다 onUpdate가 다시 호출되면서 QR 이미지가 최신 상태로 바뀌어요. 마지막으로 현재 시간을 표시하고 싶다면 SimpleDateFormat을 사용해서 "yyyy-MM-dd HH:mm" 형식으로 포맷팅한 뒤 TextView에 setText로 넣어주면 됩니다.

실전 팁으로는 업데이트 실패 시 “갱신 실패” 문구를 보여주는 fallback 로직을 꼭 추가하세요. 또한 DateFormat을 한국 시간(KST)으로 명시하면 해외 기기에서도 시간 표시가 정확해집니다. 이렇게 완성된 홈화면 QR 체크인 위젯은 실제로 매일 쓰면서 편의성을 체감할 수 있어요.


[자주 묻는 질문]

Kotlin Android 위젯이 홈 화면에 나타나지 않을 때는 어떻게 해야 하나요?

위젯이 보이지 않는 경우 대부분 AndroidManifest.xml에 receiver 등록이 빠져 있거나 widget_info.xml의 minWidth, minHeight 값이 너무 큰 경우예요. receiver 안에 로 ACTION_APPWIDGET_UPDATE를 명시하고, widget_info.xml에서 4x2 크기 정도로 줄여보세요. 그 후 기기를 재시작하거나 앱을 강제 종료했다가 다시 실행하면 대부분 해결됩니다.

위젯 클릭 시 QR 이미지가 바로 업데이트되지 않는 이유는?

AppWidget은 기본적으로 브로드캐스트를 통해 갱신되기 때문에 즉시 반영되지 않을 수 있어요. PendingIntent로 ACTION_APPWIDGET_UPDATE를 보내고, updateAppWidget 함수를 직접 호출하는 방식으로 강제 갱신해야 합니다. 또한 RemoteViews 객체를 새로 생성해서 setImageViewBitmap를 호출한 뒤 AppWidgetManager.updateAppWidget을 호출하면 클릭 즉시 화면이 바뀝니다.

위젯에 마지막 업데이트 시간을 표시하려면 어떤 포맷을 쓰는 게 좋을까요?

SimpleDateFormat("MM/dd HH:mm", Locale.KOREA)를 사용하면 깔끔하게 표시돼요. 한국 시간으로 포맷팅한 뒤 TextView에 setText로 넣고, 업데이트 함수 마지막에 RemoteViews를 다시 적용하면 됩니다. 실패 시에는 “갱신 실패” 문자열을 대신 넣어 사용자에게 상태를 알려주는 게 실용적입니다.

목록
글쓰기
한국 서버호스팅
전체보기 →

댓글 0