1. 程式人生 > >Android基礎知識【專案實訓-實現主介面上下兩級導航】【3】

Android基礎知識【專案實訓-實現主介面上下兩級導航】【3】

【該專案實訓是Android基礎知識的一個綜合練習,特別提示:專案中會用到一些圖片素材,都是隨意整理的,稍後會上傳一個資源,包含該事項專案的基本功能,也含有圖片素材

【專案題目】:校園訂餐App設計 綜合案例 【目標】

歡迎介面過後,應該顯示app的主介面了,根據【UI設計指導】中的規劃,主介面採用上下兩級標籤導航。這部分是app開發中比較麻煩的一塊。

1、先來看一下,最終的效果吧,這樣做起來比較有底:

預設顯示的主介面,下部是主導航,上面是二級導航,預設開啟的是“促銷打折”這一版面


促銷打折分為 “今日活動” 和 “今日折扣”。活動包括打折 ,而且還有商家搞得 “買一送一、送甜點等其他形式”【這部分功能,應該在二期的專案實訓中,設計開發商家客戶端才能實現】


使用者沒有登入,無法檢視賬單資訊,賬單有未付和 歷史。歷史賬單都是已經 支付過的和取消的。


這個相當於一個比較全的主介面了,包含的功能非常多,專案設計指導中的功能,基本涵蓋在此。


2、下面開始細說 程式碼,由於主介面程式碼比較多,該部分將分多篇寫完。

首先是標題樣式的問題:更改標題樣式有很多種方式,這使用 修改樣式的方案:

2.1 這是styles。xml種的涉及樣式的程式碼,注意是將ActionBar的背景顏色 和 字型顏色給修改了。

<!-- Application theme. -->
    <style name="AppTheme" parent="AppBaseTheme">
        <item name="android:actionBarStyle">@style/my_actionbar_style</item>
    </style>

    <style name="my_actionbar_style" parent="@android:style/Widget.Holo.Light.ActionBar">
        <item name="android:background">#993333</item>
        <item name="android:titleTextStyle">@style/my_actionbar_title</item>
    </style>

    <style name="my_actionbar_title" parent="@android:style/TextAppearance.Holo.Widget.ActionBar.Title">
        <item name="android:textColor">#CCCCCC</item>
        <item name="android:textSize">14sp</item>
    </style>
2.2  actionBar上有個選單,其程式碼檔案如下:

該檔案是main。xml是位於 res/menu/下的。

<menu xmlns:android="http://schemas.android.com/apk/res/android" >

    <item
        android:id="@+id/menu_shopcat"
        android:orderInCategory="100"
        android:showAsAction="always"
        android:icon="@drawable/shopcat"
        android:title="購物車"/>
    <item
        android:id="@+id/menu_more"
        android:orderInCategory="101"
        android:showAsAction="always"
        android:icon="@drawable/more"
        >
		<menu>
		    <group>
				<item 
				    android:id="@+id/menu_info"
			        android:orderInCategory="201"
				    android:title="個人資訊"
				    android:icon="@drawable/role"
				    />		        
				<item 
				    android:id="@+id/menu_setting"
			        android:orderInCategory="202"
				    android:title="系統設定"
				    android:icon="@drawable/set"
				    />		        
				<item 
				    android:id="@+id/menu_exit"
			        android:orderInCategory="203"
				    android:title="退出系統"
				    android:icon="@drawable/exit"
				    />		        
		        
		    </group>
		</menu>        
    </item>
	
</menu>

這篇先到這。