Create ImageView for User or Group like Messenger app

Overview

MessengerBubbles

Banner

Version License Platform

App Image

Example

To run the example project, clone the repo, and run pod install from the Example directory first.

Requirements

Installation

CocoaPods

MessengerBubbles is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod 'MessengerBubbles'

Manually

If you prefer not to use any of the aforementioned dependency managers, you can integrate CodableCloudKit into your project manually. Simply drag the Sources Folder into your Xcode project.

Usage

From Storyboard

MessengerBubbles is a subview of UIView

Storyboard

Just create a UIView and replace the Custom Class with MessengerBubbles

You can choose if you want to enable the online bubble indicator, if the user or group is online or not, change the online buble color and border color.

Programmatically

You have many ways to create a MessengerBubbles

public init(size: CGFloat,
            borderColor: UIColor = .white,
            onlineBubbleColor: UIColor = PrivateConstants.onlineBubbleColor,
            enableOnlineBubble: Bool = true,
            isOnline: Bool = false)


public init(images: [UIImage?]?,
            size: CGFloat,
            borderColor: UIColor = .white,
            onlineBubbleColor: UIColor = PrivateConstants.onlineBubbleColor,
            enableOnlineBubble: Bool = true,
            isOnline: Bool = false)

public init(urls: [String?]?,
            size: CGFloat,
            borderColor: UIColor = .white,
            onlineBubbleColor: UIColor = PrivateConstants.onlineBubbleColor,
            enableOnlineBubble: Bool = true,
            isOnline: Bool = false)

Size is always requiered. All others properties have a default value.

MessengerBubbles(size: 60) // With size only

MessengerBubbles(size: 60, borderColor: .blue, 
                 onlineBubbleColor: .yellow,
                 enabledOnlineBubble: false,
                 isOnline: false) // With custom values

MessengerBubbles(images: images,
                 size: 60) // With an array of UIImage at initialization

MessengerBubbles(urls: urls,
                 size: 60) // With an array of String at initialization

You can set images after MessengerBubbles has been created. If your array contains 1 element, it will create a single bubble. By the way, if it contains 2 elements or more, it will create 2 bubbles even if it contains more than 2 elements.

public func setImages(with images: [UIImage?]?) // Set images with an array of UIImage
public func setImages(with urls: [String?]?) // Set images with an array of String

let bubble = MessengerBubbles(size: 60)
bubble.setImages(with: images)
//or
bubble.setImages(with: urls)

isOnline and onlineBubbleColor can be changed after initialization

bubble.isOnline = true // or false
bubble.onlineBubbleColor = .black // or whatever you want

Author

Laurent Grondin, [email protected]

Contributing

Contributions are very welcome 🙌

License

MessengerBubbles is available under the MIT license. See the LICENSE file for more info.

You might also like...
An image cropper / photo cropper for iOS like in the Contacts app with support for landscape orientation.
An image cropper / photo cropper for iOS like in the Contacts app with support for landscape orientation.

RSKImageCropper An image cropper for iOS like in the Contacts app with support for landscape orientation. Installation RSKImageCropper requires iOS 9.

Image slide-show viewer with multiple predefined transition styles, with ability to create new transitions with ease.
Image slide-show viewer with multiple predefined transition styles, with ability to create new transitions with ease.

ATGMediaBrowser ATGMediaBrowser is an image slide-show viewer that supports multiple predefined transition styles, and also allows the client to defin

SwiftColorArt is a demo application that includes Swift files with all classes and extension necessary to create a font color schema matching to an image
SwiftColorArt is a demo application that includes Swift files with all classes and extension necessary to create a font color schema matching to an image

SwiftColorArt SwiftColorArt is a demo application that includes Swift files with all classes and extension necessary to create a font color schema mat

iOS Swift class to create circular or rounded avatar images
iOS Swift class to create circular or rounded avatar images

SwiftyAvatar iOS Swift 3.0 UIimage class Create awesome circular avatar images! IBInspectable attributes accessible from the identity inspector. Round

Create complementary gradients generated from dominant and prominent colors in supplied image. Inspired by Grade.js
Create complementary gradients generated from dominant and prominent colors in supplied image. Inspired by Grade.js

ComplimentaryGradientView Create complementary gradients generated from dominant and prominent colors in supplied image. Inspired by Grade.js ❤️ .all

How to create a UIImagePicker demo?

chapter10UIImagePickerDemo How to create a UIImagePicker demo? I add 'Privacy - Camera Usage Description' and 'Privacy - Photo Library Usage Descripti

An extension to SnapshotTesting which allows you to create HEIC images

🗜 SnapshotTestingHEIC An extension to SnapshotTesting which allows you to create HEIC images. The benefit of using HEIC instead of PNG is that it can

Create an '.icns' file from any image

createicns Create an '.icns' file from any image. Usage This command line tool makes it incredibly simple to create an '.icns' icon file from an image

Comments
  • IB Designables Error Using Storyboard

    IB Designables Error Using Storyboard

    Hi, i am getting this error when use storyboard.

    Main.storyboard: error: IB Designables: Failed to render and update auto layout status for FromStoryboardViewController (qF2-ii-oeF): dlopen(MessengerBubbles.framework, 1): Library not loaded: @rpath/Kingfisher.framework/Kingfisher
      Referenced from: MessengerBubbles.framework
      Reason: image not found
    
    opened by ismaiI1 0
Owner
Laurent Grondin
iOS Developer
Laurent Grondin
How to create a circular and rectangular ImageView with similar image?

chapter11CircularAndRectangularImage How to create a circular and rectangular ImageView with similar image? I add two imageView in Main.storyboard I a

ahmetbostanciklioglu 0 Jan 8, 2022
add text(multiple line support) to imageView, edit, rotate or resize them as you want, then render the text on image

StickerTextView is an subclass of UIImageView. You can add multiple text to it, edit, rotate, resize the text as you want with one finger, then render the text on Image.

Textcat 478 Dec 17, 2022
Rounded async imageview downloader lightly cached and written in Swift

PASImageView ============ **Rounded async imageview downloader lightly cached and written in Swift 3 ** Objective-C version here Snapshot Usage //XIB

Pierre Abi-aad 173 Nov 6, 2022
DG Zoomable ImageView

DGZoomableImageView A zoomable, pan-able image view Requirements iOS 12.0+ Swift

donggyu 7 Aug 17, 2022
ImageView - Component for loading and displaying different images aka SVG/PNG/JPG/JPEG

ImageView Component that loads and displays images(.svg/.png/.jpg/.jpeg) form as

Sergei 1 Mar 23, 2022
FlaneurImagePicker is an iOS image picker that allows users to pick images from different sources (ex: user's library, user's camera, Instagram...). It's highly customizable.

FlaneurImagePicker is a highly customizable iOS image picker that allows users to pick images from different sources (ex: device's library, device's c

FlaneurApp 17 Feb 2, 2020
Microblog-ref-app - A Twitter like social media app that users can share their moments

HiPlace - iOS Table of Contents Introduction HMS Services Getting Started Suppor

null 2 Jan 3, 2022
IconsMaker - Create your app icon with SwiftUI and generate PNG images in all needed sizes

IconsMaker - Create your app icon with SwiftUI and generate PNG images in all needed sizes

Jonathan Gander 14 Oct 20, 2022
Generate random user Avatars for apps.

Avatar Generate random user Avatars for apps. Works for iOS 9.3+ Installation Simply install using Cocoapods, add 'pod Avatar' to your podfile Simple

William Vabrinskas 24 Nov 3, 2022
MemojiView - MemojiView works by having a TextView behind the actual View for user input

MemojiView Since there is no official API for using the users Memoji's i have built a simple view to retrieve them and use them to your liking. Memoji

Emre Armagan 9 Nov 6, 2022