Slide image viewer library similar to Twitter and LINE.

Overview

Platform Swift Cocoapods Carthage compatible License

Overview

You can use it simply by passing the necessary information!
Serrata is a UI library that allows you to intuitively view images.

Features

Kingfisher is a lightweight and pure Swift implemented library.
It is used in the Serrata. I sincerely respect Kingfisher!

  • Support iPhone, iPad and iPhone X! 🎉
  • It is the almost same as Image Viewer of Twitter and LINE. 😎

Requirements

  • Xcode 9.0+
  • iOS 11+
  • Swift 4.0+

Installation

Caution ⚠️

Kingfisher is installed, too!

CocoaPods

pod 'Serrata'

Carthage

github "horitaku46/Serrata"

Usage

See Example, for more details.

How to use in Example.

guard let selectedCell = collectionView.cellForItem(at: indexPath) as? ImageCell else {
    return
}

let slideLeafs: [SlideLeaf] = images.enumerated().map { SlideLeaf(image: $0.1,
                                                                  title: "Image Title \($0.0)",
                                                                  caption: "Index is \($0.0)") }

let slideImageViewController = SlideLeafViewController.make(leafs: slideLeafs,
                                                            startIndex: indexPath.row,
                                                            fromImageView: selectedCell.imageView)

slideImageViewController.delegate = self // Please watch the following SlideLeafViewControllerDelegate.
present(slideImageViewController, animated: true, completion: nil)

Details of SlideLeafViewController.make().

/// This method generates SlideLeafViewController.
///
/// - Parameters:
///   - leafs: It is array to display it by a slide.
///   - startIndex: It is for initial indication based on array of leafs.
///   - fromImageView: ImageView of the origin of transition. In the case of nil, CrossDissolve.
/// - Returns: Instance of SlideLeafViewController.
open class func make(leafs: [SlideLeaf], startIndex: Int = 0, fromImageView: UIImageView? = nil) -> SlideLeafViewController {
    // code...
}

Details of SlideLeaf.

import UIKit

public final class SlideLeaf: NSObject {

    public var image: UIImage?
    public var imageUrlString: String?

    public var title: String
    public var caption: String


    /// If either title and caption is empty, detailView is not displayed.
    ///
    /// - Parameters:
    ///   - image: To read by a slide.
    ///   - title: Title of the image.
    ///   - caption: Caption of the image.
    public init(image: UIImage?, title: String = "", caption: String = "") {
        self.image = image
        self.title = title
        self.caption = caption
    }

    /// If either title and caption is empty, detailView is not displayed.
    ///
    /// - Parameters:
    ///   - imageUrlString: To read by a slide. It is displayed by Kingfisher.
    ///   - title: Title of the image.
    ///   - caption: Caption of the image.
    public init(imageUrlString: String?, title: String = "", caption: String = "") {
        self.imageUrlString = imageUrlString
        self.title = title
        self.caption = caption
    }
}

delegate

Detail of SlideLeafViewControllerDelegate.

extension ViewController: SlideLeafViewControllerDelegate {

    func tapImageDetailView(slideLeaf: SlideLeaf, pageIndex: Int) {
        // code...
    }

    func longPressImageView(slideLeafViewController: SlideLeafViewController, slideLeaf: SlideLeaf, pageIndex: Int) {
        // code...
    }

    func slideLeafViewControllerDismissed(slideLeaf: SlideLeaf, pageIndex: Int) {
        // code...
    }
}

Author

Takuma Horiuchi

Example images from

License

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

You might also like...
Agrume - 🍋 An iOS image viewer written in Swift with support for multiple images.
Agrume - 🍋 An iOS image viewer written in Swift with support for multiple images.

Agrume An iOS image viewer written in Swift with support for multiple images. Requirements Swift 5.0 iOS 9.0+ Xcode 10.2+ Installation Use Swift Packa

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

Image gallery similar to Adidias' app, built in SwiftUI
Image gallery similar to Adidias' app, built in SwiftUI

TripleStackGallery TripleStackGallery is a image gallery component, which displays a set of images as a stack of three images, always displaying the i

AYImageKit is a Swift Library for Async Image Downloading, Show Name's Initials and Can View image in Separate Screen.
AYImageKit is a Swift Library for Async Image Downloading, Show Name's Initials and Can View image in Separate Screen.

AYImageKit AYImageKit is a Swift Library for Async Image Downloading. Features Async Image Downloading. Can Show Text Initials. Can have Custom Styles

A simple mesh viewer for MacOS based on Swift and Metal and using Assimp for loading meshes

Metal Mesh Viewer A simple triangle mesh viewer for MacOS This application is a simple (triangle) mesh viewer that should be capable of rendering even

An iOS/tvOS photo gallery viewer, useful for viewing a large (or small!) number of photos.
An iOS/tvOS photo gallery viewer, useful for viewing a large (or small!) number of photos.

This project is unmaintained. Alex passed away in an accident in late 2019. His love of iOS development will always be remembered. AXPhotoViewer AXPho

Swift/iOS viewer for photography galleries or portfolios
Swift/iOS viewer for photography galleries or portfolios

Swift/iOS viewer for photography galleries or portfolios. The app is intended for photographers who participate in classical photo clubs: a portfolio covers (curated) images that were presented and critiqued within a photo club.

add text(multiple line support) to imageView, edit, rotate or resize them as you want, then render the text on image
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.

📷 A composable image editor using Core Image and Metal.
📷 A composable image editor using Core Image and Metal.

Brightroom - Composable image editor - building your own UI Classic Image Editor PhotosCrop Face detection Masking component 🎉 v2.0.0-alpha now open!

Comments
  • Why to override layoutSubviews method in SlideLeafCell

    Why to override layoutSubviews method in SlideLeafCell

    https://github.com/horitaku46/Serrata/blob/88c2d5fadf1e1eb745f407b8232b33c89931d107/Serrata/Sources/SlideLeafCell.swift#L78

    @horitaku46 in what case do you think we need to refresh subviews of the SlideLeafCell?

    if let image = imageView.image {
           scrollView.setZoomScale(1, animated: false)
           calcImageViewFrame(image)
    }
    

    I found the case when it is called after double tap and the imageView inside SlideLeafCell is redrawn: https://imgur.com/a/Ej3d4

    In the video you can see that layoutSubviews() is called after I used setNeedsStatusBarAppearanceUpdate() and instead of to zoom, imageView is redrawn.

    opened by Stmol 2
  • iOS13: App is showing black window while dismissing SlideLeafViewController

    iOS13: App is showing black window while dismissing SlideLeafViewController

    Hello, I am using this library for showing images in full screen. It was working great on iOS 12. As soon as I updated the app to iOS 13, I am getting a blank window screen while dismissing the SlideLeafViewController.

    Is anyone facing the same issue?

    opened by angabani 2
  • Prevent tapping the bottom label from exiting the detailViewController

    Prevent tapping the bottom label from exiting the detailViewController

    Pressing the bottom label will exit the detailViewController even if the function was overriden

    func tapImageDetailView(slideLeaf: SlideLeaf, pageIndex: Int) {
            //Do something else here
        }
    
    opened by hadiyazdi 0
Releases(1.0.10)
Owner
Takuma Horiuchi
iOS Developer
Takuma Horiuchi
An image viewer à la Twitter

For the latest changes see the CHANGELOG Install CocoaPods pod 'ImageViewer' Carthage github "Krisiacik/ImageViewer" Sample Usage For a detailed examp

Kristian Angyal 2.4k Dec 29, 2022
DTPhotoViewerController - A fully customizable photo viewer ViewController to display single photo or collection of photos, inspired by Facebook photo viewer.

DTPhotoViewerController Example Demo video: https://youtu.be/aTLx4M4zsKk DTPhotoViewerController is very simple to use, if you want to display only on

Tung Vo 277 Dec 17, 2022
Simple PhotoBrowser/Viewer inspired by facebook, twitter photo browsers written by swift

SKPhotoBrowser [![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors-) Simple PhotoBrowser

keishi suzuki 2.4k Jan 6, 2023
Twitter Image Pipeline is a robust and performant image loading and caching framework for iOS clients

Twitter Image Pipeline (a.k.a. TIP) Background The Twitter Image Pipeline is a streamlined framework for fetching and storing images in an application

Twitter 1.8k Dec 17, 2022
Image viewer (or Lightbox) with support for local and remote videos and images

Table of Contents Features Focus Browse Rotation Zoom tvOS Setup Installation License Author Features Focus Select an image to enter into lightbox mod

Nes 534 Jan 3, 2023
Photo Browser / Viewer inspired by Facebook's and Tweetbot's with ARC support, swipe-to-dismiss, image progress and more

IDMPhotoBrowser IDMPhotoBrowser is a new implementation based on MWPhotoBrowser. We've added both user experience and technical features inspired by F

Thiago Peres 2.7k Dec 21, 2022
Lightbox is a convenient and easy to use image viewer for your iOS app

Lightbox is a convenient and easy to use image viewer for your iOS app, packed with all the features you expect: Paginated image slideshow. V

HyperRedink 1.5k Dec 22, 2022
Swift image slideshow with circular scrolling, timer and full screen viewer

?? ImageSlideshow Customizable Swift image slideshow with circular scrolling, timer and full screen viewer ?? Example To run the example project, clon

Petr Zvoníček 1.7k Dec 21, 2022
A snappy image viewer with zoom and interactive dismissal transition.

A snappy image viewer with zoom and interactive dismissal transition. Features Double tap to zoom in/out Interactive dismissal transition Animate in f

Lucas 421 Dec 1, 2022
A snappy image viewer with zoom and interactive dismissal transition.

A snappy image viewer with zoom and interactive dismissal transition. Features Double tap to zoom in/out Interactive dismissal transition Animate in f

Lucas 421 Dec 1, 2022