布局采用LinearLayout来实现(比较喜欢这个布局,在UI之前要有全局考虑的思想,操作起来比较简单),每一个菜单都是一个Linear块,内部是一个ImageView和一个TextView;一共做了两个界面点击互相切换,下面是效果截图:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android= "http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" > <LinearLayout android:layout_width="wrap_content" android:layout_height="fill_parent" android:layout_weight="1" android:orientation="vertical" android:padding="20dp" > <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <LinearLayout style="@style/menu_item_block_orange"> <ImageView style="@style/menu_item_img" android:src="@drawable/menu_icon_mail" /> <TextView style="@style/menu_item_txt" android:text="短信息" /> </LinearLayout> <LinearLayout style="@style/menu_item_block_orange" android:layout_marginLeft="5dp" > <ImageView style="@style/menu_item_img" android:src="@drawable/menu_icon_calendar"/> <TextView style="@style/menu_item_txt" android:text="日历" /> </LinearLayout> </LinearLayout> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginTop="5dp" android:orientation="horizontal" > <LinearLayout style="@style/menu_item_block_orange"> <ImageView style="@style/menu_item_img" android:src="@drawable/menu_icon_phone" /> <TextView style="@style/menu_item_txt" android:text="电话" /> </LinearLayout> <LinearLayout style="@style/menu_item_block_orange" android:layout_marginLeft="5dp"> <ImageView style="@style/menu_item_img" android:src="@drawable/menu_icon_gmail" /> <TextView style="@style/menu_item_txt" android:text="Gmail" /> </LinearLayout> </LinearLayout>