After you’ve done all the UI optimizations recommended by UX designers, how do you make your interface even more engaging? That’s where the Samsung Mobile SDK can help. Part 1 of Advancing Your UI introduces you to three new technologies -- Look, Motion, and Gesture – that allow you to create an interface that engages your audience in ways you have not yet explored.

1. Advancing the UI – Part I:
Look, Motion, and Gesture
Anna Schaller
Sr. Manager, Developer Relations
Samsung Media Solutions Center America
#SDC13

2. Creating Moments of Delight

3. What’s Next for the UI?
 Mobile SDK
–
–
–
–
–
Look
Gestures
Motion
MultiWindow
Visual View
Part I
Part II

4. Look

5. A “Look” at features
 Writing Buddy
– Hand writing recognition extension to UI elements
 Air Button
– Quick access menu for various arrays of data
 Smart Clip
– Clipboard capture with metadata recognition
 Pointer Icon
– Extends icon for hover pointer to user-defined
images

6. Architecturally speaking……
 View System modified to support extensions to
Android UI elements
– New default behaviors (Writing Buddy enabled on all
editable fields)
– New packaged library with added functionality to enhance
your UI
APPLICATION FRAMEWORK
View System
Slook Impl
Resource Manager
Activity Manager
Window Manager
Notification Manager
Telephony Manager
…..
Content Provider

7. Look implementation
Application
SDK Module
MyBeautifulApp
1.Request(Call Public API)
2.Check Feature
3.Check version
Slook
JAR
Slook
SlookWritingBuddy
SlookAirButton
Implement
7.Response
SlookSmartClip
SlookHoverPointIc
on
APPLICATION
5.Request(Call Internal API)
Slook
Implement
SlookImpl
WritingBuddyImpl
AirButtonImpl
View System
APPLICATION FRAMEWORK
6.Response
SmartClipImpl
HoverPointIconIm
pl

8. Samsung Mobile SDK Libraries
 New APIs to check for presence
and properties of technology

9. Implementing Look Features
@Override
public void onCreate(Bundle savedInstanceState) {
Slook slook = new Slook();
try {
slook.initialize(this);
} catch (SsdkUnsupportedException e) {
// notify user device does not support
return;
}
if (slook.isFeatureEnabled(Slook.AIRBUTTON)
if (slook.isFeatureEnabled(Slook.SPEN_HOVER_ICON)
if (slook.isFeatureEnabled(Slook.SMARTCLIP)
if (slook.isFeatureEnabled(Slook.WRITINGBUDDY) {
Slook<class> variable = new Slook<class> }

10. Writing Buddy
 On by default for editable fields (EditText, DatePicker)
 Disable system wide with Direct pen input turned off
 Disable on app-by-app basis through look library

11. Writing Buddy Extensions
 SLookWritingBuddy class
– 2 constructors: ViewGroup and EditText
 Support for text and images
– 2 Listeners with callbacks

12. Writing Buddy Styles
 EditText (text
only) (default)
 ViewGroup
 EditText (text and
image toggle)

13. Implementing Writing Buddy – Text and Image
SlookWritingBuddy mWritingBuddy;
EditText editInput;
ImageView mOutputImageView;
public void onCreate(. . . ) {
editInput = (EditText) findViewById(R.id.edit_input);
mOutputImageView = (ImageView) findViewById(R.id.image_output);
mWritingBuddy = new SlookWritingBuddy(editInput);
mWritingBuddy.setImageWritingListener(
new SlookWritingBuddy.ImageWritingListener() {
public void onImageReceived(Bitmap arg0) {
mOutputImageView.setBackground(
new BitmapDrawable(getResources(), arg0));
}
});

14. Implementing Writing Buddy – ViewGroup
public void onCreate(. . . ) {
FrameLayout fl = (FrameLayout) findViewById(R.id.input);
mOutputTextView = (TextView) findViewById(R.id.text_output);
mWritingBuddy = new SlookWritingBuddy(fl);
mWritingBuddy.setTextWritingListener(
new SlookWritingBuddy.TextWritingListener() {
public void onTextReceived(CharSequence arg0) {
mOutputTextView.setText(arg0);
}
});
<LinearLayout>
<FrameLayout>
<SomeView>
</FrameLayout>
<TextView>
</LinearLayout>

15. Writing Buddy Miscellaneous Features
// Turn recognition on for numeric or alphanumeric
mType = SlookWritingBuddy.TYPE_EDITOR_NUMBER;
mType = SlookWritingBuddy.TYPE_EDITOR_TEXT;
mWritingBuddy.setEditorType(mType);
// enable or disable Writing Buddy
mWritingBuddy.setEnabled(mIsEnabled);
// true or false

16. Air Button
 Activated with S Pen hover + side button
 Defaults to “Air Command” system wide
 Override behavior inside app
– com.samsung.android.sdk.look.airbutton
 Implemented with an ArrayAdapter
– Array of “data” attached to view
– Array data can be text, images, contacts, video, audio

17. Data Types

18. Air Button -- Text
protected void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.activity_airbutton_simple);
Button btnText = (Button) findViewById(R.id.btn_text);
createTextListWidgetFromView(btnText);
}
public SlookAirButton createTextListWidgetFromView(View v) {
SlookAirButton airButtonWidget = new SlookAirButton(
v,
// Button
getAdapterStringList(),
// Adapter
SlookAirButton.UI_TYPE_LIST); // Data type
airButtonWidget.setItemSelectListener(mCallback);
airButtonWidget.setPosition(0, 50);
return airButtonWidget;
}

19. Creating the list of Air Button Strings
public SlookAirButtonAdapter getAdapterStringList() {
ArrayList<AirButtonItem> stringList =
new ArrayList<AirButtonItem>();
stringList.add(new AirButtonItem(null,
“Come here at 5:00", null));
stringList.add(new AirButtonItem(null, "Why?", null));
stringList.add(new AirButtonItem(null,
"I wanna watch movie", null));
stringList.add(new AirButtonItem(null,
"Ok. No problem", null));
return new SlookAirButtonAdapter(stringList);
}

20. Data Types
new SlookAirButton(View parentview, SlookAirButtonAdapter adapter,
int uiType)
where uiType is:
SlookAirButton.UI_TYPE_LIST // use with text and media arrays
SlookAirButton.UI_TYPE_MENU // use with menu arrays
// ArrayAdapter Items
AirButtonItem(Drawable image,
String description,
Object data)
// R.drawable.image or null,
// Text or null
// null
new AirButtonItem(null, “text”, null)
new AirButtonItem(R.drawable.png, “text”, null)
// text only
// image and text

21. Positioning the List
get/setGravity(int g)
// within view
SlookAirButton.GRAVITY_LEFT
SlookAirButton.GRAVITY_RIGHT
SlookAirButton.GRAVITY_TOP
SlookAirButton.GRAVITY_BOTTOM
get/setDirection(int d)
// for adapter
SlookAirButton.DIRECTION_UPPER
SlookAirButton.DIRECTION_LOWER
SlookAirButton.DIRECTION_RIGHT
SlookAirButton.DIRECTION_LEFT
get/setPosition(int x, int y)
// coordinates
y
x

22. AirButton -- Gravity versus Direction

23. More . . .
// lets user scroll through lists
setScrollEnabled(boolean enable)
// animates the elements in the list when it opens
setBounceEffectEnabled(boolean enable)
// animates the list when hovering over elements
start/stopAnimationIcon(MotionEvent event)
ACTION_HOVER_ENTER | ACTION_HOVER_EXIT

24. Smart Clip

25. Smart Clip Features
 Default behavior
– Captures the text and images in ImageView and TextView
 Extensions with Look
– Meta-data can now be included with the image clip
– Meta-data includes URLs, strings, as well as the launch
intent for your activity
– Meta data can be Static or Dynamic

26. Simple Use Case -- Scrapbook
public void onCreate(. . .) {
TextView tv = (TextView) findViewById(R.id.text_static);
SlookSmartClip sc = new SlookSmartClip(tv);
sc.clearAllMetaTag();
sc.addMetaTag(new SlookSmartClipMetaTag
(SlookSmartClipMetaTag.TAG_TYPE_URL, "http://www.samsung.com"));
sc.addMetaTag(new SlookSmartClipMetaTag
(SlookSmartClipMetaTag.TAG_TYPE_PLAIN_TEXT,
"This is android textview."));
}
public void someRoutine() {
sendData();
}

27. Simple Use Case – Scrapbook (con’t)
public void sendData() {
Intent intent = new Intent();
intent.setComponent(new
ComponentName("com.samsung.android.app.pinboard",
"com.samsung.android.app.pinboard.ui.PinboardActivity"));
try {
startActivity(intent);
} catch (ActivityNotFoundException e) {
Toast.makeText(SmartClipActivity.this,
”Scrapbook application is not installed.”,
Toast.LENGTH_SHORT).show();
}
}

28. Pointer Icon
 Set pointer icon for the View you want it to appear
with
– Can be ViewGroup or View
 Writing Buddy icon overrides
pointer icon
– Cannot redefine hover icon for these
fields without disabling writing buddy

29. Pointer Icon – Adding in code
public class MainActivity extends Activity {
SlookPointerIcon mPointerIcon = new SlookPointerIcon();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
RelativeLayout panel = (RelativeLayout)
findViewById(R.id.container);
mPointerIcon.setHoverIcon (panel,
getResources().
getDrawable(R.drawable.x_pointer_icon));
}

30. LOOK Demo

31. Gesture

32. What is Gesture?
 Gesture allows you to use events generated by user’s
hand movements in your application
 Recognizes hand movements using data from the
gesture sensor to the right of the device speaker
 Requirements:
– Gesture sensor
– Android 4.3 (Jelly Bean API level
18) or higher

33. Gesture Package

34. Implementation -- Check for support of feature
public void onCreate() {
private Sgesture mGesture;
private SgestureHand mHand;
mGesture = new Sgesture();
try {
mGesture.initialize(this);
} catch (IllegalArgumentException e) {
//Error Handling
} catch (SsdkUnsupportedException e) {
//Error Handling
}
if(mGesture.isFeatureEnabled(Sgesture.TYPE_HAND_PRIMITIVE)){
mHand = new SgestureHand(Looper.getMainLooper(), mGesture);
mHand.start(Sgesture.TYPE_HAND_PRIMITIVE, mChangeListener);
}
}

35. Register Listener
private final SgestureHand.ChangeListener mChangeListener =
new SgestureHand.ChangeListener() {
@Override
public void onChanged(Info info) {
Log.d(TAG, “Hand : angle = “ + info.getAngle());
// do something with data
180º / UP
}
};
270º / LEFT
public void onStop() {
mGestureHand.stop();
}
90º / RIGHT
0º / DOWN

36. Reporting Angles

37. Motion

38. What is Motion?
 Package allows you to take advantage of movement
data coming in from sensors for both “calling”
motion and “forward” motion (walking or running)

39. “Calling” motion
 Recognizes the motion of bringing device up to your ear
 When you read a message on your device and bring the
device up to your ear, the call motion event is triggered,
and your application calls the phone number that sent
the message.
 Requirements:
– Proximity sensor, acceleration
sensor, and a gyro sensor
– Android 4.3 (Jelly Bean API level 18) or
higher

40. “Forward” motion
 Pedometer data generated when walking/running
with device (steps, calories, speed, distance, and step
status)
 Requirements:
– Acceleration sensor, pressure sensor
– If no pressure sensor, number of
up/down steps is not recognized
– Android 4.3 (Jelly Bean API level 18) or
higher

41. Motion Library
Call data
Forward data

42. Implementation -- Check for support of feature
public void onCreate() {
private Smotion mMotion;
private SmotionCall mCall;
// SmotionPedometer
mMotion = new Smotion();
try {
mMotion.initialize(this);
} catch (IllegalArgumentException e) {
//Error Handling
} catch (SsdkUnsupportedException e) {
//Error Handling
}
if(mMotion.isFeatureEnabled(Smotion.TYPE_CALL)){
// TYPE_PEDOMETER
mCall = new SmotionCall(Looper.getMainLooper(),mMotion);
mCall.start(Smotion.TYPE_CALL, mChangeListener);
}
}

43. Register Listener – “Call” Motion
private SmotionCall.ChangeListener mChangeListener =
new SmotionCall.ChangeListener() {
@Override
public void onChanged(Info info) {
int position = info.getCallPosition();
switch (position){
case SmotionCall.POSITION_LEFT:
Log.d(TAG, "Call motion happened! : left");
break;
case SmotionCall.POSITION_RIGHT:
Log.d(TAG, "Call motion happened! : Right");
break;
default:
break;
}
}
};

44. Register Listener – “Forward” Motion
private SmotionPedometer.ChangeListener mChangeListener =
new SmotionPedometer.ChangeListener() {
@Override
public void onChanged(Info info) {
Log.d(TAG, “Pedometer : calorie = “ + info.getCalorie());
Log.d(TAG, “Pedometer : distance = “ + info.getDistance());
Log.d(TAG, “Pedometer : speed = “ + info.getSpeed());
Log.d(TAG, “Pedometer : step = “ +
info.getCount(SmotionPedometer.Info.COUNT_TOTAL));
Log.d(TAG, “Pedometer : status = “ + info.getStatus());
}
};

45. Sensing the data
Application
…
Screen off
SDK
…
SensorHub
Pedometer
happened
…
…
1 step
1 step
1 step
1 step
1 step
1 step
1 step
1 step
1 step

46. Getting the latest Pedometer data
mPedometer.getInfo();
Application
mPedometer.updateInfo();
Application
SDK
Screen : ON
getInfo()
The latest
pedometer info.
SDK just knows the
pedometer information
before screen is off.
It can’t know whether
the data is the latest
data or not.
So in this case it returns
null.
SensorHub
SDK
Screen : OFF
updateInfo()
Request
Screen : OFF
getInfo()
null
You can receive the
latest pedometer info
through ChangeListener
though screen is off.
The latest data
The latest
pedometer info

47. What’s next…….
 Advancing the UI -- Part II: MultiWindow and Visual
View
– Tuesday 9:00
– California West

48. Thank You!

49. License Notices
Except where noted, sample source code written by Samsung Electronics Co. Ltd and provided to you is licensed as described below.
Copyright © 2010-2013, Samsung Electronics Co. Ltd. All rights reserved except as otherwise explicitly indicated.
Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:

Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.

Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other
materials provided with the distribution.

Neither the name of the Samsung Electronics Co. Ltd nor the names of its contributors may be used to endorse or promote products derived from this software
without specific prior written permission.

THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED
TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR
CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED
TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
Other source code displayed in this presentation may be offered under other licenses.
Apache 2.0
Copyright © 2010, Android Open Source Project. All rights reserved unless otherwise explicitly indicated.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0.
Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS
OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
Creative Commons 3.0 Attribution License
Portions of this presentation are reproduced from work created and shared by Google (http://code.google.com/policies.html) and used according to terms described in the
Creative Commons 3.0 Attribution License (http://creativecommons.org/licenses/by/3.0/).