-
Notifications
You must be signed in to change notification settings - Fork 24
Android Pending Invites Screen
Now that we have the My Contacts screen implemented, it's a good time to implement another, very similar, screen called Pending Invites.
On this screen users will see all the invitations to connect that he received from other users of the app. Here the user will be able to tap on ListView
rows to see details of the contacts (like in My Contacts screen). However, we'll also give the user a cool functionality to quickly swipe left or right to dismiss or accept the invitation on the fly.
The initial process for adding this screen is almost exact to the My Contacts screen implementation, so I won't be repeating it here. The change set with exact code changes can be found here.
I've seen this functionality in lots of new apps, and I expected that this will be something I could use out of the box, but that actually wasn't the case. I then did a quick google search to find some tips & tricks on how to implement this, and that's when I stumbled upon a great github repo from a user called wdullaer. His SwipeActionAdapter
gave me all the required functionality in a few short lines of code. wdullaer has great documentation on his repo that I followed pretty closely. Here's how I implemented it:
I added the new library to my build.gradle:
dependencies {
...
compile 'com.wdullaer:swipeactionadapter:2.0.0'
}
I created two background resources for my row swipe events. These background layouts will appear when a user starts swiping the row:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="?android:listPreferredItemHeight"
android:background="@android:color/holo_red_light"
android:layoutDirection="rtl">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:layout_marginRight="10dp"
android:textSize="20sp"
android:textStyle="bold"
android:text="@string/dismiss" />
</LinearLayout>
I used the android:layoutDirection="rtl"
to align the TextView
on the right side of the row. This is a resource for my Dismiss action, and here's for the Accept.
Below you can see my implementation that closely followed the guide that is available on wdullaer's great repo.
adapter = new PendingInvitesAdapter(getActivity(), new ArrayList<Contact>());
//wire up the SwipeActionAdapter
swipeAdapter = new SwipeActionAdapter(adapter);
swipeAdapter.setListView(getListView());
setListAdapter(swipeAdapter);
// Set backgrounds for the swipe directions
swipeAdapter.addBackground(DIRECTION_NORMAL_LEFT,R.layout.row_swipe_left_layout)
.addBackground(DIRECTION_NORMAL_RIGHT,R.layout.row_swipe_right_layout)
.setFixedBackgrounds(true);
swipeAdapter.setSwipeActionListener(new SwipeActionAdapter.SwipeActionListener(){
@Override
public boolean hasActions(int position, SwipeDirection direction){
if(direction.isLeft()) return true; // Change this to false to disable left swipes
if(direction.isRight()) return true;
return false;
}
@Override
public boolean shouldDismiss(int position, SwipeDirection direction){
// Always dismiss items
return true;//direction == DIRECTION_NORMAL_LEFT;
}
@Override
public void onSwipe(int[] positionList, SwipeDirection[] directionList){
for(int i=0;i<positionList.length;i++) {
SwipeDirection direction = directionList[i];
int position = positionList[i];
String action = "";
switch (direction) {
case DIRECTION_FAR_LEFT:
case DIRECTION_NORMAL_LEFT:
action = "Dismissed";
break;
case DIRECTION_FAR_RIGHT:
case DIRECTION_NORMAL_RIGHT:
action = "Accepted";
break;
}
Toast.makeText(
getActivity(),
action + " invite from " + adapter.getItem(position).getFullName(),
Toast.LENGTH_SHORT
).show();
adapter.remove(position);
adapter.notifyDataSetChanged();
swipeAdapter.notifyDataSetChanged();
}
}
});
This code is added to PendingInvitesFragment
class, and all it does now (apart from setting up the swiping functionality) is removing the swiped rows and reporting a toast message about the action that was just executed.
One more screen added in less than 30 minutes. A combination of already implemented functionality, and the use of great 3rd party library helped a lot.
- Android
- Getting Started
- Project Structure
- Gradle
- Menu
- Theming
- Login Screen
- Menu & Navigation
- Importing Library From GitHub
- Creating Reusable Layouts
- Adding New Icons
- Profile Screen
- Chat Screen
- Contacts Screen
- Pending Invites Screen
- Settings Screen
- Add Library Dependency
- Discover Users Screen
- Splash Screen
- Auth0
- Authentication Logic
- Profile Screen Logic
- Send Feedback
- Authenticated to Firebase via Auth0
- Saving User Info to Firebase
- Storing User Connection Info to Firebase
- Calculating Distance Between Users
- Chat Logic
- Handling Device Rotation
- Android Other
- Ionic
- Getting Started
- Project Structure
- Menu
- Theming
- Login Screen
- Adding Images
- Creating Reusable Layouts
- Adding New Icons
- Profile Screen
- Contact Screen
- Elastic Textarea
- Chat Bubble
- Chat Screen
- Contacts Screen
- Pending Invites Screen
- Settings Screen
- Discover Users Screen
- Splash Screen
- Animations
- Auth0
- Storing User Data
- Profile Screen Logic
- Send Feedback
- Update to Ionic RC0
- Reimplemented Auth0 with Ionic RC0
- Authenticated to Firebase via Auth0
- Saving User Info to Firebase
- Storing User Connection Info to Firebase
- Calculating Distance Between Users
- Chat Logic
- Handling Device Rotation
- Ionic Other
- Version Updating
- Cordova
- Other
- Messaging