標(biāo)題: 基于機(jī)智云AIoT平臺(tái)的Android開源app修改教程 [打印本頁(yè)]
作者: gizwits    時(shí)間: 2021-7-7 17:16
標(biāo)題: 基于機(jī)智云AIoT平臺(tái)的Android開源app修改教程
為了使自己的app更加的有個(gè)人風(fēng)格，因此在網(wǎng)上尋找了很多的參考資料，這里是對(duì)自己設(shè)計(jì)的總結(jié)，具體機(jī)智云APP生成流程請(qǐng)參考我上一篇博客：基于STM32的連接機(jī)智云教程。

一，下載機(jī)智云開源APP

進(jìn)行以下操作之前請(qǐng)確保已經(jīng)在機(jī)智云平臺(tái)中創(chuàng)建了一個(gè)產(chǎn)品，下面點(diǎn)擊添加應(yīng)用，選擇Android生成一個(gè)app應(yīng)用



然后按照?qǐng)D片提示，將密匙填入到相應(yīng)位置，具體參考我上一篇博客，點(diǎn)擊下載，將app工程下載到本地



2、Andriod方面處理

2.1 、AS軟件安裝與源碼修改

Android studio軟件安裝與源碼修改

將下載好了的文件解壓出來，然后將第二個(gè)文件夾復(fù)制出來，粘貼到存放Android studio文件例程文件夾中，若還沒有安裝Android studio的請(qǐng)參考這位大佬的詳細(xì)例程，這邊建議下載的Android studio版本不要太新，不然工程可能編譯不成功。


然后自己新建一個(gè)Android工程作為參考，方便修改源碼，
第一處參考新建例程修改機(jī)智云APP


將此處修改為對(duì)應(yīng)的新建工程的內(nèi)容


第二處按照此路徑參考新建工程修改，這里是我自己的按照自己的新建工程修改完畢的代碼



修改后如下圖所示，需注意這里的compile 均替換為implementation，testcompile均替換為testimplementation。


然后可以從Android studio里面打開修改好的機(jī)智云開源app，等待一段時(shí)間打開后如下圖所示，


這里我們打開工程視圖




2.2、修改APP圖標(biāo)和名稱


首先在網(wǎng)上下載相關(guān)素材備用，若大小不一，請(qǐng)自行修改圖片或者圖標(biāo)的大小。這時(shí)將我們下載好的圖標(biāo)或者圖片放置到桌面，然后分別復(fù)制一下，依次粘貼到drawable-xhdpi目錄下（注意鼠標(biāo)放在drawable-xhdpi上右擊選Paste便出現(xiàn)如下界面）





點(diǎn)擊確定，將此名稱復(fù)制到按照如下圖這個(gè)文件，紅框內(nèi)既是我們可以替換的app圖標(biāo)，將你的圖標(biāo)名稱填上就ok，





下面在這個(gè)位置修改app名稱



2.3、修改啟動(dòng)頁(yè)面和內(nèi)部UI



現(xiàn)在修改啟動(dòng)界面，這里的圖片在前面我們已經(jīng)復(fù)制到了相關(guān)目錄下，現(xiàn)在可以按照下圖將紅框出修改成為你的圖片名稱，見下圖



然后在172行和174行兩處替換為你的設(shè)備離線圖標(biāo)

同樣是這個(gè)目錄下，在117行和119行相應(yīng)位置替換為自己的設(shè)備在線圖標(biāo)

2.4、修改設(shè)備監(jiān)控界面

下面修改一下設(shè)備監(jiān)控界面，按照此路徑打開

這是我已經(jīng)修改好的界面UI，最后效果圖如下（這里的圖標(biāo)可自行修改為自己的圖標(biāo)，若是僅僅復(fù)制代碼會(huì)報(bào)錯(cuò)）




代碼如下所示，可根據(jù)需要自行修改（僅供參考，最好要讀懂代碼）




<?xml version="1.0"encoding="utf-8"?>
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
androidrientation="vertical">

<includelayout="@layout/header_toolbar" />

<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/background_color"
android:fadingEdge="vertical"
android:paddingBottom="10dp"
android:paddingTop="20dp"
android:scrollbars="vertical">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
androidrientation="vertical"
android:scrollbars="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
androidrientation="horizontal"
android:scrollbars="horizontal">


<!-- 燈(布爾可寫) -->
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginBottom="1dp"
android:layout_weight="3"
android:alpha="1"
android:background="@color/white"
android:gravity="center_horizontal"
android:padding="10dp">

<ImageView
android:id="@+id/LED"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:src="@drawable/led" />

<TextView
android:id="@+id/Led_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/LED"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="燈" />

<Switch
android:id="@+id/sw_bool_LED"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/Led_text"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:textOff="關(guān)閉"
android:textOn="開啟" />
</RelativeLayout>


<!-- 蜂鳴器(布爾可寫) -->
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="3"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:background="@color/white"
android:padding="10dp" >

<ImageView
android:id="@+id/BEEP"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:src="@drawable/beep"/>

<TextView
android:id="@+id/BEEP_text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:layout_below="@+id/BEEP"
android:text="蜂鳴器" />

<Switch
android:id="@+id/sw_bool_BEEP"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_below="@+id/BEEP_text"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textOff="關(guān)閉"
android:textOn="開啟" />
</RelativeLayout>


<!-- 開關(guān)(布爾可寫) -->
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="3"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:background="@color/white"
android:padding="10dp" >

<ImageView
android:id="@+id/LED1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:src="@drawable/kaiguan"/>
<TextView
android:id="@+id/LED1_text"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_below="@+id/LED1"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="開關(guān)" />
<Switch
android:id="@+id/sw_bool_LED1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_below="@+id/LED1_text"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textOff="關(guān)閉"
android:textOn="開啟" />
</RelativeLayout>
</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="101dp"
androidrientation="horizontal"
android:scrollbars="horizontal">
<!-- 溫度(數(shù)值只讀) -->
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="3"
android:layout_height="wrap_content"
android:background="@color/white"
android:padding="10dp" >

<ImageView
android:id="@+id/Temp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:src="@drawable/wd" />
<TextView
android:id="@+id/tv_data_Temp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/Temp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"/>
<TextView
android:layout_marginLeft="5dp"
android:id="@+id/Temp_text"
android:layout_below="@+id/Temp"
android:layout_toRightOf="@id/tv_data_Temp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="℃" />
<TextView
android:id="@+id/Temp_text1"
android:layout_toLeftOf="@id/Temp"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="溫度" />

</RelativeLayout>


<!-- 濕度(數(shù)值只讀) -->
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:layout_weight="3"
android:background="@color/white"
android:padding="10dp">
<ImageView
android:id="@+id/Shidu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:src="@drawable/sd" />
<TextView
android:layout_marginLeft="5dp"
android:id="@+id/Shidu_text"
android:layout_below="@+id/Shidu"
android:layout_toRightOf="@id/tv_data_Shidu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="%" />
<TextView
android:id="@+id/tv_data_Shidu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/Shidu"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"/>
<TextView
android:id="@+id/Shidu_text1"
android:layout_toLeftOf="@id/Shidu"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="濕度" />
</RelativeLayout>


<!-- 光照強(qiáng)度(數(shù)值只讀) -->
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:layout_weight="3"
android:background="@color/white"
android:padding="10dp">

<ImageView
android:id="@+id/GQ"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:src="@drawable/sun" />

<TextView
android:id="@+id/GQ_text"
android:layout_marginLeft="5dp"
android:layout_below="@+id/GQ"
android:layout_toRightOf="@id/tv_data_GQ"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="lx" />
<TextView
android:id="@+id/tv_data_GQ"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/GQ"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"/>
<TextView

android:id="@+id/GQ_text1"
android:layout_toLeftOf="@id/GQ"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="光強(qiáng)" />
</RelativeLayout>
</LinearLayout>
<!-- 溫度閾值范圍(數(shù)值可寫) -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:background="@color/white"
android:padding="10dp" >

<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="溫度閾值范圍（℃）" />

<TextView
android:id="@+id/tv_data_Temp_AlarmScope"
android:layout_width="110dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:textSize="16sp"
android:gravity="end" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/tv_data_Temp_AlarmScope"
android:layout_marginTop="10dp"
android:gravity="center_vertical"
androidrientation="horizontal">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:text="0" />

<SeekBar

android:id="@+id/sb_data_Temp_AlarmScope"
android:thumb="@drawable/bar1"
android:thumbOffset="0dp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:max="50" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:text="50" />
</LinearLayout>

</RelativeLayout>


<!-- 濕度閾值范圍(數(shù)值可寫) -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:background="@color/white"
android:padding="10dp" >

<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="濕度閾值范圍（％）" />

<TextView
android:id="@+id/tv_data_Shidu_AlarmScope"
android:layout_width="110dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:textSize="16sp"
android:gravity="end" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/tv_data_Shidu_AlarmScope"
android:layout_marginTop="10dp"
android:gravity="center_vertical"
androidrientation="horizontal">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:text="20" />

<SeekBar
android:id="@+id/sb_data_Shidu_AlarmScope"
android:thumb="@drawable/bar"
android:thumbOffset="0dp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:max="75"

android:progress="0"/>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:text="95" />
</LinearLayout>

</RelativeLayout>


<!-- 光強(qiáng)閾值范圍(數(shù)值可寫) -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:background="@color/white"
android:padding="10dp" >

<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="光強(qiáng)閾值范圍（lx）" />

<TextView
android:id="@+id/tv_data_GQ_AlarmScope"
android:layout_width="110dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:textSize="16sp"
android:gravity="end" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/tv_data_GQ_AlarmScope"
android:layout_marginTop="10dp"
android:gravity="center_vertical"
androidrientation="horizontal">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:text="0" />

<SeekBar

android:id="@+id/sb_data_GQ_AlarmScope"
android:thumb="@drawable/bar2"
android:thumbOffset="0dp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:max="65535" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:text="65535" />
</LinearLayout>

</RelativeLayout>


</LinearLayout>

</ScrollView>
</LinearLayout>




2.5、安裝軟件

因?yàn)槲覀兊某绦蚓幾g無錯(cuò)誤，故開始安裝app，用數(shù)據(jù)線將電腦和手機(jī)連接，進(jìn)入手機(jī)的開發(fā)者模式，打開開發(fā)者模式，允許進(jìn)行USB調(diào)試





然后在android studio端點(diǎn)擊運(yùn)行，app便安裝成功了











原文轉(zhuǎn)載于：https://blog.csdn.net/Zgc6666/article/details/104187111





歡迎光臨 (http://www.torrancerestoration.com/bbs/) Powered by Discuz! X3.1