文章翻譯:邵凱陽
發(fā)表時間:2015 年 7 月 3 日
原文作者:Obaro Ogbo
文章分類:智能硬件
Android Wear 是谷歌為智能手表打造的全新智能開放平臺,于 2014 年 3 月 19 日宣布推出。隨著科技的發(fā)展,越來越多的人開始進行應用程序的開發(fā),但是在 Android Wear 上開發(fā)應用程序卻會給您帶來別樣的體驗。本篇文章就詳細地介紹了一個簡單的 Android Wear 應用程序的開發(fā)過程。
上月初,Alex Mullis 寫了一篇很精彩的文章,討論 為 Android Wear 開發(fā)你所需要知道的一切。我們現在將把這一步走的更遠一些——開發(fā)一個簡單的 Android Wear 應用程序,為安卓做開發(fā)是一個很令人興奮的嘗試,但在您的應用程序中包含 Android Wear 的特性會更加有趣,相信我!
在我們開始之前,請將以下內容記在您的腦海里??纱┐魇綉贸绦?,即使它們跟應用于手持設備的普通應用程序很相似,構建的應用程序在規(guī)模和功能上都應該比較小。我想您不想嘗試將您手持設備上的應用程序的全部功能替換為可穿戴式的。相反,您應該尋找方法,利用可穿性來完善您手持設備上的應用程序。理想情況下,應在手機上執(zhí)行大多數運算,并將結果發(fā)送至可穿戴設備。
我們的應用程序將是一個簡單的安卓應用程序,將通知從手機發(fā)送到配對的可穿戴設備上,而可穿戴設備只擁有一個相應的嵌入式應用程序和一個單一的點擊按鈕。
這篇文章中,我們假設您使用 Android Studio。Android Studio 是安卓應用程序開發(fā)的實際標準。為了開發(fā)可穿戴式應用程序,您需要將您的 SDK 工具更新到版本 23.0.0 或更高,并且讓您的 SDK 搭載 Android 4.4W.2 或更高。
然后您應該設置一個可穿戴的 Android 設備或可穿戴的 Android 模擬器。
adb -d forward tcp:5601 tcp:5601
(每次您連接或是重新連接您的手持設備都要完成這件事)
對于本教程完整的源代碼在github上可以找到,但您也可能想要創(chuàng)建您自己的項目,以在這個過程中獲得別樣的感覺。Android Studio 提供向導機制來幫助創(chuàng)建一個項目,并且他們會以最好的方式來設置您的安卓可穿戴應用程序項目。單擊文件 > 新項目,并按照說明操作。
這個過程類似于創(chuàng)建一個手機/平板電腦項目。只需確保在"Form Factors"窗口中選擇"Phone and Tablet"和"Wear"兩個選項。
http://wiki.jikexueyuan.com/project/wiki-journal-201507-1/images/android-wear-app-02.jpg" alt="02" />
當向導完成時,Android Studio已經創(chuàng)建了一個新項目擁有兩個模塊——移動模塊和穿戴模塊。對于每個模塊,您可以創(chuàng)建活動、 服務、 布局等。請記住,智能手機應用程序 (移動模塊) 應該做大部分工作,像強化處理和網絡通信,然后將通知發(fā)送到可穿戴設備。
移動模塊與您使用的普通安卓開發(fā)是一樣的。對于我們的移動模塊,我們創(chuàng)建一個簡單的活動,使用 EditText 字段和一個按鈕。當觸碰按鈕,輸入 EditText 的文本將被作為通知發(fā)送到可穿戴設備。
布局是相當直接的:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MainActivity"
android:orientation="vertical">
<EditText
android:id="@+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"/>
<Button
android:id="@+id/actionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
style="@style/Base.Widget.AppCompat.Button.Borderless"
android:text="@string/show_notification"
android:onClick="sendNotification" />
</LinearLayout>
主要活動也是相當直接的:
public class MainActivity extends AppCompatActivity {
EditText editText;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
editText = (EditText) findViewById(R.id.editText);
}
public void sendNotification(View view) {
String toSend = editText.getText().toString();
if(toSend.isEmpty())
toSend = "You sent an empty notification";
Notification notification = new NotificationCompat.Builder(getApplication())
.setSmallIcon(R.mipmap.ic_launcher)
.setContentTitle("AndroidAuthority")
.setContentText(toSend)
.extend(new NotificationCompat.WearableExtender().setHintShowBackgroundOnly(true))
.build();
NotificationManagerCompat notificationManager = NotificationManagerCompat.from(getApplication());
int notificationId = 1;
notificationManager.notify(notificationId, notification);
}
}
請注意,當創(chuàng)建我們的通知時,我們稱其為 extend() 方法, 提供了一個 NotificationCompat.WearableExtender() 對象.
像您運行任何其他安卓應用程序一樣運行移動模塊。只要您將他與可穿戴設備(模擬器或真實設備) 配對,在您的設備上運行該項目,將在您的穿戴設備上顯示通知。
http://wiki.jikexueyuan.com/project/wiki-journal-201507-1/images/android-wear-app-03.png" alt="03" />
在這一點上,您應該能夠在您的穿戴設備上查看來自您的移動設備的通知。然而,我們并不滿意,我們要建立和運行一個實際的可穿戴應用程序??纱┐髟O備,有一個遠比手持設備小的屏幕,并且通常為圓形或矩形。這些給他自身的布局帶來了挑戰(zhàn)。實現了跨越式的是,谷歌為安卓可穿戴應用程序開發(fā)者提供了一些優(yōu)秀的設計準則和 UI 模式。當您使用 Android Studio 項目向導創(chuàng)建您的可穿戴應用程序時,可穿戴 UI 庫將自動的包含在您的項目中。確認其是否存在,如果沒有存在,請將其添加在 build.gradle 文件中:
dependencies {
compile 'com.google.android.support:wearable:+'
}
如果您創(chuàng)建您的項目時使用了 Android Studio 項目向導,將會有一個包含兩個不同布局文件的活動已經建立,這兩個不同的布局文件將分別應用于圓形和矩形設備。Activity_wear.xml 文件如下所示:
<?xml version="1.0" encoding="utf-8"?>
<android.support.wearable.view.WatchViewStub
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/watch_view_stub"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:roundLayout="@layout/round_activity_wear"
app:rectLayout="@layout/rect_activity_wear"
tools:context=".WearActivity"
tools:deviceIds="wear">
</android.support.wearable.view.WatchViewStub>
注意這個基本小部件。它是 WatchViewStub,是可穿戴 UI 庫的一部分。你必須聲明"app:"XML Namespace xmlns:app =" UI 部件聲明它們的屬性時使用"app:"命名空間。
要特別注意 app:roundLayout 和 app:rectLayout 項目。這會根據可穿戴設備的屏幕形狀來加載對應的布局文件。棒!
我們的 round_activity_wear.xml 和 rect_activity_wear.xml 文件都很相似除了幾個注意事項。Round_activity_wear 中的小部件是垂直居中和水平的,然而對于 rect_activity,它們只是簡單的水平居中。使用 WatchViewStub,您可以自由地為圓形和矩形屏幕設計完全不同的布局。
http://wiki.jikexueyuan.com/project/wiki-journal-201507-1/images/android-wear-app-04.png" alt="04" />
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_box="all"
tools:context=".WearActivity"
tools:deviceIds="wear_round">
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="@string/hello_round"
android:onClick="beginCountdown" />
<android.support.wearable.view.DelayedConfirmationView
android:id="@+id/delayedView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
app:circle_border_color="@color/green"
app:circle_border_width="20dp"
app:circle_color="@color/white"
app:circle_radius="60dp"
app:circle_radius_pressed="60dp"
app:circle_padding="16dp"
app:update_interval="100"/>
</FrameLayout>
http://wiki.jikexueyuan.com/project/wiki-journal-201507-1/images/android-wear-app-05.png" alt="05" />
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".WearActivity"
tools:deviceIds="wear_square">
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="@string/hello_square"
android:onClick="beginCountdown" />
<android.support.wearable.view.DelayedConfirmationView
android:id="@+id/delayedView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
app:circle_border_color="@color/green"
app:circle_border_width="20dp"
app:circle_color="@color/white"
app:circle_radius="60dp"
app:circle_radius_pressed="60dp"
app:circle_padding="16dp"
app:update_interval="100"/>
</FrameLayout>
WearActivity 擴展 android.app.Activity (注意不是 AppCompatActivity),就像任何正常的 安卓智能手機或平板電腦活動。我們在 WatchViewStub上設置一個 OnLayoutInflatedListener 對象,當 WatchViewStub 已經確定可穿戴設備是否是圓形或是矩形時,他將會被調用。您可以使用 OnLayoutInflatedListener 的 onLayoutInflated 方法來找到使用在 findViewById() 中的小部件。在我們的例子中,我們實例化按鈕和 DelayedConfirmationView,然后調用 showOnlyButton() 函數來隱藏 DelayedConfirmationView ,并且只顯示按鈕。
public class WearActivity extends Activity {
private Button button;
private DelayedConfirmationView delayedView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_wear);
final WatchViewStub stub = (WatchViewStub) findViewById(R.id.watch_view_stub);
stub.setOnLayoutInflatedListener(new WatchViewStub.OnLayoutInflatedListener() {
@Override
public void onLayoutInflated(WatchViewStub stub) {
button = (Button) stub.findViewById(R.id.button);
delayedView = (DelayedConfirmationView) stub.findViewById(R.id.delayedView);
delayedView.setTotalTimeMs(3000);
showOnlyButton();
}
});
}
public void beginCountdown(View view) {
button.setVisibility(View.GONE);
delayedView.setVisibility(View.VISIBLE);
delayedView.setListener(new DelayedConfirmationView.DelayedConfirmationListener() {
@Override
public void onTimerFinished(View view) {
showOnlyButton();
}
@Override
public void onTimerSelected(View view) {
}
});
delayedView.start();
}
public void showOnlyButton() {
button.setVisibility(View.VISIBLE);
delayedView.setVisibility(View.GONE);
}
}
要運行穿戴模塊,選擇 wear run/debug configuration,并單擊播放按鈕 (或鍵入 Shift + F10)。由于這是調試版本,您需要直接安裝到您的穿戴設備 (或模擬器)。請確保您的設備連接 (或可穿戴模擬器正在運行),然后當系統(tǒng)提示時選擇您的設備。
http://wiki.jikexueyuan.com/project/wiki-journal-201507-1/images/android-wear-app-06.gif" alt="06" />
雖然在開發(fā)過程中您直接將您的應用程序安裝在可穿戴設備上,但是出版和發(fā)布應用程序對用戶來說是完全不同的。您的可穿戴應用程序必須嵌入在手持設備的應用程序中,當可穿戴設備與用戶的手持設備連接的時候,應用程序將會被自動的推送到可穿戴設備上。訪問安卓開發(fā)者網站關于包裝可穿戴式應用程序 來獲得更多的信息,從而更加恰當的包裝您自己的可穿戴應用程序。
通常,完整的代碼在 github 上都可以找到,只要你認為是有用的??鞓返木幋a。
更多IT技術干貨: wiki.jikexueyuan.com
加入極客星球翻譯團隊: http://wiki.jikexueyuan.com/project/wiki-editors-guidelines/translators.html版權聲明:
本譯文僅用于學習和交流目的。非商業(yè)轉載請注明譯者、出處,并保留文章在極客學院的完整鏈接
商業(yè)合作請聯系 wiki@jikexueyuan.com
原文地址:https://www.packtpub.com/books/content/persisting-data-local-storage-ionic