Samsung Mobile SDK Tutorial 5
In this part of my Samsung Mobile SDK tutorial we will look at the Samsung SLook AirButton. AirButton is going to allow us to create custom menus on the screen and time the user clicks on an active area in the app with the SPen button.
With Samsung AirButton you can use S-Pen to view content, select menus or insert images for quick content access. AirButton shows you information from anywhere and anytime and it can perform additional operations when you bring your S-Pen near the target view and press the side button.
If you like videos like this it helps to tell Google+ with a click here
Don’t forget to check out the Samsung Smart App Challenge and if it is still November 2013, don’t forget to sign up to win a Samsung Galaxy Note 3, or Samsung Galaxy Gear Smart Watch on my site.
Code from the Video and Transcription
<RelativeLayout 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:orientation="vertical"
tools:context=".MainActivity"
android:background="@drawable/background"
android:id="@+id/root_layout" >
<Button
android:id="@+id/btn_recipient"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:text="Frequent list" />
<Button
android:id="@+id/btn_text"
android:layout_width="200dip"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:text="Show text" />
<Button
android:id="@+id/btn_menu"
android:layout_width="100dip"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="50dip"
android:text="Menu" />
<Button
android:id="@+id/btn_image"
android:layout_width="60dip"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="+" />
</RelativeLayout>
package com.samsung.android.example.slookdemos;
import java.util.ArrayList;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
import com.samsung.android.sdk.look.airbutton.SlookAirButton;
import com.samsung.android.sdk.look.airbutton.SlookAirButton.ItemSelectListener;
import com.samsung.android.sdk.look.airbutton.SlookAirButtonAdapter;
import com.samsung.android.sdk.look.airbutton.SlookAirButtonAdapter.AirButtonItem;
public class AirButtonSimpleActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_airbutton_simple);
Button btnMenu = (Button) findViewById(R.id.btn_menu);
// Call to method below which is passed a reference to the button
createMenuWidgetFromView(btnMenu);
Button btnRecipient = (Button) findViewById(R.id.btn_recipient);
createRecipientListWidgetFromView(btnRecipient);
Button btnImage = (Button) findViewById(R.id.btn_image);
createImageListWidgetFromView(btnImage);
Button btnText = (Button) findViewById(R.id.btn_text);
createTextListWidgetFromView(btnText);
// Toast provides information on using the example
Toast.makeText(this, "Please hover and press the S-pen side-button on each button",
Toast.LENGTH_SHORT).show();
}
// When an item is selected open a Toast that displays the index clicked
private ItemSelectListener mCallback = new ItemSelectListener() {
public void onItemSelected(View arg0, int arg1, Object arg2) {
Toast.makeText(AirButtonSimpleActivity.this, "Item index = " + arg1, Toast.LENGTH_SHORT)
.show();
}
};
// When btnImage is clicked this returns an SlookAirButton
public SlookAirButton createImageListWidgetFromView(View v) {
// Creates an instance of the SLookAirButton
// getAdapterImageList() retrieves an ArrayList of AirButtonItems
// UI_TYPE_LIST says that we want the list display version
SlookAirButton airButtonWidget = new SlookAirButton(v, getAdapterImageList(),
SlookAirButton.UI_TYPE_LIST);
// Set the ItemSelectListener instance that receives event
// information from the SlookAirButton
airButtonWidget.setItemSelectListener(mCallback);
// Set the widget position
airButtonWidget.setGravity(SlookAirButton.GRAVITY_LEFT);
// Define the display direction for your items
// for UI_TYPE_LIST you can use DIRECTION_UPPER,
// DIRECTION_LOWER, or DIRECTION_AUTO
airButtonWidget.setDirection(SlookAirButton.DIRECTION_UPPER);
// Set the position of the AirButton based on x and y
airButtonWidget.setPosition(0, -50);
return airButtonWidget;
}
// When btnText is clicked this returns an SlookAirButton
public SlookAirButton createTextListWidgetFromView(View v) {
// Creates an instance of the SLookAirButton
// getAdapterStringList() retrieves an ArrayList of AirButtonItems
// UI_TYPE_LIST says that we want the list display version
SlookAirButton airButtonWidget = new SlookAirButton(v, getAdapterStringList(),
SlookAirButton.UI_TYPE_LIST);
// Set the ItemSelectListener instance that receives event
// information from the SlookAirButton
airButtonWidget.setItemSelectListener(mCallback);
// Set the position of the AirButton based on x and y
airButtonWidget.setPosition(0, 50);
return airButtonWidget;
}
// When btnRecipient is clicked this returns an SlookAirButton
public SlookAirButton createRecipientListWidgetFromView(View v) {
// Creates an instance of the SLookAirButton
// getAdapterRecipientList() retrieves an ArrayList of AirButtonItems
// UI_TYPE_LIST says that we want the list display version
SlookAirButton airButtonWidget = new SlookAirButton(v, getAdapterRecipientList(),
SlookAirButton.UI_TYPE_LIST);
// Define the display direction for your items
// for UI_TYPE_LIST you can use DIRECTION_UPPER,
// DIRECTION_LOWER, or DIRECTION_AUTO
airButtonWidget.setDirection(SlookAirButton.DIRECTION_LOWER);
// Set the ItemSelectListener instance that receives event
// information from the SlookAirButton
airButtonWidget.setItemSelectListener(mCallback);
return airButtonWidget;
}
// When btnMenu is clicked this returns an SlookAirButton
public SlookAirButton createMenuWidgetFromView(View v) {
// Creates an instance of the SLookAirButton
// getAdapterMenuList() retrieves an ArrayList of AirButtonItems
// UI_TYPE_MENU says that we want the menu display version
// This menu isn't scrollable, has an image and text and
// is displayed in a horizontal direction.
// Using 32dp x 32dp drawables is recommended
SlookAirButton airButtonWidget = new SlookAirButton(v, getAdapterMenuList(),
SlookAirButton.UI_TYPE_MENU);
// Define the display direction for your items
airButtonWidget.setDirection(SlookAirButton.DIRECTION_RIGHT);
// Set the ItemSelectListener instance that receives event
// information from the SlookAirButton
airButtonWidget.setItemSelectListener(mCallback);
return airButtonWidget;
}
// Creates the menu of AirButtonItems to display in the SlookAirButton
public SlookAirButtonAdapter getAdapterImageList() {
ArrayList<AirButtonItem> itemList = new ArrayList<AirButtonItem>();
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic01), null, null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic02), null, null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic03), null, null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic04), null, null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic05), null, null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic06), null, null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic07), null, null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic08), null, null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic09), null, null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic10), null, null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic11), null, null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.pic12), null, null));
return new SlookAirButtonAdapter(itemList);
}
// Creates the menu of AirButtonItems to display in the SlookAirButton
public SlookAirButtonAdapter getAdapterStringList() {
ArrayList<AirButtonItem> stringList = new ArrayList<AirButtonItem>();
stringList.add(new AirButtonItem(null, "You can come here at 5:00", null));
stringList.add(new AirButtonItem(null, "Why?", null));
stringList.add(new AirButtonItem(null, "Please send your e-mail address", null));
stringList.add(new AirButtonItem(null, "Ok. No problem", null));
stringList.add(new AirButtonItem(null, "kkkkkkk", null));
stringList.add(new AirButtonItem(null, "I'm a boy", null));
stringList.add(new AirButtonItem(null, "You are a girl", null));
stringList.add(new AirButtonItem(null, "How about this weekend?", null));
stringList.add(new AirButtonItem(null, "You are so sexy!", null));
stringList.add(new AirButtonItem(null, "Haha it's really good", null));
stringList.add(new AirButtonItem(null, "What you really want to?", null));
stringList.add(new AirButtonItem(null, "I wanna watch movie", null));
stringList.add(new AirButtonItem(null, "No...", null));
stringList.add(new AirButtonItem(null, "ASAP", null));
stringList.add(new AirButtonItem(null, "Really? I can't agree with you", null));
return new SlookAirButtonAdapter(stringList);
}
// Creates the menu of AirButtonItems to display in the SlookAirButton
public SlookAirButtonAdapter getAdapterRecipientList() {
ArrayList<AirButtonItem> itemList = new ArrayList<AirButtonItem>();
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"Alexander Hamilton", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"Oliver Wolcott Jr", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"Samuel Dexter", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"Albert Gallatin", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"George W. Campbell", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"Richard Rush", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"Richard Rush", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"William J. Duane", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"Thomas Ewing", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"George M. Bibb", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"William M. Meredith", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"Howell Cobb", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.recipient),
"Salmon P. Chase", null));
return new SlookAirButtonAdapter(itemList);
}
// Creates the menu of AirButtonItems to display in the SlookAirButton
public SlookAirButtonAdapter getAdapterMenuList() {
ArrayList<AirButtonItem> itemList = new ArrayList<AirButtonItem>();
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.ic_menu_add), "Add",
null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.ic_menu_archive),
"Help", null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.ic_menu_edit), "Edit",
null));
itemList.add(new AirButtonItem(getResources().getDrawable(R.drawable.ic_menu_help), "Help",
null));
;
return new SlookAirButtonAdapter(itemList);
}
}
Hi Derek,
nice tutorial again.
by the way, I signed up for the Samsung account and left a comment in one of your previous tutorials (do not remember which one) but it seems like the comment is deleted.
I went to the previous tutorials to find my comment to see your reply but seems like I cannot find it.
You are entered. I have to manually approve all comments for security reasons. Good luck in the contest 🙂
thank you
You’re very welcome 🙂
Can’t thank enough for your work! Thanks heaps for your generosity…
You’re very welcome 🙂 Good luck in the contest
Hi Derek,
Really appreciate your will to share knowledge in such cool and professional way.
Waiting for tutorials about Android Game Development..
By the way I have signed for the Samsung developer account 🙂
Best regards,
Nebojsa
Hi Nebojsa,
You’re very welcome 🙂 It is my pleasure because I have met so many wonderful people all over the world.
Best of luck in the competition
Derek
Hi Derek.
I have watched most of your tutorials and they are fantastic. I also signed up for the Samsung developer account and would like to be entered. I could really use a new device as I just started working at a software development company where I have been working on mobile android apps and having an up-to-date device to test them on would be great (the company I work for is cheap and my Droid DNA is far and above the most up to date phone we have to test on).
Anyway, keep up the good work. I look forward to more tutorials. I don’t think you have done a tutorial on widgets yet and I think that is something that would be worthwhile to know.
Hi Randy,
I’ll be covering widgets soon. Good luck in the contest 🙂
Hi Derek,
I’ve signed up for Samsung developer account. Wish me luck 🙂 . Thank you for all amazing videos. I watched all java videos from 1-19, OOD videos, and OOP is still little confusing to me. I feel like I am missing something. Maybe I need to practice more. Thank you again Derek.
Hi Marko,
Good luck in the contest. To truly understand OOP you need to practice. Try creating systems in which you solve your own real world problems. I’m glad you found the videos useful 🙂
Derek, my comment still awaiting moderation.
Sorry I’m answering them now. Ever since YouTube changed comments I have been getting many more then usual.
Hi Derek,
Thanks for sharing, I want to know how to use SlookAirButtonAdapter.onHoverEnter , I can’t find out how to implement it in my code.
Hi,
I found it
onHoverEnter
public boolean onHoverEnter(View parentView)
When the pointer is entered the boundaries of parent view, this method is called.
Parameters:
parentView – The view that was hovered.
Returns:
true Hover is entered.
Source : http://img-developer.samsung.com/onlinedocs/sms/index.html
Thank you, but I want to know how to write it (java syntax)
I just singed up for a samsung developers account.