Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add function to show avatar image for messages #55

Merged
merged 4 commits into from
Mar 12, 2016
Merged

Add function to show avatar image for messages #55

merged 4 commits into from
Mar 12, 2016

Conversation

zwang
Copy link
Contributor

@zwang zwang commented Mar 10, 2016

Demo app updated to show avatar image only for text messages by modifying the viewModelBuilder, Presenter is probably best place to set avatar image based on viewmodel and decoration attributes, but this is highly case by case.

By default, the avatar is at the bottom of the collection view cell. No way to customize it unless changing code.

Screenshot of demo app as below:
simulator screen shot mar 10 2016 12 08 20 am
simulator screen shot mar 10 2016 12 08 14 am
simulator screen shot mar 9 2016 11 50 02 pm

@codecov-io
Copy link

Current coverage is 62.33%

Merging #55 into dev will increase coverage by +0.30% as of d0ab66e

@@              dev     #55   diff @@
=====================================
  Files          57      57       
  Stmts        2824    2857    +33
  Branches        0       0       
  Methods         0       0       
=====================================
+ Hit          1752    1781    +29
  Partial         0       0       
- Missed       1072    1076     +4

Review entire Coverage Diff as of d0ab66e

Powered by Codecov. Updated on successful CI builds.

@@ -49,6 +49,7 @@ public protocol MessageViewModelProtocol: class { // why class? https://gist.git
var showsFailedIcon: Bool { get }
var date: String { get }
var status: MessageViewModelStatus { get }
var avatarImage: UIImage? { set get }
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you make this Observable<UIImage?>. That would allow to start with a placeholder if the avatar needs to be downloaded and then update the cell when the download finishes without triggering a CollectionView update.

@diegosanchezr
Copy link
Contributor

@zwang This is amazing! So exciting to see such a nice contribution from the community 😍. Hopefully you can address some of my comments. Thank you very much again!

@zwang
Copy link
Contributor Author

zwang commented Mar 11, 2016

@diegosanchezr thanks for the review and notes. I will revisit them this weekend and update the PR then. Thanks again :)

Also allow user to override layoutConstants in
BaseMessageCollectionViewCell and allow user to specify
VerticalAlignment of avatar: Top, Bottom or Center
@zwang
Copy link
Contributor Author

zwang commented Mar 12, 2016

@diegosanchezr thanks a lot for the review and feedback again. It all makes sense. I am hesitate to change based on the last note as I commented above. So I will leave it there for now and get more familiar with the code first.

Other than the last note, I should have resolved all issues in all the other notes. And also I add two new small features: 1. Allow user to subclass the basestyle to specify VerticalAlignment for the avatar, like Top or Center, by default it is Bottom. 2. Allow user to subclass the basestyle to change the default BaseMessageCollectionViewCellLayoutConstants. These two features are both needed for my project. And I think they should be helpful to others as well. It remains simple and yet allow others to extend to customize the base collection view cell.

Thanks again for you help. Have a good one! Cheers! :)

PS: I will resolve other self.dynamicType issues in the library later once this is merged.

@diegosanchezr
Copy link
Contributor

@zwang thank you very much again! merging!

diegosanchezr added a commit that referenced this pull request Mar 12, 2016
Adds support for user avatars
@diegosanchezr diegosanchezr merged commit 2733b83 into badoo:dev Mar 12, 2016
@zwang
Copy link
Contributor Author

zwang commented Mar 12, 2016

@diegosanchezr Thank you. :)

@zwang zwang deleted the feature-avatar branch March 12, 2016 17:38
@diegosanchezr diegosanchezr mentioned this pull request Mar 24, 2016
@aytunch
Copy link

aytunch commented Mar 28, 2016

@zwang Hi and thanks for your effort in this feature. I have a couple questions. I downloaded the dev branch and the Avatars seems to be only next to text typed messages but not image typed ones. Is this a design choice or are you still working on adding them to all message types?

Since there is a senderId in MessageModelProtocol, can we display different avatars according to the senderId's? Does that mean that the feature you are working on is not just Avatar support and also covers group chat support as @diegosanchezr pointed out in the issue I have opened named: "Group Chat Support"? If thats the case, then images will need the avatars to be next to them.

I really believe Group chat is a vital part of chat and it should be present in this beautiful Library:)

Last question will be about the avatar views. Are they just UIImage's? or UIViews? the reason I am asking is if they are UIView's, It would be easy to display a UILabel beneath the avatars which is necessary for group chat. I realize there is not much horizontal space for the names but at least initials can be displayed or we can use small fonts just to inform the user. I don't think just the avatars are enough, since it is a big possibility that people can have same avatars or no avatars set at all.

Thanks to all of you who are keeping this Library alive:)

@zwang
Copy link
Contributor Author

zwang commented Mar 31, 2016

Hi @aytunch

First, the feature only supports adding avatar to messages. Not related to group chat. But should work in group chat too. It is just a matter of setting the avatar image for each message.

With this said, it allow you to put avatar image next to photo messages too. I just didn't do it in the demo app. You can checkout DemoTextMessageViewModel.swift line 49 and do the same thing for photo message in DemoPhotoMessageViewModel.swift just for a quick demo.

You definitely can display different avatar image according to senderId. What I did in the demo app is just an example, you can set the avatarImage value of MessageViewModelProtocol in any place as long as it make sense to you. For myself, I did in each message presenter.

Regarding the sender name under avatar, I think you can do the same extension as I did for avatar view. I would not recommend to have name bound together with avatar view. They can stay together, but they should not be bound together. So the avatar view is just an UIImageView holding images. An good idea might be to display the name right above the bubble.

Hope my answer helps. :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants