我的第一个Android应用小程序
2022年夏季《移動軟件開發(fā)》實驗報告
一、實驗?zāi)繕?/strong>
1、學習使用快速啟動模板創(chuàng)建小程序的方法;2、學習不使用模板手動創(chuàng)建小程序的方法。
二、實驗步驟
列出實驗的關(guān)鍵步驟、代碼解析、截圖。
1、搭建安卓開發(fā)環(huán)境
首先我們需要下載jdk,然后創(chuàng)建一個英文名稱的文件夾(盡量別用中文),將下載好的 jdk 保存至該目錄下,然后進入java SE的安裝頁面,點擊下一步之后,修改好想要安裝的文件夾(此處選擇默認路徑),之后再點擊下一步。下載好jre之后,再點擊下一步,這就安裝好了jdk和jre。
安裝好了JDK之后,我們就可以配置環(huán)境變量了,首先鼠標右鍵此電腦 - 屬性 - 高級系統(tǒng)設(shè)置,再選擇環(huán)境變量,點擊環(huán)境變量之后,點擊新建。添加配置了,其中變量名為Java_Home,變量值為jdk 的安裝目錄,新建好了,點擊確定保存。最后添加Path的配置即可。
我們來檢測配置是否成功。
win + R 再輸入 cmd 回車,打開命令窗口 輸入java 回車
再輸入java -version 命令查看系統(tǒng)的全局 jdk 版本
此時可見JAVA環(huán)境已經(jīng)配置好了,環(huán)境變量也配置好了
接下來就可以安裝Android studio了。
首次運行時,因為我們沒有SDK,所以系統(tǒng)會去檢測環(huán)境,這里選擇Cancel 即可,設(shè)置自定義的地方先使用默認的即可,直接Next下一步,然后會出現(xiàn)一些關(guān)于SDK的協(xié)議,選擇Accept接受協(xié)議,然后點擊Finish,再跳過導入自己的設(shè)置,然后選擇開發(fā)工具的主題,進行主要涵蓋了一些SDK等內(nèi)容的開發(fā)工具主要設(shè)置,然后直接Next下一步
安裝好了Android studio之后的界面如下:
然后點擊加號創(chuàng)建項目
然后選擇Empty Activity,創(chuàng)建空的頁面app
創(chuàng)建項目的重要頁面,我們需要把項目語言那里改成JAVA,創(chuàng)建了之后,因為我們是首次運行
需要下載一些運行項目的庫,讓開發(fā)工具自行下載一個運行所需的jar包就可以了。
這樣,安卓開發(fā)環(huán)境就搭建好了
2、理清設(shè)計的思路
頁面上主要包含5組列表,每組列表包含1-2個列表項。
其中,列表組1為“朋友圈”單行列表項,列表組2為“掃一掃”和“搖一搖”兩行列表項,列表組3為“看一看”和“搜一搜”兩行列表項,列表組4為“購物”和“游戲”兩行列表項,列表組5為“小程序”單行列表項。
3、設(shè)計一個外部總垂直布局,包含所有的列表組
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent" //寬度自適應(yīng)滿屏android:background="#e5e5e5" //設(shè)置背景顏色android:orientation="vertical" //vertical是縱向布局的意思,即將容器內(nèi)的控件進行縱向排列android:layout_height="match_parent"> //高度自適應(yīng)滿屏</LinearLayout>android:background="#e5e5e5"是對父布局進行設(shè)置背景色,android:orientation="vertical"是設(shè)置父布局的垂直方向,android:layout_width="match_parent"和android:layout_height=“match_parent”>是分別設(shè)置寬度和高度大小,這樣,父布局就創(chuàng)建好了
4、構(gòu)建第一個列表組
<LinearLayoutandroid:layout_width="match_parent" //寬度自適應(yīng)滿屏android:layout_height="60dp" //高度設(shè)置為60dpandroid:background="#fff" //設(shè)置背景顏色android:orientation="horizontal"> //設(shè)置垂直方向為橫向<ImageView //創(chuàng)建圖標android:layout_width="40dp" //圖標的高度為40dpandroid:layout_height="40dp" //圖標的寬度為40dpandroid:layout_gravity="center_vertical" //設(shè)置居中android:layout_marginLeft="15dp" //設(shè)置與左邊的距離為15dpandroid:src="@mipmap/pengyouquan" /> //放入圖片作為圖標<TextView //創(chuàng)建列表組中的漢字android:layout_marginLeft="10dp"android:textStyle="bold" //設(shè)置字體樣式為粗體android:textColor="#333" //設(shè)置字體顏色android:textSize="18dp" //設(shè)置字體大小為18dpandroid:gravity="center_vertical" //設(shè)置字體居中android:layout_weight="1"android:text="朋友圈" //設(shè)置文字為“朋友圈”android:layout_width="0dp"android:layout_height="match_parent"/><ImageView //創(chuàng)建列表組右邊的箭頭android:layout_width="18dp" //設(shè)置寬度為18dpandroid:layout_height="18dp" //設(shè)置高度為18dpandroid:layout_gravity="center_vertical" //設(shè)置水平居中android:layout_marginRight="20dp" //設(shè)置與右邊的距離為20dpandroid:src="@mipmap/right" /> //添加箭頭圖片</LinearLayout>這部分是構(gòu)建第一個列表組,設(shè)置寬度為自適應(yīng)滿屏,設(shè)置背景色,設(shè)置垂直方向為橫向。
創(chuàng)建列表組里的第一個圖標,圖標的高度為40dp,設(shè)置背景色,設(shè)置與左邊的距離為15dp,設(shè)置居中。
創(chuàng)建列表組中的漢字,設(shè)置文字為“朋友圈”,設(shè)置寬度為18dp,設(shè)置字體顏色,設(shè)置字體樣式為粗體,設(shè)置字體大小為18dp,設(shè)置與左側(cè)的距離,設(shè)置字體居中。
創(chuàng)建列表組右邊的箭頭,設(shè)置寬度為18dp,設(shè)置高度為18dp,設(shè)置背景,設(shè)置水平居中,設(shè)置與右邊的距離為20dp
此時,我們第一個【朋友圈】列表組就構(gòu)建完成了
預(yù)覽效果如圖:
按照構(gòu)建【朋友圈】列表組的方法,依次構(gòu)建剩下的四個列表組即可
5、對五個列表組之間進行間隔樣式搭建
構(gòu)建好了五個列表組之后,我們還需要對五個列表組之間進行間隔樣式搭建,使界面看起來更整潔
我的思路是創(chuàng)建一個組件,里面就填充背景顏色即可
代碼如下:
<LinearLayoutandroid:layout_width="match_parent" //寬度自適應(yīng)android:layout_height="20dp" //高度設(shè)為20dpandroid:background="#e5e5e5" //顏色與背景顏色一致android:orientation="horizontal"></LinearLayout>該組件的寬度為自適應(yīng),顏色與背景顏色一致,高度設(shè)為20dp
我們還需要分別在對五個列表組之間都加入上述一樣的組件,這樣就實現(xiàn)了對五個列表組之間的間隔樣式搭建
6、對每個列表組的內(nèi)部進行間隔樣式搭建
實現(xiàn)了對五個列表組之間的間隔樣式搭建之后,需要對每個列表組的內(nèi)部進行間隔樣式搭建,我的思路和對五個列表組之間進行間隔樣式搭建這部分的思路十分類似,也是創(chuàng)建一個組件,里面就填充背景顏色即可,只是將組件的高度改小了一點
代碼如下:
<LinearLayoutandroid:layout_width="match_parent" //寬度自適應(yīng)android:layout_height="2dp" //高度設(shè)為2dpandroid:background="#e5e5e5" //顏色與背景顏色一致android:orientation="horizontal"></LinearLayout>該組件的寬度為自適應(yīng),顏色與背景顏色一致,高度設(shè)為2dp
此時所有任務(wù)就完成了
此時應(yīng)用的預(yù)覽效果如下圖所示:
三、程序運行結(jié)果
列出程序的最終運行結(jié)果及截圖。
在Android studio的界面如下:
在手機上運行的界面如下圖所示:
四、問題總結(jié)與體會
描述實驗過程中所遇到的問題,以及是如何解決的。有哪些收獲和體會,對于課程的安排有哪些建議。
1、實驗過程中遇到的問題及解決方法
問題1:在Android studio調(diào)試時可以看到圖標,但是在手機上調(diào)試就看不到圖標了
解決方法:后來發(fā)現(xiàn)是我在添加圖片的時候放錯文件夾了,原先的文件夾將我添加的圖片大小壓縮到很小,所以在手機調(diào)試的時候雖然有圖片,但是以為分辨率極小,所以肉眼看不到。最后我將應(yīng)用中需要用到的圖片放到符合標準的文件夾中就解決了。
問題2:一開始調(diào)試的時候沒有出現(xiàn)預(yù)期結(jié)果,還是顯示“hello world”
解決方法:后來發(fā)現(xiàn)需要在MainActivity.java的最后一行語句改為setContentView(R.layout.test);這樣才會輸出test.xml文件的代碼執(zhí)行效果
2、收獲和體會
①通過做這個實驗,我學會了安卓開發(fā)環(huán)境的搭建。同時,我對安裝應(yīng)用的開發(fā)有了初步的認識,之前認為安卓應(yīng)用的開發(fā)是非常神秘而且復雜的事情,在做完了這個實驗之后,我覺得安卓應(yīng)用開發(fā)和網(wǎng)址制作、微信小程序的制作十分類似,在邏輯上是非常相像的。
②通過做這個實驗,我認為開發(fā)安卓應(yīng)用就像是類似建造房子一樣,各種控件就像各種各樣的磚,通過對不同類型的控件的布局,呈現(xiàn)出功能各異的安卓應(yīng)用。
③這個實驗不僅讓我對安卓應(yīng)用開發(fā)有了很深刻的理解,而且對我自己的手機也有了更深一步的理解,知道了手機和電腦交互的方式。
步的認識,之前認為安卓應(yīng)用的開發(fā)是非常神秘而且復雜的事情,在做完了這個實驗之后,我覺得安卓應(yīng)用開發(fā)和網(wǎng)址制作、微信小程序的制作十分類似,在邏輯上是非常相像的。
②通過做這個實驗,我認為開發(fā)安卓應(yīng)用就像是類似建造房子一樣,各種控件就像各種各樣的磚,通過對不同類型的控件的布局,呈現(xiàn)出功能各異的安卓應(yīng)用。
③這個實驗不僅讓我對安卓應(yīng)用開發(fā)有了很深刻的理解,而且對我自己的手機也有了更深一步的理解,知道了手機和電腦交互的方式。
3、對課程安排的建議:如果老師可以將安卓應(yīng)用設(shè)計的思路講一下就更好了
總結(jié)
以上是生活随笔為你收集整理的我的第一个Android应用小程序的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 前端 Offer 提速:如何写出有亮点的
- 下一篇: android 百度地图无法显示,And