상단바 시계중앙 만들기 [Center Clock]

아이폰의 중앙시계 스타일을 좋아하시는 분을 위한 강좌겠네요. 시계 중앙은 생각보다 어렵지 않습니다. 처음 시계중앙버젼을 했을때 문제가 되는 부분은 우측에 아이콘이 많아지면 중앙시게와 겹치는 문제점이 발생되서 일부아이콘을 투명화처리해서 테마제작을 했었지만 이젠 스마트폰의 액정사이즈가 커지면서 특정상황이 아닌이상 중앙시계와 아이콘이 겹쳐지는 일이 적어 졌습니다. 이강좌는 ICS의 강좌가 비슷하지만 간단명료하게 개념과 스크립설명 위주로 진행하겠습니다. 이구조만 알면 테마의 중앙시계가 맘에안들면 다시 일반 시계위치로 쉽게 바꾸실 수 있습니다.

☆ 본 게시물과 관련된 포스팅 자료 ☆  1) [초급]테마제작강좌] - [APK Manager] Compile & Decompile 강좌 #1  2) 루트익스플로러 사용법 / rootexplorer 사용방법 / 루트익스플로러 테마설치방법

안드로이드 시리즈 상단바 중앙 시계 만들기

---

수정파일 : projects\SystemUI.apk\res\layout\tw_status_bar.xml[수정후 퍼미션 644로 덮어주세요]

☆ 원본 ☆ 파일내에 "statusbar.policy.Clock" 부분을 찾아주세요.

<?xml version="1.0" encoding="utf-8"?> <com.android.systemui.statusbar.phone.PhoneStatusBarView android:orientation="vertical" android:id="@id/status_bar" android:background="@drawable/status_bar_background" android:focusable="true" android:fitsSystemWindows="true" android:descendantFocusability="afterDescendants"   xmlns:android="http://schemas.android.com/apk/res/android"   xmlns:systemui="http://schemas.android.com/apk/res/com.android.systemui">     <ImageView android:id="@id/notification_lights_out" android:paddingLeft="6.0dip" android:paddingBottom="2.0dip" android:visibility="gone" android:layout_width="@dimen/status_bar_icon_size" android:layout_height="fill_parent" android:src="@drawable/ic_sysbar_lights_out_dot_small" android:scaleType="center" />     <LinearLayout android:orientation="horizontal" android:id="@id/icons" android:paddingLeft="0.0dip" android:paddingRight="2.0dip" android:layout_width="fill_parent" android:layout_height="fill_parent">         <LinearLayout android:orientation="horizontal" android:id="@id/left_icons" android:paddingLeft="4.0dip" android:layout_width="0.0dip" android:layout_height="fill_parent" android:layout_weight="1.0">             <TextView android:textSize="15.0dip" android:gravity="center_vertical" android:id="@id/carrierLabel" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="fill_parent" android:singleLine="true" />             <ImageView android:id="@id/operatorLogoIcon" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="fill_parent" android:src="@drawable/tw_stat_notify_operator_logo" />             <ImageView android:id="@id/doNotDisturbIcon" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/tw_dnd" android:alpha="0.7" android:scaleX="0.85" android:scaleY="0.85" />             <com.android.systemui.statusbar.StatusBarIconView android:id="@id/moreIcon" android:visibility="gone" android:layout_width="@dimen/status_bar_icon_size" android:layout_height="fill_parent" android:src="@drawable/stat_notify_more" />             <com.android.systemui.statusbar.phone.IconMerger android:gravity="center_vertical" android:orientation="horizontal" android:id="@id/notificationIcons" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_alignParentLeft="true" />         </LinearLayout>         <LinearLayout android:orientation="horizontal" android:id="@id/right_icons" android:paddingRight="4.0dip" android:layout_width="wrap_content" android:layout_height="fill_parent" android:layout_alignParentRight="true">             <LinearLayout android:gravity="center_vertical" android:orientation="horizontal" android:id="@id/statusIcons" android:layout_width="wrap_content" android:layout_height="fill_parent" />             <LinearLayout android:gravity="center" android:orientation="horizontal" android:id="@id/signal_battery_cluster" android:paddingLeft="2.0dip" android:layout_width="wrap_content" android:layout_height="fill_parent">                 <include android:id="@id/signal_cluster" android:layout_width="wrap_content" android:layout_height="wrap_content" layout="@layout/tw_signal_cluster_view" />                 <TextView android:textSize="12.0dip" android:textColor="#ffa6a6a6" android:layout_gravity="center" android:id="@id/battery_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/status_bar_network_name_separator" />                 <ImageView android:gravity="center" android:id="@id/battery" android:layout_width="wrap_content" android:layout_height="wrap_content" />             </LinearLayout>             <com.android.systemui.statusbar.policy.Clock android:textSize="@dimen/status_bar_clock_text_size" android:textColor="#ff959595" android:ellipsize="none" android:gravity="left|center" android:id="@id/clock" android:paddingLeft="3.0dip" android:layout_width="wrap_content" android:layout_height="fill_parent" android:singleLine="true" android:includeFontPadding="false" />         </LinearLayout>     </LinearLayout>     <LinearLayout android:orientation="horizontal" android:id="@id/ticker" android:paddingLeft="6.0dip" android:animationCache="false" android:layout_width="fill_parent" android:layout_height="fill_parent">         <ImageSwitcher android:id="@id/tickerIcon" android:layout_width="@dimen/status_bar_icon_size" android:layout_height="@dimen/status_bar_icon_size" android:layout_marginRight="4.0dip">             <com.android.systemui.statusbar.AnimatedImageView android:layout_width="@dimen/status_bar_icon_size" android:layout_height="@dimen/status_bar_icon_size" android:scaleType="centerInside" />             <com.android.systemui.statusbar.AnimatedImageView android:layout_width="@dimen/status_bar_icon_size" android:layout_height="@dimen/status_bar_icon_size" android:scaleType="centerInside" />         </ImageSwitcher>         <com.android.systemui.statusbar.phone.TickerView android:id="@id/tickerText" android:paddingTop="2.0dip" android:paddingRight="10.0dip" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0">             <TextView android:textAppearance="@style/TextAppearance.StatusBar.PhoneTicker" android:id="@id/ticker_text_view_old" android:layout_width="fill_parent" android:layout_height="wrap_content" android:singleLine="true" />             <TextView android:textAppearance="@style/TextAppearance.StatusBar.PhoneTicker" android:id="@id/ticker_text_view_new" android:layout_width="fill_parent" android:layout_height="wrap_content" android:singleLine="true" />         </com.android.systemui.statusbar.phone.TickerView>     </LinearLayout> </com.android.systemui.statusbar.phone.PhoneStatusBarView>

☆ 수정본 ☆ 아래와 같이 수정해주세요.(com.android.systemui.statusbar.policy.Clock 위치이동)

<?xml version="1.0" encoding="utf-8"?> <com.android.systemui.statusbar.phone.PhoneStatusBarView android:orientation="vertical" android:id="@id/status_bar" android:background="@drawable/status_bar_background" android:focusable="true" android:fitsSystemWindows="true" android:descendantFocusability="afterDescendants"   xmlns:android="http://schemas.android.com/apk/res/android"   xmlns:systemui="http://schemas.android.com/apk/res/com.android.systemui">     <ImageView android:id="@id/notification_lights_out" android:paddingLeft="6.0dip" android:paddingBottom="2.0dip" android:visibility="gone" android:layout_width="@dimen/status_bar_icon_size" android:layout_height="fill_parent" android:src="@drawable/ic_sysbar_lights_out_dot_small" android:scaleType="center" />     <LinearLayout android:orientation="horizontal" android:id="@id/icons" android:paddingLeft="0.0dip" android:paddingRight="2.0dip" android:layout_width="fill_parent" android:layout_height="fill_parent">         <LinearLayout android:orientation="horizontal" android:id="@id/left_icons" android:paddingLeft="4.0dip" android:layout_width="0.0dip" android:layout_height="fill_parent" android:layout_weight="1.0">             <TextView android:textSize="15.0dip" android:gravity="center_vertical" android:id="@id/carrierLabel" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="fill_parent" android:singleLine="true" />             <ImageView android:id="@id/operatorLogoIcon" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="fill_parent" android:src="@drawable/tw_stat_notify_operator_logo" />             <ImageView android:id="@id/doNotDisturbIcon" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/tw_dnd" android:alpha="0.7" android:scaleX="0.85" android:scaleY="0.85" />             <com.android.systemui.statusbar.StatusBarIconView android:id="@id/moreIcon" android:visibility="gone" android:layout_width="@dimen/status_bar_icon_size" android:layout_height="fill_parent" android:src="@drawable/stat_notify_more" />             <com.android.systemui.statusbar.phone.IconMerger android:gravity="center_vertical" android:orientation="horizontal" android:id="@id/notificationIcons" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_alignParentLeft="true" />         </LinearLayout>         <LinearLayout android:orientation="horizontal" android:id="@id/right_icons" android:paddingRight="4.0dip" android:layout_width="wrap_content" android:layout_height="fill_parent" android:layout_alignParentRight="true">             <LinearLayout android:gravity="center_vertical" android:orientation="horizontal" android:id="@id/statusIcons" android:layout_width="wrap_content" android:layout_height="fill_parent" />             <LinearLayout android:gravity="center" android:orientation="horizontal" android:id="@id/signal_battery_cluster" android:paddingLeft="2.0dip" android:layout_width="wrap_content" android:layout_height="fill_parent">                 <include android:id="@id/signal_cluster" android:layout_width="wrap_content" android:layout_height="wrap_content" layout="@layout/tw_signal_cluster_view" />                 <TextView android:textSize="12.0dip" android:textColor="#ffa6a6a6" android:layout_gravity="center" android:id="@id/battery_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/status_bar_network_name_separator" />                 <ImageView android:gravity="center" android:id="@id/battery" android:layout_width="wrap_content" android:layout_height="wrap_content" />             </LinearLayout>                     </LinearLayout>     </LinearLayout>     <LinearLayout android:gravity="center" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="fill_parent">         <com.android.systemui.statusbar.policy.Clock android:textSize="@dimen/status_bar_clock_text_size" android:textColor="#ff36b7e7" android:ellipsize="none" android:gravity="left|center" android:id="@id/clock" android:paddingLeft="3.0dip" android:layout_width="wrap_content" android:layout_height="fill_parent" android:singleLine="true" android:includeFontPadding="false" />     </LinearLayout>     <LinearLayout android:orientation="horizontal" android:id="@id/ticker" android:background="@drawable/status_bar_background" android:paddingLeft="6.0dip" android:animationCache="false" android:layout_width="fill_parent" android:layout_height="fill_parent">         <ImageSwitcher android:id="@id/tickerIcon" android:layout_width="@dimen/status_bar_icon_size" android:layout_height="@dimen/status_bar_icon_size" android:layout_marginRight="4.0dip">             <com.android.systemui.statusbar.AnimatedImageView android:layout_width="@dimen/status_bar_icon_size" android:layout_height="@dimen/status_bar_icon_size" android:scaleType="centerInside" />             <com.android.systemui.statusbar.AnimatedImageView android:layout_width="@dimen/status_bar_icon_size" android:layout_height="@dimen/status_bar_icon_size" android:scaleType="centerInside" />         </ImageSwitcher>         <com.android.systemui.statusbar.phone.TickerView android:id="@id/tickerText" android:paddingTop="2.0dip" android:paddingRight="10.0dip" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0">             <TextView android:textAppearance="@style/TextAppearance.StatusBar.PhoneTicker" android:id="@id/ticker_text_view_old" android:layout_width="fill_parent" android:layout_height="wrap_content" android:singleLine="true" />             <TextView android:textAppearance="@style/TextAppearance.StatusBar.PhoneTicker" android:id="@id/ticker_text_view_new" android:layout_width="fill_parent" android:layout_height="wrap_content" android:singleLine="true" />         </com.android.systemui.statusbar.phone.TickerView>     </LinearLayout> </com.android.systemui.statusbar.phone.PhoneStatusBarView>

이 강좌의 사실 위치 수정이라는 개념보다는 LinearLayout의 개념만 알고 있으면 어렵지 않게 이해할 수 있습니다.

중앙시계강좌는 기존에 그룹핑 되어있던 LinearLayout을 독자적인 LinearLayout구조로 생성하면서 중앙정렬을 하는 방식입니다. xml에서 자주 나오는 구문정리는 시간되는대로 해드리겠습니다.

추가적으로 들어가는 background이미지는 중앙시계를 하게되면 좌측에 티커메세지와 중앙시계와 글씨겹침을 막기위해 ticker메세지 생성시 배경이 함께 나와서 겹치지 않게 해주 방법입니다.status_bar_background는 상단바 배경화면이미지 입니다.

<LinearLayout android:orientation="horizontal" android:id="@id/ticker" android:background="@drawable/status_bar_background" android:paddingLeft="6.0dip" android:animationCache="false" android:layout_width="fill_parent" android:layout_height="fill_parent">

☆ 수정본 이미지☆

[글씨색상은 제가 임의로 바꾼겁니다.]