MAD Gaze X5: Android SDK

Changelog

[09/12/2018][v1.0.0] First launch.


Getting Started

  1. Set Target SDK to 26 in build.gradle (the root level).

    android {
    	...
    	defaultConfig {
    		...
    		minSdkVersion 21
    		targetSdkVersion 26 //set this to 26 or below 26.
    		...
    	}
    }
    
  2. Add the depdencies in app/build.gradle

    implementation 'com.madgaze.smartglass:development-kit:x5-0.9.2'
    
  3. You can now use the layout control supports with MAD Gaze Touch Panel.


Build History

Date X5-SDK (Gradle) Demo Project (.zip)
09/12/2018 com.madgaze.smartglass:development-kit:x5-0.9.2

Hardware Button

Label Click Long Press
A CONFIRM -
B RIGHT / DOWN MENU
C LEFT / UP BACK
D - -

To override the original functionalities for each hardware buttons, which can be achieved by method override on Activity classes by dispatchKeyEvent.

Sample Code (Java)

@Override
public boolean dispatchKeyEvent(KeyEvent event){
	switch (KeyCodeHelper.CheckKeyType(event.getKeyCode(), event)) {
		//KeyCodeHelper.CheckKeyType() transforms the hardware buttons to custom keycodes.
		case RIGHT_DOWN:
		// Equivalent to Button B clicked.
		case LEFT_UP:
		// Equivalent to Button C clicked.
		case CONFIRM:
		// Equivalent to Button A clicked.
		case MENU:
		// Equivalent to Button B long-pressed.
		case BACK:
		// Equivalent to Button C long-pressed.
		return true;
	default:
		return super.dispatchKeyEvent(event);
	}
}

Panel Gesture

GestureView is a fundamental view component on every pages, and it shall be always placed at the top of view to ensure performing actions properly. It captures all input events into two gesture listeners (MADTouchGestureListener and MADScaleGestureListener).

MADTouchGestureListener is mainly applied in tapping, swiping, long-pressing, scrolling and touching events while MADScaleGestureListener is used for detecting pinch gestures.

Sample Code (Java)

MADGestureView gestureView = (MADGestureView) findViewById(R.id.gestureview);
gestureView.getGestureListener().setOnTapListener(new MADGestureTouchDetector.OnTapListener() {
    @Override
    public void onTapEvent(int finger, MotionEvent motionEvent) {
        //Implements the listener with Single Tap Event detected with any number of fingers.
    }

    @Override
    public void onDoubleTap(int finger, MotionEvent motionEvent) {
        //Implements the listener with Double Tap Event detected with any number of fingers.
    }

    @Override
    public void onTripleTap(int finger, MotionEvent motionEvent) {
        //Implements the listener with Triple Tap Event detected with any number of fingers.
    }
});

UI Components


API Reference

AlertDialog

com.madgaze.smartglass.dialog.AlertDialog

A dialog that can show the title and message, with up to 3 buttons with MAD Gaze theme.

Public Methods AlertDialog
Builder(Context context)
Create a Alert Dialog with Builder function.
void setTitle(String text)
Set the title displayed in the alert dialog.
void setTitle(int resId)
Set the title displayed using the given resource id in the alert dialog.
void setDescription(String text)
Set the secondary text displayed in the alert dialog.
void setDescription(int resId)
Set the secondary text displayed using the given resource id in the alert dialog.
void setPositiveButton(String text, OnClickListener clickListener)
Create a positive button with text and register a callback to be invoked when a positive button is pressed.
void setPositiveButton(int resId, OnClickListener clickListener)
Create a positive button with text using the given resource id and register a callback to be invoked when a positive button is pressed.
void setNegativeButton(String text, OnClickListener clickListener)
Create a negative button with text and register a callback to be invoked when a negative button is pressed.
void setNegativeButton(int resId, OnClickListener clickListener)
Create a negative button with text using the given resource id and register a callback to be invoked when a negative button is pressed.
void setNeutralButton(String text, OnClickListener clickListener)
Create a neutral button with text and register a callback to be invoked when a neutral button is pressed.
void setNeutralButton(int resId, OnClickListener clickListener)
Create a neutral button with text using the given resource id and register a callback to be invoked when a neutral button is pressed.
void setOnCancelListener(OnCancelListener cancelListener)
Sets the callback that will be called if the dialog is cancelled.
void setOnDismissListener(OnDismissListener dismissListener)
Sets the callback that will be called if the dialog is dismissed.
void show()
Creates an alert dialog with the arguments supplied to this builder and immediately displays the dialog.

Sample Code (Java)

AlertDialog.Builder builder = new AlertDialog.Builder(this);
builder.setTitle("Greetings")
.setDescription("Hello MAD Gaze! Do you like our latest product?")
.setPositiveButton("Ofcourse", new AlertDialog.OnClickListener(){
	@Override
	public void onClick(AlertDialog dialog){
	// Implements your code here to handle positive button clicked.
	}
})
.setNegativeButton("Sure", new AlertDialog.OnClickListener(){
	@Override
	public void onClick(AlertDialog dialog){
	// Implements your code here to handle negative button clicked.
	dialog.dismiss();
	}
}).show();

DateTimePicker

com.madgaze.smartglass.view.DateTimePicker

A picker can support date and time selection with MAD Gaze touch panel.

Public Methods DateTimePicker
void setPageTitle(String text)
Set the title displayed in the MADDateTimePicker.
void setPageTitle(int resId)
Set the title displayed using the given resource id in the MADDateTimePicker.
void setDate(int year, int month, int day)
Configure the current date displayed on the picker by year, month and day respectively.
void setDateRange(Calendar cal1, Calendar cal2)
Configure the selectable dates for the picker.
void setTime(int hour, int minute)
Configure the display values of hour and minutes.
void setDateTimePickerChangedListener(DateTimePickerChangedListener datetimeChangedListener)
Set a callback to be invoked when date is changed.
void setDateTimePickerSelectedListener(DateTimePickerSelectedListener datetimeSelectedListener)
Set a callback to invoked when date is selected.

Sample Code (Layout XML)

<RelativeLayout 
	xmlns:android="http://schemas.android.com/apk/res/android"
	xmlns:madgaze="http://schemas.android.com/apk/res-auto"
	android:background="@color/black">

    <com.madgaze.smartglass.view.DateTimePicker
	 android:id="@+id/picker" 
	 android:layout_width="match_parent" 
	 android:layout_height="match_parent" 
	 madgaze:pickerType="date" 
	 madgaze:minDate="31/1/2010"/>
	 <!-- Remarks: Picker Type could be "date", "time24" or "time" -->

    <com.madgaze.smartglass.view.GestureView
	 android:id="@+id/gestureView"
	 android:layout_width="match_parent"
	 android:layout_height="match_parent"/>

</RelativeLayout>

Sample Code (Java)

final SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");

GestureView gestureView = (GestureView) findViewById(R.id.gestureView);
DateTimePicker pickerView = (DateTimePicker) findViewById(R.id.picker);

gestureView.getGestureListener().setOnSwipeListener(pickerView);
gestureView.getGestureListener().setOnTapListener(pickerView);
gestureView.getGestureListener().setOnScrollListener(pickerView);

pickerView.setDateTimePickerSelectedListener(new DateTimePicker.DateTimePickerSelectedListener() {
	@Override
	public void onDateSelected(Calendar calendar) {
		String date = sdf.format(calendar.getTime()); Log.i("DateSelected", date);
	}
});

pickerView.setDateTimePickerChangedListener(new DateTimePicker.DateTimePickerChangedListener() {
@Override
	public void onDateChanged(Calendar calendar) {
		String date = sdf.format(calendar.getTime());
		Log.i("DateChanged", date); 
	}
});

com.madgaze.smartglass.view.DropdownView

A list view can support multiple selections and control with MAD Gaze touch panel.

Public Methods DropdownView
void setSubmitText(String text)
Set the submission text displayed in the rightmost column.
void setSubmitText(int resId)
Set the submission text displayed using the given resource in the rightmost column.
void setDropdownItemSelectedListener(DropDownItemSelectedListener dropdownItemSelectedListener)
Sell callback to be invoked when an item is selected.
void setDropdownSubmitListener(DropDownSubmitListener dropdownSubmitListener)
Set the callback to be invoked when the submit button is pressed.
void setData(ArrayList<MADMenuItem> menuItems)
Set the data with menu items.

Sample Code (Layout XML)

<RelativeLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	android:background="@color/black">
	
	<com.madgaze.smartglass.view.DropdownView
		android:id="@+id/dropdownView"
		android:layout_width="match_parent"
		android:layout_height="match_parent"/>
 	
	 <com.madgaze.smartglass.view.GestureView
		android:id="@+id/gestureView"
		android:layout_width="match_parent"
		android:layout_height="match_parent"/>

</RelativeLayout>

Sample Code (Java)

GestureView gestureView = (GestureView) findViewById(R.id.gestureView);
DropdownView dropdownView = (DropdownView) findViewById(R.id.dropdownView);

dropdownView.setData(new ArrayList<>(
	Arrays.asList(
		new MADMenuItem("Selection 1"), 
		new MADMenuItem("Selection 2"), 
		new MADMenuItem("Selection 3")
		)
	));

dropdownView.setDropdownItemSelectedListener(new DropdownView.DropDownItemSelectedListener(){
	@Override
	public void onItemSelected(int position, MADMenuModel model){
		Log.i("DropdownView", "Selected: " + model.getTitle());
	}
});

dropdownView.setDropdownSubmitListener(new DropdownView.DropDownSubmitListener() {
	@Override
	public void submit(List<MADMenuModel> models) {
		String selectedItems = "";
		for (int i = 0; i < models.size(); i++)
			selectedItems += models.get(i).getTitle() + ", "; 

		Log.i("DropdownView", "Submitted: " + selectedItems);
	} 
});

gestureView.getGestureListener().setOnSwipeListener(dropdownView); gestureView.getGestureListener().setOnTapListener(dropdownView); gestureView.getGestureListener().setOnScrollListener(dropdownView);

GestureView

com.madgaze.smartglass.view.GestureView

A foundation layout element for most of MAD Gaze views. It is required to capture all touches and transform to corresponding input signal to subviews. Usually placed at the top of views in the layout file.

Public Methods GestureView
getGestureListener()
Get the touch listener initiated with MADGestureView
getScaleGestureListener()
Get the scale listener initiated with MADGestureView

Sample Code (Layout XML)

<RelativeLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	xmlns:app="http://schemas.android.com/apk/res-auto"
	android:layout_width="match_parent"
	android:layout_height="match_parent">

    <com.madgaze.smartglass.view.GestureView
    	android:id="@+id/gestureview"
    	android:layout_width="match_parent"
    	android:layout_height="match_parent" />

</RelativeLayout>

Sample Code (Java)

GestureView gestureView = (GestureView) findViewById(R.id.gestureview);

gestureView.getGestureListener().setOnTapListener(new MADGestureTouchDetector.OnTapListener() {
    @Override
    public void onTapEvent(int finger, MotionEvent motionEvent) {
        //Implements the listener with Single Tap Event detected with any number of fingers.
    }

    @Override
    public void onDoubleTap(int finger, MotionEvent motionEvent) {
        //Implements the listener with Double Tap Event detected with any number of fingers.
    }

    @Override
    public void onTripleTap(int finger, MotionEvent motionEvent) {
        //Implements the listener with Triple Tap Event detected with any number of fingers.
    }
});

MADScaleGestureListener

com.madgaze.smartglass.listener.MADScaleGestureListener

A gesture transformer used on

to capture pinch gestures.

Public Methods MADScaleGestureListener
void setOnScaleListener(OnScaleListener scaleListener)
Register a callback to be invoked when touch panel captures a pinch move.

MADTouchGestureListener

com.madgaze.smartglass.listener.MADTouchGestureListener

A gesture transformer used on

to capture touch gestures.

Public Methods MADTouchGestureListener
void setOnTapListener(OnTapListener tapListener)
Register a callback to be invoked when touch panel captures a tap action with finger and tap count.
void setOnSwipeListener(OnSwipeListener swipeListener)
Register a callback to be invoked when touch panel captures a swipe action with direction.
void setOnLongPressListener(OnLongPressListener longPressListener)
Register a callback to be invoked when touch panel captures a long-pressed action with finger count.
void setOnTouchListener(OnTouchListener touchListener)
Register a callback to be invoked when the scroll X or Y positions of this view change.
void setSystemCallback(MADGestureSystemCallback systemCallback)
Register a callback to be invoked when touch panel captures a system event, specifically handling in Back / Home / Menu / Supermenu events.

com.madgaze.smartglass.view.MenuView

A list view can support single selection and control with MAD Gaze touch panel.

Public Methods MenuView
void setMenuItemSelectedListener(MenuItemSelectedListener menuItemSelectedListener)
Set the callback to be invoked when a menu item is selected.
void setData(ArrayList<MADMenuItem> menuItems)
Set the data to the menuview.

Sample Code (Layout XML)

<RelativeLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	android:background="@color/black">

<com.madgaze.smartglass.view.MenuView
	android:id="@+id/menuView"
	android:layout_width="match_parent"
	android:layout_height="match_parent"/>

<com.madgaze.smartglass.view.GestureView
	android:id="@+id/gestureView"
	android:layout_width="match_parent"
	android:layout_height="match_parent"/>

</RelativeLayout>

Sample Code (Java)

GestureView gestureView = (GestureView) findViewById(R.id.gestureView);
MenuView menuView = (MenuView) findViewById(R.id.menuView);

menuView.setData(new ArrayList<>(
	Arrays.asList(
		new MADMenuItem("Selection 1"), 
		new MADMenuItem("Selection 2"), 
		new MADMenuItem("Selection 3")
		)
	));

menuView.setMenuItemSelectedListener(new MenuView.MenuItemSelectedListener() {
	@Override
	public void onMenuItemSelected(int position, MADMenuItem model) {
		//implements your code here to handle if menu item is selected.
		Log.i("MenuView", "Selected " +model.getTitle());
	}
});

//configure custom event handlers to gestureview
gestureView.getGestureListener().setOnScrollListener(menuView);
gestureView.getGestureListener().setOnTapListener(menuView);

PagerView

com.madgaze.smartglass.view.PagerView

A view container allows user to flip left and right across different customizable pages.

Public Methods PagerView
void setOnPageChangeListener(ViewPager.OnPageChangeListener pageChangeListener)
Set a callback to be invoked when active page is changed.
void setReverseScrollDirection(boolean direction)
Set the scroll direction of the pagerview.

Sample Code (Layout XML)

<RelativeLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="match_parent"
	android:layout_height="match_parent">

	<com.madgaze.smartglass.view.PagerView
		android:id="@+id/viewPager"
		android:layout_width="match_parent"
		android:layout_height="match_parent"/>

	<com.madgaze.smartglass.view.GestureView
		android:id="@+id/gestureView"
		android:layout_width="match_parent"
		android:layout_height="match_parent"/>

</RelativeLayout>

Sample Code (Layout XML)

view_subpage.xml

<RelativeLayout
	android:layout_width="match_parent"
	android:layout_height="match_parent">

	<RelativeLayout
		android:layout_width="match_parent"
		android:layout_height="match_parent">

		<TextView
			android:id="@+id/textView"
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			android:layout_centerInParent="true"/>
			
	</RelativeLayout>
</RelativeLayout>

Sample Code (Java)


GestureView gestureView = (GestureView) findViewById(R.id.gestureView);
PagerView viewPager = (PagerView) findViewById(R.id.viewPager);

gestureView.getGestureListener().setOnTouchListener(viewPager.getDefaultOnTouchListener());

ArrayList<> listData = new ArrayList<>(Arrays.asList("Page 1", "Page 2"));
TestPagerAdapter adapter = new TestPagerAdapter(this, listData);
viewPager.setAdapter(adapter);

class TestPagerAdapter extends PagerAdapter {
    LayoutInflater layoutInflater;
    List<String> data;

    public TestPagerAdapter(Context context, ArrayList<String> _data) {
        layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        this.data = _data;
    }

    @Override
    public int getCount() {
        return data.size();
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == ((View) object);
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        View itemView = layoutInflater.inflate(R.layout.view_subpage, container, false);

        TextView textView = (TextView) itemView.findViewById(R.id.textView);
        textView.setText(data.get(position));

        container.addView(itemView);

        return itemView;
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView((LinearLayout) object);
    }
}

Seekbar

com.madgaze.smartglass.view.Seekbar

An interface element allows the selection of values with adjustment on MAD Gaze touch panel.

Public Methods Seekbar
void setProgress(int percentage)
Set the current percentage (0 - 100) of the bar.
int getProgress()
Get the current percentage (0 - 100) from the bar.
void setIncreaseImageResource(int resId)
Set the image displayed on the right side of the SeekBar using the given resource id.
void setDecreaseImageResource(int resId)
Set the image displayed on the left side of the SeekBar using the given resource id.

Sample Code (Layout XML)

<RelativeLayout
	xmlns:madgaze="http://schemas.android.com/apk/res-auto"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	android:background="@color/black">

	<com.madgaze.smartglass.view.Seekbar
		android:id="@+id/seekBar"
		android:layout_width="match_parent"
		android:layout_height="match_parent"
		madgaze:header="Seekbar"/>
		
	<com.madgaze.smartglass.view.GestureView
		android:id="@+id/gestureView"
		android:layout_width="match_parent"
		android:layout_height="match_parent" />

</RelativeLayout>

Sample Code (Java)

final Seekbar seekBar = (Seekbar) findViewById(R.id.seekBar);
GestureView gestureView = (GestureView) findViewById(R.id.gestureView);

gestureView.getGestureListener().setOnScrollListener(seekBar);

seekBar.setOnSeekBarChangeListener(new Seekbar.OnSeekbarChangeListener() {
	@Override
	public void onProgressChanged(SeekBar sb, int progress, boolean fromUser) {
		//seekbar values changing here from (0-100)
	}

	@Override
	public void onProgressDecrease() {

	}

	@Override
	public void onProgressIncrease() {

	}

	@Override
	public void onStartTrackingTouch(SeekBar seekBar) {

	}

	@Override
	public void onStopTrackingTouch(SeekBar seekBar) {

	}
});

Toast

com.madgaze.smartglass.view.Toast

Toast provides with simple feedback which occupy the minimum space to display the information.

Public Methods Toast
void makeText(Context context, String text, Duration length)
Create a toast with message and desired duration.
void makeText(Context context, String title, String message, Duration length)
Create a toast with title, message and desired duration.

Sample Code (Java)

Toast.makeText(this, "This is a Testing Toast", Toast.Duration.SHORT).show();

Toast.makeText(this, "MAD Gaze", "This is a Testing Toast", Toast.Duration.LONG).show();

WheelViewRecyclerView

com.madgaze.smartglass.view.WheelViewRecyclerView

A list with fully customizable menu items with single selection with MAD Gaze touch panel.

Public Methods WheelViewRecyclerView
void setOnWheelViewListener(OnWheelViewListener viewListener)
Set a callback to be invoked when active item is changed or selected.
void setAdapter(WheelViewAdapter adapter)
Set the adpater into the WheelViewRecyclerView.

Sample Code (Layout XML)

<RelativeLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	android:background="@color/black">

	<com.madgaze.smartglass.view.WheelViewRecyclerView
		android:id="@+id/wheelView"
		android:layout_width="match_parent"
		android:layout_height="match_parent"/>

	<com.madgaze.smartglass.view.GestureView
		android:id="@+id/gestureView"
		android:layout_width="match_parent"
		android:layout_height="match_parent"/>

</RelativeLayout>

Sample Code (Java)

GestureView gestureView = (GestureView) findViewById(R.id.gestureView);
WheelViewRecyclerView wheelView = (WheelViewRecyclerView) findViewById(R.id.wheelView);

gestureView.getGestureListener().setOnScrollListener(wheelView);

ArrayList<DefaultWheelviewAdapter.Contact> contacts = DefaultWheelviewAdapter.Contact.createContactsList(20);

DefaultWheelviewAdapter viewAdapter = new DefaultWheelviewAdapter(80, contacts);

wheelView.setAdapter(viewAdapter);

wheelView.setOnWheelViewListener(new WheelViewRecyclerView.OnWheelViewListener() {
	@Override
	public void onSelected(int selectedIndex) {
		//implements your code here to handle if a item is selected.
	}
	@Override
	public void onScrollItemChanged(int previousIndex, int selectedIndex) {
		//implements your code here to handle if an active item is changed.
	}
});

wheelView.commit();

Disclaimer

This library is licensed under the

.