[Sony Ericsson XPERIA X10 Mini] Emperor.dk:
XML walk through (2 of 2)

If I got something wrong, please correct me :)

Please don't QUOTE everything if you REPLY, it will make the thread look ridiculous

Status messages

Next we got some status messages:

<LinearLayout android:orientation="vertical" android:id="@id/status_box" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@id/date">
<TextView android:textAppearance="?textAppearanceMedium" android:ellipsize="end" android:id="@id/status_charging" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="24.0dip" android:layout_marginTop="2.0dip" android:maxLines="2" android:drawablePadding="4.0dip" />
<TextView android:textAppearance="?textAppearanceMedium" android:ellipsize="end" android:id="@id/status_alarm" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="24.0dip" android:layout_marginTop="2.0dip" android:maxLines="2" android:drawableLeft="@drawable/ic_lock_idle_alarm" android:drawablePadding="4.0dip" />
<TextView android:textAppearance="?textAppearanceMedium" android:ellipsize="end" android:id="@id/status_calendar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="24.0dip" android:layout_marginTop="2.0dip" android:maxLines="2" android:drawableLeft="@drawable/ic_lock_idle_calendar" android:drawablePadding="4.0dip" />
</LinearLayout>
<TextView android:textAppearance="?textAppearanceSmall" android:id="@id/customMsg" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="24.0dip" android:layout_marginTop="0.0dip" android:layout_marginRight="24.0dip" android:layout_below="@id/status_box" />
<TextView android:textAppearance="?textAppearanceMedium" android:id="@id/screenLocked" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="24.0dip" android:layout_marginTop="2.0dip" android:drawablePadding="4.0dip" android:layout_below="@id/customMsg" />

LinearLayout

This is a linear layout element that arranges its children-elements in a single column or a single row. Much more easy when you just wants to make a list or side-by-side elements.

Lets look at the arguments for the LinearLayout parent:

android:orientation="vertical"

This sets the orientation of the elements inside the parent. Horizontal for a row and vertical for a culomn.

android:id="@id/status_box"

Sets the parent ID.

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:layout_below="@id/date"

Already covered above.

Inside the LinearLayout we got 3 TextView elements:

<TextView android:textAppearance="?textAppearanceMedium" android:ellipsize="end" android:id="@id/status_charging" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="24.0dip" android:layout_marginTop="2.0dip" android:maxLines="2" android:drawablePadding="4.0dip" />
<TextView android:textAppearance="?textAppearanceMedium" android:ellipsize="end" android:id="@id/status_alarm" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="24.0dip" android:layout_marginTop="2.0dip" android:maxLines="2" android:drawableLeft="@drawable/ic_lock_idle_alarm" android:drawablePadding="4.0dip" />
<TextView android:textAppearance="?textAppearanceMedium" android:ellipsize="end" android:id="@id/status_calendar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="24.0dip" android:layout_marginTop="2.0dip" android:maxLines="2" android:drawableLeft="@drawable/ic_lock_idle_calendar" android:drawablePadding="4.0dip" />

There are only a few new arguments that are not already covered above:

android:maxLines="2"

This is to limit the lumber of lines that the text will take up on the lockscreen. It is a very small screen, 1 line should realy have been the limit.

android:drawableLeft="@drawable/ic_lock_idle_alarm"

This adds the small icons to the left of the text line.

The text them selfs are supplied by the XML parser via reference to the element IDs.

Outside the LinearLayout parent we got two more status messages calles customMsg and screenLocked.

<TextView android:textAppearance="?textAppearanceSmall" android:id="@id/customMsg" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="24.0dip" android:layout_marginTop="0.0dip" android:layout_marginRight="24.0dip" android:layout_below="@id/status_box" />
<TextView android:textAppearance="?textAppearanceMedium" android:id="@id/screenLocked" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="24.0dip" android:layout_marginTop="2.0dip" android:drawablePadding="4.0dip" android:layout_below="@id/customMsg" />

One of these i belive is used to popup the temperary text message when sound settings is changed from the right lock-tab.

As the XML parser might expect to find elements with these IDs it's better to keep them :)

(later we can do some experiments to se if I'm right)

The unlock tabs

The unlock tabs are mixed into the music controls and a hidden emergancy call button.

Here is an important thing to notice: The elements are placed on the screen in the order they appear in the XML, this means, that we can controle what element is on top of what other elements (like layers in Photoshop).

By putting a part of the music controls (the CD cover) before the unlock tabs, the CD cover will be behind the tabs.

Let's isolate the unlock tabs:

<com.android.internal.widget.SlidingTab android:orientation="horizontal" android:id="@id/tab_selector2" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="128.0dip" android:layout_alignParentBottom="true" />
<com.android.internal.widget.SlidingTab android:orientation="horizontal" android:id="@id/tab_selector" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="60.0dip" android:layout_alignParentBottom="true" />
<com.android.internal.widget.RotarySelector android:orientation="horizontal" android:id="@id/rotary_selector" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" />
<com.android.internal.widget.RingSelector android:orientation="horizontal" android:id="@id/ring_selector" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_alignParentBottom="true" />

Again these are special elements so the XML parser knows that this is the unlock tabs. Depending on what lockscreen style is chosen (Sliding, Rotary or Ring) is shown.

Notice that SlidingTab got two elements depending on activation of 3rd app or not.

Most of the arguments are already covered above, but we got som new interesting ones.

android:layout_alignParentBottom="true"

This is set for all the unlock-elements, and positions all elements at the buttom of the screen.

The two sliding tab elements has some special aditions:

android:layout_marginBottom="128.0dip"

android:layout_marginBottom="60.0dip"

It's already covered above, but deserves to be mentioned. It lifts the two sliders up from the buttom by 60 and 128 dip. So it should be possible to lower them a little to make more room on the screen.

Music controls

Let's isolate the music controles:

<ImageButton android:id="@id/albumArt" android:background="@color/transparent" android:padding="3.0px" android:visibility="gone" android:layout_width="105.0dip" android:layout_height="105.0dip" android:layout_marginTop="4.0dip" android:scaleType="fitCenter" android:adjustViewBounds="true" android:layout_above="@id/musicNowPlaying" android:layout_centerInParent="true" />
<ImageButton android:id="@id/musicControlPlay" android:background="@color/transparent" android:padding="5.0px" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_media_play" android:layout_alignParentBottom="true" android:layout_centerInParent="true" />
<ImageButton android:id="@id/musicControlPause" android:background="@color/transparent" android:padding="5.0px" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_media_pause" android:layout_alignParentBottom="true" android:layout_centerInParent="true" />
<ImageButton android:id="@id/musicControlPrevious" android:background="@color/transparent" android:padding="5.0px" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="20.0dip" android:src="@drawable/ic_media_previous" android:layout_toLeftOf="@id/musicControlPause" android:layout_alignParentBottom="true" />
<ImageButton android:id="@id/musicControlNext" android:background="@color/transparent" android:padding="5.0px" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="20.0dip" android:src="@drawable/ic_media_next" android:layout_toRightOf="@id/musicControlPause" android:layout_alignParentBottom="true" />
<TextView android:textAppearance="?textAppearanceSmall" android:ellipsize="marquee" android:gravity="center" android:id="@id/musicNowPlaying" android:paddingTop="10.0dip" android:focusable="true" android:focusableInTouchMode="true" android:layout_width="wrap_content" android:layout_height="wrap_content" android:lines="1" android:scrollHorizontally="true" android:singleLine="true" android:layout_above="@id/musicControlPause" android:layout_centerInParent="true" android:layout_alignWithParentIfMissing="true" android:marqueeRepeatLimit="marquee_forever" />

First we notice that all elements got this argument:

android:visibility="gone"

To no surprise this means that the elements don't show, but again the XML parser changes this acording to your settings in the lockscreen widget menu for displaying music controls.

Other than that, only noticeable element is in the TextView that scrolls the song title:

android:ellipsize="marquee"

android:marqueeRepeatLimit="marquee_forever"

If the text is to loong for the screen it's cut off and scrolls. And it scrolls forever :)

Emergency Call Button

Last we will mention the Emergency Call Button

<Button android:id="@id/emergencyCallButton" android:visibility="gone" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginBottom="62.0dip" android:drawableLeft="@drawable/ic_emergency" android:drawablePadding="8.0dip" android:layout_alignParentBottom="true" android:layout_centerInParent="true" style="@style/Widget.Button.Transparent" />

Better leave it there even if it's never used. The XML parser might expect it, and will fail if it's missing.

Happy modding :laugh:

In my next post we will edit and rearange the elements.