Using Flic Buttons with SAndroidE

ClaudioCrema edited this page Mar 1, 2017 · 21 revisions

NOTE: You may find the full source of this application here

Introduction

SAndroidE allows your app to easily detect and react to Flic Buttons click.

Using a Flic button is as easy as:

  • detecting and assigning it a name, using the dedicated Grab Flic Button in the Flasher app
  • using it by following the Flic example application

Requirements

  1. A smartphone supporting Bluetooth 4.0-4.1 (aka Bluetooth Smart)
  2. A micro USB cable to deploy application to your smartphone
  3. Android Studio
  4. SAndroidE zip package: download and extract the zip file
  5. Basic programming knowledge of Android applications
  6. Flic buttons

Prepare your app for SAndroidE

Some steps are common to all SAndroidE based projects. Please follow our Prepare your app for SAndroidE guide before proceeding with next steps.


Detecting flic buttons

To use flic buttons we need first to assign them a name. We can do it by starting the Flasher application.

Starting the flasher app

If the message Flic app is not installed appears, then we need to download the Flic app from Shortcut Labs from the Google Play Store. When installed, just restart the app again and the message should have been disapperead. If this is the case, then just click on the Grab Flic and select the desired Flic to connect. It is important to add the Flics by using this App before being able of successfully use them in the SAndroidE App.

Grabbing flic

After selection, we give our Flic a name and confirm. We repeat the process for two flic buttons and name them white and cyan.

Assign the name

To be sure everything is ok, we check the stored resources.

Show stored resources

As you can see 2 resources of type ble_button are created, named white_flicbutton and cyan_flicbutton. The suffix _flicbutton is automatically added by SAndroidE to our input.


Writing the Android Application

The Activity file

As you can see from the example activity, it must inherit from SandroideBaseActivity in order to let SAndroidE execute some tasks like initialization and checking that Android permissions have been correctly granted from the user.

1.First, we define some class variables to handle Sandroide Buttons:

public class MainActivityFlic extends SandroideBaseActivity {
    private static final String TAG = "MainActivityFlic";

    BLEButton mButton1;
    BLEButton mButton2;

2.Then in the OnCreate's method, we connect SAndroidE buttons using the identifiers given with the Flasher application and create a listener implementing its logic

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_flic);

        mButton2 = (BLEButton) BLEContext.findViewById("cyan_flicbutton");
        if (mButton2 != null) {
            mButton2.setOnClickListener(new BLEOnClickListener() {
                @Override
                public void onClick(BLEItem bleItem) {
                    runOnUiThread(new Runnable() {
                        @Override
                        public void run() {
                            TextView tv = (TextView) findViewById(R.id.textView);
                            tv.setText("clickedddddd cyan");
                        }
                    });
                }
            });
        }

        mButton1 = (BLEButton) BLEContext.findViewById("white_flicbutton");
        if (mButton1 != null) {
            mButton1.setOnClickListener(new BLEOnClickListener() {
                @Override
                public void onClick(BLEItem bleItem) {
                    runOnUiThread(new Runnable() {
                        @Override
                        public void run() {
                            TextView tv = (TextView) findViewById(R.id.textView);
                            tv.setText("clickedddddd white");
                        }
                    });
                }
            });
        }
    }
}

As you can see using Flic Buttons is really easy. You can find the full source code within our example application

The Layout file

AS you can see at this link You have to change your activity_main.xml as weel, adding the lines of code that identify your textView:

<TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        />
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.