0. INTRO
One of the only things I like about the US firmwares for our phones is that the dialer actually looks normal. Those of you using Hellraiser on int'l firmwares have probably thought wtf is this fugly mess? It just drives me crazy, so I decided to write a guide to removing the video call icon, and decribe the basics of modding the dialer layout. This is not particularly advanced, but I'm not getting into any apktool specifics, so you will need to be comfortable with that before you try this.
One of the only things I like about the US firmwares for our phones is that the dialer actually looks normal. Those of you using Hellraiser on int'l firmwares have probably thought wtf is this fugly mess? It just drives me crazy, so I decided to write a guide to removing the video call icon, and decribe the basics of modding the dialer layout. This is not particularly advanced, but I'm not getting into any apktool specifics, so you will need to be comfortable with that before you try this.
Let's take a close look at this thing:
Yup, you're supposed to make a call with that. Or a video call. Or a text message. Especially text message, because if you hit the menu button, you're presented with another way to text: 'Send message'.
</rant>
Yup, you're supposed to make a call with that. Or a video call. Or a text message. Especially text message, because if you hit the menu button, you're presented with another way to text: 'Send message'.
</rant>
1. GET RID OF VIDEO CALL ICON
I don't think there's any way to activate it in the US, so let's get rid of it.
a. Get a clean copy of Contacts.apk from your favorite i9100 firmware. The one I'm using is from XWKL1.
b. Decompile.
c. Open up res/layout/dialer_app.xml in a text editor.
d. We will be working in the last LinearLayout entry, find it.
e. We will use android:visibility="gone" to get rid of the icon. You can see that voicemailbutton is hidden by default.
I don't think there's any way to activate it in the US, so let's get rid of it.
a. Get a clean copy of Contacts.apk from your favorite i9100 firmware. The one I'm using is from XWKL1.
b. Decompile.
c. Open up res/layout/dialer_app.xml in a text editor.
d. We will be working in the last LinearLayout entry, find it.
e. We will use android:visibility="gone" to get rid of the icon. You can see that voicemailbutton is hidden by default.
Code:
<LinearLayout android:orientation="horizontal" android:id="@id/dialbuttonset" android:layout_width="314.0dip" android:layout_height="54.669983dip" android:layout_marginTop="2.6599731dip">
<ImageButton android:id="@id/voicemailbutton" android:background="@drawable/call_dial_btn06" android:visibility="gone" android:layout_width="98.66998dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_voicemail_icon" />
<ImageButton android:id="@id/callbutton" android:background="@drawable/call_dial_btn01" android:layout_width="98.66998dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_outgoingcall_icon" android:scaleType="fitXY" android:contentDescription="@string/call" />
<ImageButton android:id="@id/videocallbutton" android:background="@drawable/call_dial_btn02" android:layout_width="63.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_contacts_icon" android:scaleType="fitXY" android:contentDescription="@string/video_call" />
<ImageButton android:id="@id/messagebutton" android:background="@drawable/call_dial_btn03" android:layout_width="63.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_message_icon_04" android:scaleType="fitXY" android:contentDescription="@string/message" />
<ImageButton android:id="@id/imageclear" android:background="@drawable/call_dial_btn06" android:nextFocusLeft="@id/messagebutton" android:nextFocusRight="@id/callbutton" android:layout_width="63.0dip" android:layout_height="52.899994dip" android:layout_marginLeft="6.0dip" android:layout_marginTop="1.0dip" android:src="@drawable/call_clear_btn_04" android:scaleType="fitXY" android:contentDescription="@string/description_delete_button" />
<ImageButton android:id="@id/messagebutton_novt" android:background="@drawable/call_dial_btn05" android:layout_width="98.66998dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_message_icon_03" android:scaleType="fitXY" android:contentDescription="@string/message" />
<ImageButton android:id="@id/imageclear_novt" android:background="@drawable/call_dial_btn06" android:layout_width="98.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_clear_btn_03" android:scaleType="fitXY" android:contentDescription="@string/description_delete_button" />
</LinearLayout>
f. Modify the relevant line by adding android:visibility="gone"
Code:
<ImageButton android:id="@id/videocallbutton" android:background="@drawable/call_dial_btn02" [COLOR="Blue"]android:visibility="gone"[/COLOR] android:layout_width="63.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_contacts_icon" android:scaleType="fitXY" android:contentDescription="@string/video_call" />
If you were to compile this now, it would look like this:
Got rid of the video call button, but we've introduced new fugliness courtesy of messagebutton_novt and imageclear_novt. I'm really not sure what those are, but they were "next in line" in our layout, and removing videocallbutton revealed them.
Got rid of the video call button, but we've introduced new fugliness courtesy of messagebutton_novt and imageclear_novt. I'm really not sure what those are, but they were "next in line" in our layout, and removing videocallbutton revealed them.
2. GET RID OF _NOVT BUTTONS
Who knows what these are, but the last thing we need is more buttons down here.
a. Apply android:visibility="gone" to the relevant lines:
Who knows what these are, but the last thing we need is more buttons down here.
a. Apply android:visibility="gone" to the relevant lines:
Code:
<ImageButton android:id="@id/messagebutton_novt" android:background="@drawable/call_dial_btn05" [COLOR="Blue"]android:visibility="gone"[/COLOR] android:layout_width="98.66998dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_message_icon_03" android:scaleType="fitXY" android:contentDescription="@string/message" />
<ImageButton android:id="@id/imageclear_novt" android:background="@drawable/call_dial_btn06" [COLOR="Blue"]android:visibility="gone"[/COLOR] android:layout_width="98.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_clear_btn_03" android:scaleType="fitXY" android:contentDescription="@string/description_delete_button" />
If you were to compile it at this point, it would look like this:
Getting warmer.
Getting warmer.
3. CHANGE THE ORDER
I want to have the call button in the middle, so we have to move it.
a. Swap the order of the entries so callbutton is between messagebutton and imageclear
I want to have the call button in the middle, so we have to move it.
a. Swap the order of the entries so callbutton is between messagebutton and imageclear
Code:
<LinearLayout android:orientation="horizontal" android:id="@id/dialbuttonset" android:layout_width="314.0dip" android:layout_height="54.669983dip" android:layout_marginTop="2.6599731dip">
<ImageButton android:id="@id/voicemailbutton" android:background="@drawable/call_dial_btn06" android:visibility="gone" android:layout_width="98.66998dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_voicemail_icon" />
<ImageButton android:id="@id/videocallbutton" android:background="@drawable/call_dial_btn02" android:visibility="gone" android:layout_width="63.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_contacts_icon" android:scaleType="fitXY" android:contentDescription="@string/video_call" />
<ImageButton android:id="@id/messagebutton" android:background="@drawable/call_dial_btn03" android:layout_width="63.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_message_icon_04" android:scaleType="fitXY" android:contentDescription="@string/message" />
[COLOR="Blue"] <ImageButton android:id="@id/callbutton" android:background="@drawable/call_dial_btn01" android:layout_width="98.66998dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_outgoingcall_icon" android:scaleType="fitXY" android:contentDescription="@string/call" />[/COLOR]
<ImageButton android:id="@id/imageclear" android:background="@drawable/call_dial_btn06" android:nextFocusLeft="@id/messagebutton" android:nextFocusRight="@id/callbutton" android:layout_width="63.0dip" android:layout_height="52.899994dip" android:layout_marginLeft="6.0dip" android:layout_marginTop="1.0dip" android:src="@drawable/call_clear_btn_04" android:scaleType="fitXY" android:contentDescription="@string/description_delete_button" />
<ImageButton android:id="@id/messagebutton_novt" android:background="@drawable/call_dial_btn05" android:visibility="gone" android:layout_width="98.66998dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_message_icon_03" android:scaleType="fitXY" android:contentDescription="@string/message" />
<ImageButton android:id="@id/imageclear_novt" android:background="@drawable/call_dial_btn06" android:visibility="gone" android:layout_width="98.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_clear_btn_03" android:scaleType="fitXY" android:contentDescription="@string/description_delete_button" />
</LinearLayout>
So, here's what it would look like now:
Just have to align it
Just have to align it
4. ALIGN IT
So there's many things you could do now. Stretching the message and clear icons to be the same width as the call button by setting android:layout_width="98.66998dip"would result in:
To fix the stretching, you could modify the referenced images. But for simplicity's sake, we are just going to pad the margins so that everything lines up.
a. change the margin of messagebutton to 41.66998dip.
So there's many things you could do now. Stretching the message and clear icons to be the same width as the call button by setting android:layout_width="98.66998dip"would result in:
To fix the stretching, you could modify the referenced images. But for simplicity's sake, we are just going to pad the margins so that everything lines up.
a. change the margin of messagebutton to 41.66998dip.
Code:
<ImageButton android:id="@id/messagebutton" android:background="@drawable/call_dial_btn03" android:layout_width="63.0dip" android:layout_height="54.669983dip" [COLOR="Blue"]android:layout_marginLeft="41.66998dip"[/COLOR] android:src="@drawable/call_message_icon_04" android:scaleType="fitXY" android:contentDescription="@string/message" />
b. Wait, where did that number come from??
c. Since we want everything to line up, it's easy to figure out how far to "push" the message button to the left by looking at the layout of the number area of the dialpad in our xml.
Each button is 98.66998dip wide, preceded by a 6.0dip margin.
messagebutton is 63.0dip wide.
98.66998-63.0==35.66998
Add the original 6.0dip for the left margin==41.66998
d. SIDE NOTE: If you are a perfectionist, you can also make 2 small changes to the imageclear entry at this point to bring the layout in line with the rest of the buttons.messagebutton is 63.0dip wide.
98.66998-63.0==35.66998
Add the original 6.0dip for the left margin==41.66998
i. Remove the section in red (below) from the imageclear entry. (No other button has a top margin)
ii. Change the android:layout_height to 54.669983dip, which is what the rest of the buttons use. I can't imagine why only this button would need a tiny top margin, and smaller height, making it a tiny bit smaller than all the rest of the buttons. Samsung goofiness.
ii. Change the android:layout_height to 54.669983dip, which is what the rest of the buttons use. I can't imagine why only this button would need a tiny top margin, and smaller height, making it a tiny bit smaller than all the rest of the buttons. Samsung goofiness.
Code:
<ImageButton android:id="@id/imageclear" android:background="@drawable/call_dial_btn06" android:nextFocusLeft="@id/messagebutton" android:nextFocusRight="@id/callbutton" android:layout_width="63.0dip" [COLOR="Blue"]android:layout_height="54.669983dip"[/COLOR] android:layout_marginLeft="6.0dip" [COLOR="Red"]android:layout_marginTop="1.0dip"[/COLOR] android:src="@drawable/call_clear_btn_04" android:scaleType="fitXY" android:contentDescription="@string/description_delete_button" />
e. Our final, modified section of xml will look like this:
Code:
<LinearLayout android:orientation="horizontal" android:id="@id/dialbuttonset" android:layout_width="314.0dip" android:layout_height="54.669983dip" android:layout_marginTop="2.6599731dip">
<ImageButton android:id="@id/voicemailbutton" android:background="@drawable/call_dial_btn06" android:visibility="gone" android:layout_width="98.66998dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_voicemail_icon" />
<ImageButton android:id="@id/videocallbutton" android:background="@drawable/call_dial_btn02" android:visibility="gone" android:layout_width="63.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_contacts_icon" android:scaleType="fitXY" android:contentDescription="@string/video_call" />
<ImageButton android:id="@id/messagebutton" android:background="@drawable/call_dial_btn03" android:layout_width="63.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="41.66998dip" android:src="@drawable/call_message_icon_04" android:scaleType="fitXY" android:contentDescription="@string/message" />
<ImageButton android:id="@id/callbutton" android:background="@drawable/call_dial_btn01" android:layout_width="98.66998dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_outgoingcall_icon" android:scaleType="fitXY" android:contentDescription="@string/call" />
<ImageButton android:id="@id/imageclear" android:background="@drawable/call_dial_btn06" android:nextFocusLeft="@id/messagebutton" android:nextFocusRight="@id/callbutton" android:layout_width="63.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_clear_btn_04" android:scaleType="fitXY" android:contentDescription="@string/description_delete_button" />
<ImageButton android:id="@id/messagebutton_novt" android:background="@drawable/call_dial_btn05" android:visibility="gone" android:layout_width="98.66998dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_message_icon_03" android:scaleType="fitXY" android:contentDescription="@string/message" />
<ImageButton android:id="@id/imageclear_novt" android:background="@drawable/call_dial_btn06" android:visibility="gone" android:layout_width="98.0dip" android:layout_height="54.669983dip" android:layout_marginLeft="6.0dip" android:src="@drawable/call_clear_btn_03" android:scaleType="fitXY" android:contentDescription="@string/description_delete_button" />
</LinearLayout>
f. Compile and push to phone and it should look like this:
Last edited: