The activities themselves follow the same design meaning each of them contain a list.
The list is displayed on the screen using a ListView which offers the ability to scroll up and down on the list.
Below there is a screen shot of the first activity of the application (AVD targer Android 2.2 SDK version 8):
The layout contains on a text view in which we have to specify the attributes for each of the list's element:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/textview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="16sp"
android:textSize="20dp" />
The steps the activities follow on their creation are very simple ones, with the first being retrieving the array of Strings used to populate the ListView from the strings.xml file in the res/values folder of the application.
<string-array name="countries_array">
<item>Bahrain</item>
<item>Bangladesh</item>
<item>Barbados</item>
<item>Belarus</item>
<item>Belgium</item>
<item>Belize</item>
<item>Benin</item>
<item>Romania</item>
<item>Bulgaria</item>
<item>Sweden</item>
<item>Denmark</item>
<item>Norvway</item>
<item>Irak</item>
<item>Afganistan</item>
</string-array>
Then the ListView is populated with the retrieved values:
//get the String array from the strings.xml
String[] countries = getResources().getStringArray(
R.array.countries_array);
// populate the list
setListAdapter(new ArrayAdapter<String>(this, R.layout.list_item,
countries));
final ListView lv = getListView();
lv.setTextFilterEnabled(true);
These steps being done the running activity has a populated ListView which allows the user to scroll up and down through the displayed data.
Now all that is left to do is to add the swipe capabilities so that the user would swipe when he / she wants to change the activity / screen.
We do that by setting the OnTouchListener for the ListView since it covers all the screen of the activity.
// set the listener for the swipe
lv.setOnTouchListener(new OnTouchListener() {
public boolean onTouch(View view, MotionEvent event) {
synchronized (event) {
try {
// wait for 16 ms
event.wait(16);
// when the user touches the screen
if (event.getAction() == MotionEvent.ACTION_DOWN) {
// reset deltaX
deltaX = 0;
// get initial positions
initialX = event.getRawX();
event.getRawY();
}
// when the user releases the screen
if (event.getAction() == MotionEvent.ACTION_UP) {
deltaX = event.getRawX() - initialX;
// swiped to the left
if (deltaX > 100) {
Toast.makeText(getApplicationContext(),
"Swipe to the other direction",
Toast.LENGTH_SHORT).show();
}
// swiped to the right
else if (deltaX < -100) {
startActivity(new Intent(activity, SecondActivity.class));
}
return false;
}
} catch (InterruptedException e) {
return false;
}
}
return false;
}
});
By calculating the difference of the x coordinate of the point when the user touches the screen and the x coordinate of the point when the user releases the screen we can determine on which direction the user swiped. If the deltaX is greater than 0 the user swiped to the left otherwise the user swiped to the right.
When we test if there was a right or a left swipe we compare deltaX with the absolute value of 100, if deltaX is greater than 100 the activity will launch the code for swiping to the left otherwise if deltaX is smaller than -100 is launches the code for swiping to the right. The reason we chose to compare deltaX with the absolute value of 100 is so that we will be sure that the user wants to swipe and not only touching the screen since the android phone can not detect with very high precision the point the user touches the screen on.
After the OnTouchListener is set the application displays a simple text informing the user what type of information the ListView is displaying, and this is done with the help of a Toast object:
Toast.makeText(getApplicationContext(), "Countries", Toast.LENGTH_SHORT).show();
The project can be downloaded by following the link below:
http://uploading.com/files/c6ma4618/Swipper.rar/
Surprisingly the development time of this application is around 5 hours, give or take some minutes, most of this time being spent on creating the swipe capabilities.
No comments:
Post a Comment