以下实例是想做一个界面: 这个界面全屏显示,有背景图片, 可以显示Wifi和有线网络是否连通. 可以显示当前日期,时间. 并有横竖两排ICON. 每个Icon代表一个App,点击则进入。
咱们一步一步向下走:
1. 加背景图片,并使之全屏:
layout/main.xml如下:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/bg2"
>
</RelativeLayout>
在res/drawable-hdpi/目录下添加bg2.png图片作为背景图片。
之后在layout xml文件中加入:
android:background="@drawable/bg2"
在AndroidManifest.xml的Activity项目,添加如下语句,表明Activity全屏。
android:theme="@android:style/Theme.NoTitleBar.Fullscreen"
2. 在屏幕的左上方,放置两个小图示,分别显示Wifi和有线网络的状态。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/bg2"
>
<!--
SamInfo: This is Wifi and net status icon
-->
<LinearLayout
android:id="@+id/ll_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="left|center_vertical"
android:orientation="horizontal" >
<Button
android:id="@+id/bar_wifiInfo"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_marginLeft="50dp"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:background="@drawable/wifi_network"
android:enabled="false"
android:focusable="false" />
<Button
android:id="@+id/bar_netInfo"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:background="@drawable/et_network"
android:enabled="false"
android:focusable="false" />
</LinearLayout>
</RelativeLayout>
本例中, 有两层ViewGroup, 外层ViewGroup为: Relative. 它包含另一个ViewGroup---Linear. 而Linear中则包含两个View元素。Button。因为Linear并没有指出和父ViewGroup的位置关系。所以可以认为Linear和Relative左上角重合。
在后面需要加入真正的几个Button. 他们没什么特别之处. 唯一需要注意的是:
android:focusableInTouchMode="true"
在STB中,如果没有这个参数,则使用遥控器可以正常选中某Button焦点,然后进入. 但使用鼠标或Touch时,则点击直接进入. 没有焦点变化.
<Button
android:id="@+id/hotapp"
android:layout_width="0dp"
android:layout_height="180.0dip"
android:layout_weight="1"
android:clickable="true"
android:focusable="true"
android:descendantFocusability="blocksDescendants"
android:paddingTop="10dp"
android:focusableInTouchMode="true"
android:background="@drawable/add_bg"
/>
前面看到,Button在状态改变时,希望使用不同的背景图片. 如被焦点变化,被点击等等. 我们采用标准做法----背景选择器(selector).
例如前面的:@drawable/wifi_network, @drawable/add_bg。 其实都是背景选择器。
举例详解如下:
selector创建:
在res/drawable目录下,创建xml文件如下:
<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="@drawable/doc_bg_se_p1" />
<item android:state_pressed="true" android:drawable="@drawable/doc_bg_se_p1" />
<item android:state_focused="true" android:drawable="@drawable/doc_bg_se_p1" />
<item android:drawable="@drawable/doc_bg" />
</selector>
讲解如下:
A:<item android:drawable="@drawable/doc_bg" />
默认状态下,采用doc_bg这张图片。图片位置在res/drawable或res/drawable-xxxx
B: <item android:state_selected="true" android:drawable="@drawable/doc_bg_se_p1" />
选中状态下,所采用的图片。
C:<item android:state_pressed="true" android:drawable="@drawable/doc_bg_se_p1" />
按下状态下,所采用的图片。
D:<item android:state_focused="true" android:drawable="@drawable/doc_bg_se_p1" />
焦点状态下,所采用的图片。
其它还有:
state_window_focused="false":没有焦点时的图片。
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true">
<shape android:shape="rectangle">
<corners android:radius="5dp" />
<solid android:color="#E08530"/>
<stroke android:dashGap="0dp" android:dashWidth="1dp" android:width="2dp" android:color="#33b5e5" />
</shape>
</item>
<item>
<color android:color="#0000" />
</item>
</selector>
说明:
缺省为:
<item>
<color android:color="#0000" />
</item>
即没有任何变化。原始状态。
有焦点时:
<item android:state_focused="true">
<shape android:shape="rectangle">
<corners android:radius="5dp" />
<solid android:color="#E08530"/>
<stroke android:dashGap="0dp" android:dashWidth="1dp" android:width="2dp" android:color="#33b5e5" />
</shape>
</item>
详细分析:
shape:自定义图形(能使用6个子标签)
gradient -- 对应颜色渐变。 startcolor、endcolor就不多说了。 android:angle 是指从哪个角度开始变。
solid -- 填充。
stroke -- 描边。
corners -- 圆角。
padding -- 定义内容离边界的距离。