android workshop - 02. glass development 101
TRANSCRIPT
Android Workshop02. Glass development 101
Johnny Sung
https://plus.google.com/+RobertWarren/posts/6EHpFkzz51v?pid=6106039615307089474&oid=113334680236721862429
MyGlass 連接 Google Glass
Glassware
https://developers.google.com/glass/develop/gdk/quick-start
http://zwallpaper.biz/hinhanh/anhto/131213sad-white-puppy-wallpaper.jpg http://techcrunch.com/2015/01/19/today-is-the-last-day-to-buy-google-glass/
Glass layouts
Text Columns
Caption Title
Glass layouts
Author Menu
Alert https://developers.google.com/glass/develop/gdk/card-design
Glass layouts
40 x 40 Screen Size: 640 x 320
Glass layouts
Glass layouts
https://developers.google.com/glass/develop/gdk/card-design
Let’s move into Glass
https://plus.google.com/+JeffBond/posts/R83MnpKnfQq
Get your hands dirty!
Exercise 00: Hello, World
AndroidManifest.xml
Gradle
voice_trigger.xml
VoiceTriggers.Command• add an event
• calculate
• call me a car
• capture a panorama
• check me in
• check this out
• control my car
• control my home
• explore nearby
• explore the stars
• find a bike
• find a dentist
• find a doctor
• find a hospital
• find a passage
• find a place
• find a place to stay
• find a product
• find a recipe
• find a video
• find a website
• find reviews
• find the exchange rate
• find the price
• flip a coin
• give me feedback
• help me sign in
• keep me awake
• learn an instrument
• learn a song
https://developers.google.com/glass/develop/gdk/reference/com/google/android/glass/app/VoiceTriggers.Command
MainActivity.java
Launch project
Exercise 00: Hello, World
Mmm… It looks weird.
We can fix it!
AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?><manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.johnny.petstarglass" >
<application android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@style/AppTheme" >
<!-- ... --> </application>
</manifest>Remove android:theme
Done.
Exercise 00: Hello, World
Mmm… It’s better.
Immersion Example• CardBuilder
• SoundEffect
• CardScrollView
• CardScrollAdapter
• onItemClick
Mmm… It’s too diffcult.
Code Examples
http://goo.gl/LNglaz
GlassWorkshop- Exercise00: HelloWorld
Exercise 01: The Whole New Hello, World
We can fix it!
Do some changes1. Copy from android app
• MainActivity.java
• res/layout/activity_main.xml
Do some changes2. Edit files
• Change ActionBarActivity to Activity (MainActivity.java)
• Remove android:theme(AndroidManifest.xml)
• Remove unused padding’s var (activity_main.xml)
AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?><manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.johnny.petstarglass" >
<application android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@style/AppTheme" >
<!-- ... --> </application>
</manifest>Remove android:theme
package com.johnny.petstarglass;
import android.app.Activity;import android.os.Bundle;
public class MainActivity extends Activity {
@Overrideprotected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);setContentView(R.layout.card_main);
}}
MainActivity.javaCopy from android app’s
Change this
<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" android:orientation="vertical" tools:context=".MainActivity">
<TextView android:text="@string/hello_world" android:layout_width="wrap_content" android:layout_height="wrap_content" />
</LinearLayout>
Remove this
Change to LinearLayout
activity_main.xml
Done.
Exercise 01: The Whole New Hello, World
Code Examples
http://goo.gl/uZLRa5
GlassWorkshop- Exercise01: NewHelloWorld
http://fc01.deviantart.net/fs9/i/2006/074/0/f/a_whole_new_world_by_fantasist.jpg
Exercise 03: My Voice Command
<?xml version="1.0" encoding="utf-8"?><trigger keyword="My Command" />
<?xml version="1.0" encoding="utf-8"?><trigger command="SHOW_ME_A_DEMO" />
Using unlisted main voice commands
Edit
https://developers.google.com/glass/develop/gdk/voice#unlisted_commands
voice_trigger.xml
<?xml version="1.0" encoding="utf-8"?><manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.johnny.petstarglass" >
<uses-permission android:name="com.google.android.glass.permission.DEVELOPMENT" />
<application android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name">
<!-- ... --> </application>
</manifest>
AndroidManifest.xml
Add this
Exercise 04: My Voice Command
Code Examples
http://goo.gl/wsTGMN
GlassWorkshop- Exercise02: MyVoiceCommand
Exercise 03: Use CardBuilder
View view1 = new CardBuilder(context, CardBuilder.Layout.TEXT).setText("This is the TEXT layout. The text size will adjust dynamically.").setFootnote("This is the footnote").setTimestamp("just now").getView();
CardBuilder
View view2 = new CardBuilder(context, CardBuilder.Layout.COLUMNS).setText("You can even put a centered icon on a COLUMNS card
instead of a mosaic.").setFootnote("This is the footnote").setTimestamp("just now").setIcon(R.drawable.ic_wifi).getView();
CardBuilder
public class MainActivity extends Activity {
@Overrideprotected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
View view1 = new CardBuilder(this, CardBuilder.Layout.TEXT).setText("This is the TEXT layout.").setFootnote("footnote").setTimestamp("just now").getView();
setContentView(view1);}
}
MainActivity.java
Exercise 03: Use CardBuilder
Code Examples
http://goo.gl/WdGdnR
GlassWorkshop- Exercise03: CardBuilder
Additional things
SoundEffect
AudioManager am = (AudioManager) getSystemService(Context.AUDIO_SERVICE);
am.playSoundEffect(Sounds.DISALLOWED);
SoundEffect
https://developers.google.com/glass/develop/gdk/reference/com/google/android/glass/media/Sounds
Touch input
Swipe down translates to KEYCODE_BACK.
A camera button press translates to KEYCODE_CAMERA.
Tap translates to KEYCODE_DPAD_CENTER.
Touch input@Overridepublic boolean onKeyDown(int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_CAMERA) {// ...return true;
}return false;
}
@Overridepublic boolean onKeyUp(int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_CAMERA) {// ...return true;
}return false;
}
MainActivity.java
Where To Go From Here?
• Check the development guide https://developers.google.com/glass/develop/gdk/index
• Touch Gestures
• Card Scroller
• Slider
• Live Cards
Q & A
http://fb.com/groups/glassdev.taiwanGoogle glass developer Taiwan
不只聊 Glass 喔