Glass development 101 All example sources are in Github: Example 00: Hello, World https://github.com/j796160836/GlassWorkshop-Exercise00_HelloWorld Example 01: New Hello, World https://github.com/j796160836/GlassWorkshop-Exercise01_NewHelloWorld Example 02: MyVoiceCommand https://github.com/j796160836/GlassWorkshop-Exercise02_MyVoiceCommand Example 03: UseCardBuilder https://github.com/j796160836/GlassWorkshop-Exercise03_CardBuilder

1. Android Workshop
02. Glass development 101
Johnny Sung

3. https://plus.google.com/+RobertWarren/posts/6EHpFkzz51v?pid=6106039615307089474&oid=113334680236721862429

5. MyGlass 連接 Google Glass

7. Glassware

8. https://developers.google.com/glass/develop/gdk/quick-start

9. 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/

10. Glass layouts

11. Text Columns
Caption Title
Glass layouts

12. Author Menu
Alert https://developers.google.com/glass/develop/gdk/card-design
Glass layouts

13. 40 x 40 Screen Size: 640 x 320
Glass layouts

14. Glass layouts
https://developers.google.com/glass/develop/gdk/card-design

15. Let’s move into Glass

16. https://plus.google.com/+JeffBond/posts/R83MnpKnfQq
Get your hands dirty!

17. Exercise 00: Hello, World

22. AndroidManifest.xml

23. Gradle

24. voice_trigger.xml

25. 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

26. MainActivity.java

27. Launch project

28. Exercise 00: Hello, World
Mmm…
It looks weird.

29. We can fix it!

30. 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

31. Done.

32. Exercise 00: Hello, World
Mmm…
It’s better.

33. Immersion Example
• CardBuilder
• SoundEffect
• CardScrollView
• CardScrollAdapter
• onItemClick
Mmm… It’s too diffcult.

34. Code Examples
http://goo.gl/LNglaz
GlassWorkshop-
Exercise00: HelloWorld

35. Exercise 01: The Whole New Hello, World

36. We can fix it!

37. Do some changes
1. Copy from android app
• MainActivity.java
• res/layout/activity_main.xml

38. Do some changes
2. Edit files
• Change ActionBarActivity to Activity
(MainActivity.java)
• Remove android:theme
(AndroidManifest.xml)
• Remove unused padding’s var
(activity_main.xml)

39. 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

40. package com.johnny.petstarglass;
import android.app.Activity;
import android.os.Bundle;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.card_main);
}
}
MainActivity.java
Copy from android app’s
Change this

41. <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

42. Done.

43. Exercise 01: The Whole New Hello, World

44. Code Examples
http://goo.gl/uZLRa5
GlassWorkshop-
Exercise01: NewHelloWorld

45. http://fc01.deviantart.net/fs9/i/2006/074/0/f/a_whole_new_world_by_fantasist.jpg

46. Exercise 03: My Voice Command

47. <?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

48. <?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

49. Exercise 04: My Voice Command

50. Code Examples
http://goo.gl/wsTGMN
GlassWorkshop-
Exercise02: MyVoiceCommand

51. Exercise 03: Use CardBuilder

52. 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

53. 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

54. public class MainActivity extends Activity {
@Override
protected 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

55. Exercise 03: Use CardBuilder

56. Code Examples
http://goo.gl/WdGdnR
GlassWorkshop-
Exercise03: CardBuilder

57. Additional things

58. SoundEffect
AudioManager am = (AudioManager) getSystemService(Context.AUDIO_SERVICE);
am.playSoundEffect(Sounds.DISALLOWED);

59. SoundEffect
https://developers.google.com/glass/develop/gdk/reference/com/google/android/glass/media/Sounds

60. Touch input
Swipe down translates to KEYCODE_BACK.
A camera button press
translates to KEYCODE_CAMERA.
Tap translates to KEYCODE_DPAD_CENTER.

61. Touch input
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_CAMERA) {
// ...
return true;
}
return false;
}
@Override
public boolean onKeyUp(int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_CAMERA) {
// ...
return true;
}
return false;
}
MainActivity.java

62. Where To Go From Here?
• Check the development guide
https://developers.google.com/glass/develop/gdk/index
• Touch Gestures
• Card Scroller
• Slider
• Live Cards

63. Q & A

64. http://fb.com/groups/glassdev.taiwan
Google glass developer Taiwan
不只聊 Glass 喔