I have a situation where I am not allowed to put buttons on Actionbar as well as bottom bar. The bottom bar has Save and Cancel when in Edit mode and to make it consistent across all screen we are not putting additional icon there.

Now, when in Attachment screen, where we can have images, word doc, pdf, etc. How do we design this screen where we can add attachment as well as delete them. I thought of putting a delete button on top of each attachment and a faded box in the last to add one. But the client want the attachments to be viewable as well. That means if i click on them it should be visible as normal doc. But how to put delete and add functionality.


download bmml source – Wireframes created with Balsamiq Mockups

  • What are the "sections" for? Different file types? – Matt Obee Sep 6 '12 at 8:39
  • @matt Obee No, they are more like topics or folders. We want to display all files under all the topics sectioned based of topic. – ajayashish Sep 6 '12 at 8:48
  • Are those sections pre-defined or does the user have to create them? – Matt Obee Sep 6 '12 at 8:56
  • Comes from the backed. It can be single section or multiple – ajayashish Sep 6 '12 at 8:58

One solution would be to use one row for every item. Here's how we did it:

Image uploader

The example is iOS, not Android but the pattern stays the same.

Additional thought: You don't need a cancel button.

  • This looks like a good solution, particularly when you consider things like long file names. – Matt Obee Sep 6 '12 at 8:41
  • Yes, This is a nice solution but it is based on List view approach. I want to see an approach for thumbnail view. – ajayashish Sep 6 '12 at 8:43
  • Shouldn't you choose the view that fits the purpose instead of "wanting a grid view" that doesn't seem to work very well? – Phil Sep 6 '12 at 9:15

I would suggest a combination of some of the comments...

A Click would show the image/expand it, what ever. A longer press shows up a certain area at top or bottom where you can drop the file at...

enter image description here

Additional you can add an area - e.g. at the bottom - to duplicate or edit images or the filenames...


Pressing the thumbnail seems like the most natural action for viewing the file. How about repositioning the delete button slightly? I'm still dubious about the grid layout though.


download bmml source – Wireframes created with Balsamiq Mockups

  • Cannot be done. We can either perform the image action (clicking and expanding full view) or the delete action. 2 actions cannot be combines together. – ajayashish Sep 6 '12 at 9:09

Long tap on an item can bring popup context menu with "Remove item" option. In order to inform user that such feature exist you can show text above grid and below title bar e.g. "To remove item long tap and use Remove option". You can introduce aditional logic around text e.g. do not show it once user removes first item. Long tap is one of the standard features on Android and users are used to it.


Assuming that delete isn't as common an action as view, you could also put the delete action on the view state (a user taps to view the attachment, and then has the option to delete the attachment or go back to the edit screen for all of the attachments).


I imagine a certain area (maybe a bin icon) where items can be dragged to. Items vanish once they arrive at the delete-area. However, a ,,bin'' might not be the best icon, because the user will expect, that he can retrieve icons from the bin. If this is not possible or not intended, the delete area should be visualized another way.


download bmml source – Wireframes created with Balsamiq Mockups


The approved method is to transition to a contextual action bar on a long press to work on "Data"

That pattern is basically, long press, change the "state" of any items you want to be affected, show contextual action bar that lets a user take action(s) or cancel, then revert back to your standard action bar.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.