GithubWidget-2

GithubWidget에 대해서 소스 분석을 하겠다고 이야기하고서는 후회중입니다. 하지만 진행해야겠죠? 새로운 안드로이드 에뮬레이터 성능도 확인해 볼겸 쓰겠습니다.

GithubWidget
_깃헙에 관련되어서 앱이 있으면 좋겠다고 생각은 하는데 일단 공식앱을 쓸만한 안드로이드 앱은 없다고 보면 좋은데, 오늘 소개해 드릴 위젯은 일단 이쁩니다. 이 위젯은 개인 profile 이랑 streak…_medium.com

링크가 걸려 있는 지난 리뷰에서도 말씀드린데로 상당히 이쁜 위젯을 어떻게 만들었을까 궁금했습니다.

국내에서도 크게 위젯 관련된 내용의 블로깅은 겉핥기 수준 정도인거 같아서 크게 안심하고 저도 겉핥는 심정으로…

에디터는dragula

프로젝트를 열면 위와 같은 형태의 일반적인 형태를 띕니다. 재밌는 것은 Default Activity가 없어서 안드로이드 실행에 x표시가 뜬다는 점입니다.(당연하겠죠?)

하지만 빌드는 가능해요

Widget은 기본적으로 4가지 정도의 중요한 작업들을 해 줘야합니다.

  • Widget Layout
  • WidgetProvider
  • Menifest.xml
  • Widget

소스를 처음 받으면 저 같은경우는 Widget.class가 WidGet으로 잘못 타이핑 되어 있어서 소스를 고쳐야 컴파일이 되었습니다.


WidgetLayout

첫번째 위젯의 레이아웃을 만져 보도록 하겠습니다.

촘촘한 이미지뷰

일단 레이아웃 파일은 전체 그림을 커버하고 있지만, 실제 실행은 다르게 됩니다.


Widget Provider

<?xml version="1.0" encoding="utf-8"?\>  
<appwidget-provider  
xmlns:android="http://schemas.android.com/apk/res/android"  
android:initialLayout="@layout/github\_widget\_0"  
android:minWidth="250dp"  
android:minHeight="40dp"  
\>  

</appwidget-provider\>

provider xml은 간단하게 정의되어 있습니다. minWidth, minHeight 정도를 정의했습니다.


AndroidMenifst.xml

위젯안에 형태가 상당히 많지만 여기서 소개한 widget_0 만 살펴 보자면

<receiver  
android:name=".GithubWidget0"  
android:label="4×1"\>  
<meta-data  
android:name="android.appwidget.provider"  
android:resource="@xml/appwidget\_provider\_0"/\>  

<intent-filter\>  
<action android:name="com.nightonke.githubwidget.action.CLICK\_ALL" /\>  
<action android:name="com.nightonke.githubwidget.action.CLICK\_AVATAR" /\>  
<action android:name="com.nightonke.githubwidget.action.CLICK\_CONTRIBUTIONS" /\>  
<action android:name="com.nightonke.githubwidget.action.CLICK\_CONTRIBUTIONS\_SUM" /\>  
<action android:name="com.nightonke.githubwidget.action.UPDATE\_FROM\_SERVICE" /\>  
<action android:name="android.appwidget.action.APPWIDGET\_UPDATE" /\>  
</intent-filter\>  
</receiver\>

receiver 셋팅으로 provider를 지정해 두었습니다.

그리고는

<service android:name=".GithubWidgetService" /\>

서비스들을 등록해 두었습니다.


WidgetClass

실제 Java 소스들을 살펴보면

GithubWidget0 클래스는

public class GithubWidget0 extends AppWidgetProvider

로 AppWidetProvider 를 상속받고 다음의 메쏘드들을 오버라이드 해서 사용합니다.

  • onReceive
  • onUpdate
  • onDisabled

각 상황별로 액션과 작업들을 정해주고는 updateAll을 실행하는 구조로 만들어져 있습니다.


ContributionTask

다른 위젯보다 도드러 지는 부분은 아무래도 컨트리뷰션 맵이겠죠? 가장 이쁜 부분이라고 생각되어지는 부분은 어떻게 만들어졌을까요?

2D 혹은 3D

ContributionsTask

클래스를 찾아가 보니 Util.get2DBitmap, Util.get3DBitmap등의 함수가 있습니다.

get2DBitMap 함수는 한땀한땀 장인이 그림 그리듯 canvas 에다 drawing 해 두었습니다.

get3D는 같은 Util함수에 들어가 있습니다. 저는 3D라서 openGL을 기대하고 들어같는데 그렇게 한 것은 아니고 canvas에 삼각함수를 이용해서 3D 효과를 주게 그려져 있습니다.


Widget관련 프로젝트를 만들어야 하는 입장이라면 참조하기에 좋은 소스인 거 같고 실제로 제가 본 깃헙을 제외하고서라도 위젯중에서는 가장 이쁜 위젯이라 분석해 봤습니다.


아쉬운것은 drawing 하는 클래스를 Util안에서 다 구현을 한 부분인데, 이런 부분은 차차 업데이트 하면서 바뀔 거 같습니다.

By Keen Dev on May 7, 2016.

Exported from Medium on May 31, 2017.

15DaysofSwiftAnimation

되게 많아 보입니다.네 아직 11일째

15일째 리뷰를 할 걸 그랬나요. 따끈 따끈한 프로젝트가 왔습니다. 애니메이션 때문에 mpeg to gif 앱도 몇가지를 깔게 되는군요. 아 이게 새로운 맥을 사서 가능해진 호사네요.

15days swift, 30days android 등등 시리즈들이 지속적으로 깃헙에는 올라옵니다. 오늘 소개해 드릴 프로젝트는 그 중에서 Swift의 애니메이션을 코드로 어떻게 짜는지에 대한 프로젝트 입니다.

2016/05/07 Editor’s choice

larrynatalicio/15DaysofAnimationsinSwift
_15DaysofAnimationsinSwift - A project to learn animations._github.com

흠.. 개발자의 완성은? 얼….


설치해 봅시다

설치할게 뭐 있을까 싶네요

$git clone [https://github.com/larrynatalicio/15DaysofAnimationsinSwift.git][anchor2]

프로젝트를 받고 나면

4일 남았군요.

다음과 같은 프로젝트들이 있습니다.


실행해 봅시다

1번과 6번을 실행해 볼 예정입니다.

NavigationBarAnimation

아래와 같이 스크롤해서 내려가면 NavigationBar가 사라졌다가 다시 스크롤을 올리면 NavigationBar 가 복귀되는 간단한 프로젝트입니다.

XCODE를 열어서 확인해 보겠습니다. 아마도 많은 사람들이 그냥 간단하게 할 수 있을거라고 생각하시는 부분일텐데요.

xcode

AppDelegate는 주로 앱 전체 옵션들을 정할 수 있고, ViewController를 확인해 보면 스크롤 액션에 대한 소스들을 확인할 수 있습니다.

UITableViewController 를 상속한 ViewController의 소스는 다음과 같습니다.

마지막 configureNavigationController 함수의

hideBarOnSwipe 만 false 로 바꾸면 동작하지 않는 간단한 예제 입니다.

StretchyHeaderAnimation

이 예제는 스크롤을 당기면 화면의 이미지가 줌되는 애니메이션을 보여줍니다. 일단 스크린샷을 보시면 감이 오실 거 같습니다.

으어억 성이 커진다

성을 광화문으로 바꿔볼까요?

광화문이다~

Supporting Files의 Asset에 kcastle.jpg 만 집어 넣고 Main.storyboard 의 이미지만 kcastle로 선택해 주면 화면은 바뀝니다.

이렇게 말이죠.

이런 일을 하는 소스를 한번 살펴 봐야겠죠? 첫번째 예제의 경우와 똑같이 ViewController 소스를 살펴봐야합니다.

이 updateHeaderView 의 y값과 Height를 변경해 주는 것으로 애니메이션이 실행됩니다.

이 함수를 viewDidLoad와 scrollViewDidScroll 에서 호출을 해 줘서 화면이 뜨고 스크롤이 될때 값이 변하는 형태로 애니메이션을 구현했네요.

scrollViewDidScroll 은 UIScrollViewDelegate에서 가져왔네요.

Swift를 하면서 수려한 애니메이션을 구현하시고 싶었던 분들에게는 무척이나 좋은 프로젝트가 될 것 같습니다.

By Keen Dev on May 7, 2016.

Exported from Medium on May 31, 2017.