Android應用開發(fā)案例教程課件

張霞深圳職業(yè)技術學院Android應用開發(fā)案例教程（AndroidStudio第二版）

第8章

分享美食Android應用開發(fā)案例教程（AndroidStudio第二版）8.1項目介紹8.2項目制作8.3項目可拓展的地方章目錄8.1項目介紹8.1.1主要技術8.1.2運行截屏8.1.3項目的圖片資源8.1.4項目的JSON資源8.1.5項目的文件清單8.1.6工程準備8.1項目介紹寫這個項目的初衷有兩個：1這門課程的期末考核方案可以是課程設計、機試，或筆試，如果采用課程設計考核學生，教師最好能展示一個樣本，有完整主題，有多種布局呈現(xiàn)，讓學生有一個模仿和參考樣本。2這門課如果安排了實訓學時，在學生實訓操作中，一個適當規(guī)模的樣本，能給學生啟發(fā)、模仿和拓展，而且拓展的空間要盡可能大一些。本次設計的App主題為分享美食，介紹八大菜系和一些菜譜，圖文并茂。8.1.1主要技術App主題為分享美食。美食愛好者都喜歡收集一些菜譜，這里使用個人收集的文字和圖片作為素材。項目主頁采用流行的側滑菜單(Menu)和卡片視圖(CardView)，自定義圖標，項目從網(wǎng)絡獲取和解析JSON數(shù)據(jù)。項目使用了多種布局呈現(xiàn)效果：CardView卡片式布局NavigationView導航視圖RecyclerView循環(huán)調用CollapsingToolbar折疊效果CardView適用于實現(xiàn)卡片式布局效果，實際上CardView也是一個Framelayout，只是額外提供了圓角和陰影效果，看上去有立體的感覺。我們可以在CardView上添加一個布局，再加入文字和圖片。8.1.1主要技術——卡片視圖CardViewCardView布局8.1.1主要技術——導航視圖NavigationViewNavigationView通常與抽屜布局(Drawerlayout)結合使用，實現(xiàn)良好的側滑體驗，側滑默認是左側側滑。NavigationView有兩個屬性，分別headerlayout和menu，headerlayout用于顯示頭部的布局，menu用于建立菜單。NavigationView8.1.1主要技術——循環(huán)視圖RecyclerViewRecyclerView循環(huán)視圖，適用于批量數(shù)據(jù)展示，與經(jīng)典的Listview相比，更加強大和靈活。RecyclerView循環(huán)調用數(shù)據(jù)8.1.1主要技術——折疊CollapsingToolbarCollapsingToolbar折疊效果，可使圖片和文字滾動，可設置顏色和背景，也可設置title部分不滾動。CollapsingToololbar效果8.1.2運行截屏主頁主頁的側滑菜單尚待建設頁面8.1.2運行截屏作品列表作品內容

上作品內容下8.1.3項目的圖片資源SVG意為可縮放矢量圖形（ScalableVectorGraphics），使用XML格式定義圖像。SVG圖標可用作Web應用程序或移動應用程序的圖標或圖像按鈕，也可用作徽標。使用SVG圖標的優(yōu)點：1、可以輕松地按比例放大和縮小圖標，具體取決于要顯示的位置及屏幕尺寸。2、優(yōu)于位圖，按比例放大或縮小時SVG圖標仍然看起來不錯。位圖放大時趨于像素化，縮小時會失去像素。SVG圖標SVG文件的導入方法鼠標右鍵單擊res的drawable文件夾，new->VectorAsset->Localfile命令（如下左圖），再選擇相應的路徑將svg文件導入，就會出現(xiàn)對應的xml文件（如下右圖）。

8.1.3項目的圖片資源下圖是導入drawable的素材文件，導入的是后綴名為.svg的圖標文件和三個png文件。App會通過網(wǎng)絡JSON文件中的地址，調用相應的網(wǎng)絡圖片，查看其中的img屬性就可見到網(wǎng)絡地址。導入工程的圖標、圖片導入的圖片資源網(wǎng)絡訪問的圖片

例如"img":"/images/2022/07/02/shu.jpg"8.1.4項目的JSON資源-÷×+項目的JSON資源是一個JSON文件。需要在網(wǎng)上存放這個JSON資源。一個辦法是去開源網(wǎng)站申請一個免費空間，但是這樣的免費空間不能保證一直能正常使用。第二個辦法是搭建一個臨時的網(wǎng)站，到根目錄新建test路徑，放入JSON文件，使用localhost服務器來測試項目。https:///test/food.json點擊下載food.json文件數(shù)據(jù)存放網(wǎng)址/p/education/d/education/git/raw/master/food.json-÷×8.1.4項目的JSON資源免費空間沒辦法保證能使用多久，建議搭建一個測試網(wǎng)站以供練習。如果將本機作為web服務器，ip地址localhost或者均不能作為手機模擬器的訪問網(wǎng)址，Android給的ip是，例如放到web服務器的test路徑，https:///test/food.json點擊下載food.json文件工程名稱是AzureCG項目共有8個java文件，其中有3個是Activity文件。項目共有12個xml文件，其中8個是布局文件，1個Menu文件，3個是Values文件。8.1.5項目的文件清單Value目錄專門用于存放項目使用到的各類數(shù)據(jù)目錄，不同類型的數(shù)據(jù)存放在不同的文件中。312strings.xml：定義字符串和數(shù)值colors.xml：定義顏色和顏色字串數(shù)值styles.xml：定義樣式8.1.5項目的文件清單項目的java文件項目的drawable文件夾項目的XML文件工程項目名稱是Azurecg。教材提供的main壓縮包已經(jīng)把素材、一些簡單的布局文件和Java文件放里面了，讀者請先創(chuàng)建工程項目Azurecg，包名是com.myapp.azurecg.azurecg，然后復制main文件夾到工程，即可開始后面的工作。關于main文件夾的簡要說明:8.1.6工程準備相應的素材資源已提供在drawable目錄下將values下的strings.xml件進行如下修改，方便后面的Activity調用：12<resources>

<stringname="app_name">AzureCG</string>

<stringname="open">Open</string>

<stringname="close">Close</string>

<stringname="hello_blank_fragment">Helloblankfragment</string>

</resources>注意：main壓縮包里的colors.xml和style.xml與工程自動創(chuàng)建的文件相比，有添加。8.1.6工程準備若工程缺少相應的包，需檢查一下的GredleScript下build.gredle(Project:Azurecg)以及build.grade(Module：app)是否存在。項目運行時應保持聯(lián)網(wǎng)狀態(tài)。在注冊文件AndroidManifest.xml中添加聯(lián)網(wǎng)許可授權。

<uses-permissionandroid:name="android.permission.INTERNET"/>348.1項目介紹8.2項目制作8.3項目可拓展的地方章目錄8.2.1完善主布局文件8.2.2側滑菜單的跳轉8.2.3設計列表的布局文件8.2.4完善主控制文件8.2.5ReyclerViewAdapter適配器8.2.6設計列表的控制文件8.2.7設計內容的控制文件8.2.8完善配置文件8.2項目制作8.2.1完善主布局文件主頁布局文件activity_main.xml包含卡片視圖設計和菜單選項設計，需要分三步完成。設計主頁的第一個CardView（卡片視圖）框架，其ID為@+id/anime_card。在activity_main.xml中查找注釋“<!--美食卡片視圖-->”，然后在CardView標簽下嵌套一個線性布局，加入布局代碼。步驟一創(chuàng)建菜單選項，設計drawermenu.xml文件。先在res文件夾下創(chuàng)建menu文件夾，鼠標右鍵單擊menu文件夾，選擇new->menuresoursefile命令創(chuàng)建該XML文件。該文件類型為menu，存儲為res/layout/menu/drawermenu.xml。步驟二8.2.1完善主布局文件設計側滑欄菜單NavigationView。需要注意的是，NavigationView必須設計在<drawlayout>標簽內部的最后位置。在activity_main.xml中查找注釋“<!--在這個位置加入NavigationView，很重要!-->”，然后在標簽</android.support.v4.widget.DrawerLayout>前嵌套如下代碼：步驟三<

android.support.design.widget.NavigationView

android:id="@+id/nv"

android:layout_width="wrap_content"

android:layout_height="match_parent"

android:layout_gravity="start"

android:background="@color/white"

app:headerLayout="@layout/drawer_header"

app:itemIconTint="@color/darkgray"

app:itemTextColor="@color/darkgray"

app:itemBackground="?android:attr/selectableItemBackground"

app:menu="@menu/drawermenu">

<

/android.support.design.widget.NavigationView>

8.2.1完善主布局文件步驟三的菜單選項設計（drawermenu.xml）完成，就可以看看頭部設計效果。頭部設計（drawer_header.xml）是個簡單的線性布局，已經(jīng)在main壓縮包中，直接調用。它的效果如下左圖，在后面項目運行正常時會呈現(xiàn)下面的效果。drawer_header.xml的設計效果activity_main.xml布局效果activity_main.xml布局融合了頭部設計drawer_header.xml和菜單選項設計drawermenu.xml8.2.2側滑菜單的跳轉單擊側滑欄菜單，可跳轉到不同的Fragment界面。Fragment（碎片）為適配大屏幕的Android設備而設立?？梢园袴ragment當成界面的組成部分，一個Activity的界面可以由多個不同的Fragment組成。Fragment擁有自己的生命周期，可以接收、處理用戶的事件，減少程序員在Activity里編寫事件處理的工作。更為重要的是，可以動態(tài)地添加、替換和移除某個Fragment。項目只簡單創(chuàng)建3個Fragment文件用來測試，3個文件分別是fragment_collection.xml、fragment_home.xml、fragment_logout.xml。8.2.2側滑菜單的跳轉創(chuàng)建Fragment類在資源目錄res的layout文件夾中創(chuàng)建Fragment類，且類型為Fragment(Blank)。鼠標右鍵單擊layout文件夾，選擇new->Fragment->Fragment(Blank)命令，分別命名為Collection、Home、Logout，名字的首字母要大寫，系統(tǒng)會自動生成相應的Java文件。12fragment_collection.xml需做輕微修改，加背景圖并修改文字。fragment_home.xml及fragment_logout.xml不用做任何修改。8.2.3設計列表的布局文件在“主頁”界面點擊“美食”，跳轉到作品列表，作品列表布局文件是activity_list.xml。作品列表界面里有美食的八大菜系，單擊菜系后，可以跳轉到相應菜系的介紹界面。設計列表布局前，需要先設計列表的行布局list_row_item.xml文件，雖然列表文件沒有直接引用該xml文件，但java程序會調用行布局文件。列表布局和列表行布局都放在layout文件夾。列表行布局效果8.2.4完善主控制文件設計完布局后，完善控制程序，首先對actvities包的MainActivity文件進行補充。左側功能欄的跳轉單擊左側菜單時，程序將原本的主頁設置為隱藏（其ID為layout_home），顯示幀布局（其ID為flcontent），再通過MainActivity文件控制幀布局的信息。當再次單擊主頁時，程序組再恢復主頁設置為顯示（其ID為layout_home）。12主頁卡片視圖（CardView）的跳轉程序的重點是調用Intent，將打包好的數(shù)據(jù)傳遞給ListActivity。8.2.5ReyclerViewAdapter適配器RecyclerView可以替代ListView和GridView顯示列表數(shù)據(jù)和網(wǎng)格數(shù)據(jù)，它需要RecyclerView.Adapter適配器，它的調用會被放到后面的ListActivity程序來介紹。創(chuàng)建一個RecyclerViewAdapter類，用于將打包好的數(shù)組進行統(tǒng)一處理。給每個數(shù)據(jù)項設置監(jiān)聽，并將數(shù)據(jù)用Intent打包后傳送給特定的Activity。128.2.6設計列表的控制文件下面對八大菜系列表的控制文件ListActivity.Java進行代碼補充。接收JSON數(shù)據(jù)根據(jù)MainActivity傳過來的數(shù)據(jù)進行相應的操作，例如，在MainActivity中已經(jīng)給Intent對象賦值putExtra("Itemtitle","美食")，那么這里的任務就是將“美食”標簽對應的網(wǎng)址取出來，要顯示的美食信息來自網(wǎng)絡JSON文件。12JSON數(shù)據(jù)解析對從網(wǎng)絡獲取的JSON數(shù)據(jù)進行處理，將JSON數(shù)據(jù)添加到數(shù)組，并將數(shù)據(jù)顯示到ListActivity，需要調用model包的ListItem類。8.2.7設計內容的控制文件對ListItemActivity.java進行補充。該程序可對上一個程序RecyclerViewAdapter中單擊列表后傳過來的數(shù)據(jù)進行處理。打開布局文件activity_list_item.xml顯示具體信息，該布局設計效果如圖所示。在ListItemActivity.java中添加代碼。

川菜的內容頁8.2.7完善配置文件配置文件manifest的完整代碼如下：<?xmlversion="1.0"encoding="utf-8"?><manifestxmlns:android="/apk/res/android"package="com.myapp.azurecg.azurecg"><!--在這里加入聯(lián)網(wǎng)代碼--><uses-permissionandroid:name="android.permission.INTERNET"/><applicationandroid:allowBackup="true"android:icon="@mipmap/ic_launcher"android:label="@string/app_name"