Barry Burd Drew University BarryBurdorg 1 This presentation 2014 Barry Burd Slides available at httpallmycodecomtcf Agenda Whats is all about Try them on Developing for Glass The Mirror API ID: 732559
Download Presentation The PPT/PDF document "Developing for Google Glass" is the property of its rightful owner. Permission is granted to download and print the materials on this web site for personal, non-commercial use only, and to display it on your personal computer provided you do not modify the materials and that you retain all copyright notices contained in the materials. By downloading content from our website, you accept the terms of this agreement.
Slide1
Developing for Google Glass
Barry BurdDrew UniversityBarry@Burd.org
1
This presentation © 2014 Barry Burd
Slides available at
http://allmycode.com/tcfSlide2
Agenda
What's is all about?Try them onDeveloping for GlassThe Mirror API The (Android) Glass Development Kit? &
!
2
Today at TCF10:15-11:10 Android 111:20-12:15 Android 212:25-1:30 Google GlassTime? Book signingSlide3
Availability
Available to Explorers for $1500 (If you're interested, I have invites.)Available to the general public sometime in 2014(?)You can try it today
3Slide4
The MyGlass page
4Slide5
Network Connections
WiFi directly to unsecured hotspotWiFi directly to secured hotspot via MyGlass setupWifi tethering to Android phone or iPhone
5Slide6
The Card metaphor
68:00
"ok glass"
Ewing, NJ
64o(most recent card)
8:00 (device settings)"ok glass"
(next most
recent
card)
Your current timelineSlide7
Controlling the device
Voice commands"OK Glass" activates voice commandsHead movementsLifting head brings Glass out of dormancySwipes on the sideTapping brings Glass out of dormancy or drills down into a card (for a "sub-timeline")Side-to-side swipe is like a carousel for the cards
Down-swipe is "dismiss" or "back" or "become dormant"(No keyboard input that I'm aware of without a hack)
7Slide8
Demos
Take a picture; take a videoGoogle for somethingGet directionsMake a video call (use Add Contact on MyGlass)Identify songWord LensHow do you say " " in " "?My learn-a-language app
8
http://glass-apps.org/google-glass-application-listSlide9
9Slide10
Developing for Glass
10Slide11
Mirror API
https://developers.google.com/glass/playground(Barry - Don't forget to plug in USB; delete all elements from timeline before starting)11Slide12
{
"text": "This item auto-resizes according to the text length", "notification": {
"level": "DEFAULT"
}
}12
CSS
More detailed JSONSlide13
(more detail)
{
"kind": "
mirror#timelineItem",
"id": "d774ac76-977b-426d-9098-19e8a4bd5367", "created": "2014-02-26T04:12:15.063Z", "updated": "2014-02-26T04:12:15.063Z",
"
etag
": "1393387935063",
"text": "This item auto-resizes according to the text length",
"notification": {
"level": "DEFAULT"
}
}
13Slide14
14Slide15
{
"kind": "
mirror#timelineItem
",
"id": "cedf4878-b2e7-4a9e-9fb8-6d6b66527932", "created": "2014-02-26T04:14:20.120Z", "updated": "2014-02-26T04:14:20.120Z", "
etag": "1393388060120",
"html": "<article>\n <section>\n <p class=\"text-auto-size\">This <
em
class=\"yellow\">paragraph</
em
> auto-resizes according to the <strong class=\"blue\">HTML</strong> content length.\n </p>\n </section>\n</article>\n",
"notification": {
"level": "DEFAULT"
}
}
15Slide16
<article class="photo">
<img
src
=
"https://mirror-api-playground.appspot.com/links/filoli-spring-fling.jpg" width="100%" height="100%"> <div class="photo-overlay"/>
<section> <p class="text-auto-size">Spring Fling Fundraiser at
Filoli
</p>
</section>
</article>
16Slide17
<article class="cover-only">
<section> <p class="text-auto-size">This is the cover card of a long list</p>
</section>
<footer>
<p>Hover to scroll</p> </footer></article><article class="auto-paginate">
<
ul
class="text-x-small">
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
<li>Fourth item</li>
<li>Fifth item</li>
<li>Sixth item</li>
<li>Seventh item</li>
<
li>Eighth
item</li>
<li>Ninth item</li>
<li>Tenth item</li>
</
ul
>
</article>
17
* "Hover" means "tap"
* About five of the items fit on a detail page, so the detail page has a scrollbar.Slide18
Developing with Android: Handling Cards
18
swipeSlide19
Developing with Android: Handling Cards
19Slide20
The code:
public class CardScrollActivity
extends Activity {
private List<Card>
mCards; private CardScrollView
mCardScrollView;
@Override
protected void
onCreate
(Bundle
savedInstanceState
) {
super.onCreate
(
savedInstanceState
);
createCards
();
mCardScrollView
=
new
CardScrollView
(this);
ExampleCardScrollAdapter
adapter =
new
ExampleCardScrollAdapter
();
mCardScrollView.setAdapter
(adapter);
mCardScrollView.activate
();
setContentView
(
mCardScrollView
);
}
20Slide21
private void
createCards() {
mCards
= new ArrayList
<Card>(); Card card
;
card = new Card(this);
card.setText
("This card has a footer.");
card.setFootnote
("I'm the footer!");
mCards.add
(card);
card = new Card(this);
card.setText
("This card has a kitten background image.");
card.setFootnote
("How can you resist?");
card.setImageLayout
(
Card.ImageLayout.FULL
);
card.addImage
(
R.drawable.kitten_bg
);
mCards.add
(card);
card = new Card(this);
card.setText
("This card has a mosaic of kitties.");
card.setFootnote
("Aren't they precious?");
card.setImageLayout
(
Card.ImageLayout.LEFT
);
card.addImage
(R.drawable.kitten_small_1);
card.addImage
(R.drawable.kitten_small_2);
card.addImage
(R.drawable.kitten_small_3);
mCards.add
(card);
}
21Slide22
private class
ExampleCardScrollAdapter extends
CardScrollAdapter {
@Override
public int findIdPosition
(Object id) { return -1;
}
@Override
public
int
findItemPosition
(Object item) {
return
mCards.indexOf
(item);
}
@Override
public
int
getCount
() {
return
mCards.size
();
}
@Override
public Object
getItem
(
int
position) {
return
mCards.get
(position);
}
@Override
public View
getView
(
int
position, View
convertView
,
ViewGroup
parent) {
return
mCards.get
(position).
toView
();
}
}
22Slide23
Developing with Android: The Level App
23Slide24
Developing with Android
mLevelView = (
LevelView
) findViewById
(R.id.level);mSensorManager =
(SensorManager
)
getSystemService
(
Context.SENSOR_SERVICE
);
registerListeners
();
private void
registerListeners
() {
mSensorManager.registerListener
(this,
mSensorManager.getDefaultSensor
(
Sensor.TYPE_GRAVITY
),
SensorManager.SENSOR_DELAY_NORMAL
);
}
public void
onSensorChanged
(
SensorEvent
event) {
if (
event.sensor.getType
() ==
Sensor.TYPE_GRAVITY
) {
computeOrientation
(event);
}
private void
computeOrientation
(
SensorEvent
event) {
float angle = (float) -
Math.atan
(
event.values
[0]
/
Math.sqrt
(
event.values
[1] *
event.values
[1]
+
event.values
[2] *
event.values
[2]));
mLevelView.setAngle
(angle);
}
24Slide25
Developing with Android
public void setAngle
(float angle) {
mAngle = angle; // Redraw the line. invalidate();}
public void
onDraw
(Canvas canvas) {
super.onDraw
(canvas);
int
width =
canvas.getWidth
();
int
height =
canvas.getHeight
() / 2;
// Compute the coordinates.
float y = (float)
Math.tan
(
mAngle
) * width / 2;
// Draw the level line.
canvas.drawLine
(0, y + height, width, -y + height,
mPaint
);
}
25Slide26
? & !
26
Today at TCF10:15-11:10 Android 111:20-12:15 Android 2
12:25-1:30 Google GlassTime? Book signing
Barry Burd
Drew University
Barry@Burd.org
Slides available at
http://allmycode.com/tcf