Simple and beautiful stacked UIView to use as a replacement for an UITableView, UIImageView or as a menu

Overview

VBPiledView

simple but highly effective animation and interactivity!

By v-braun - viktor-braun.de.

CocoaPods

Preview

image

Description

Very simple and beautiful stacked UIView to use as a replacement for an UITableView, UIImageView or as a menu.

Inspired by this post from ULTRALINX:

image

Installation

CocoaPods

VBPiledView is available on CocoaPods. Just add the following to your project Podfile:

pod 'VBPiledView', '~> 1.4'

Or from GitHub:

pod 'VBPiledView', :git => 'https://github.com/v-braun/VBPiledView.git'

Manually

  1. Download and drop VBPiledView.swift in your project.
  2. Congratulations!

Usage

See the Example Project.

Here is a sample ViewController that use the VBPiledView:

import VBPiledView
class ViewController: UIViewController, VBPiledViewDataSource {

    @IBOutlet var piledView: VBPiledView!
    
    private var _subViews = [UIView]()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        _subViews.append(UIImageView(image: UIImage(named: "ant.jpg")))
        _subViews.append(UIImageView(image: UIImage(named: "bigban.jpg")))
        _subViews.append(UIImageView(image: UIImage(named: "leopard.jpg")))
        _subViews.append(UIImageView(image: UIImage(named: "libertystate.jpg")))
        _subViews.append(UIImageView(image: UIImage(named: "Moonrise.jpg")))
        _subViews.append(UIImageView(image: UIImage(named: "photographer.jpg")))
        
        for v in _subViews{
            v.contentMode = UIViewContentMode.ScaleAspectFill
            v.clipsToBounds = true
            v.backgroundColor = UIColor.grayColor()
        }
        
        piledView.dataSource = self
    }
    
    func piledView(numberOfItemsForPiledView: VBPiledView) -> Int {
        return _subViews.count
    }
    
    func piledView(viewForPiledView: VBPiledView, itemAtIndex index: Int) -> UIView {
        return _subViews[index]
    }
}

Configuration

The sizes of an expanded item and of all collapsed items can be configured relative to the size of the VBPiledView.

self.piledView.expandedContentHeightInPercent = 70 // expanded content height -> 70% of screen
self.piledView.collapsedContentHeightInPercent = 15 // collapsed content heigt of single item -> 15% of screen

Related Projects

Known Issues

If you discover any bugs, feel free to create an issue on GitHub fork and send me a pull request.

Issues List.

Authors

image
v-braun

Contributing

  1. Fork it
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Add some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request

License

See LICENSE.

You might also like...
A simpler way to do cool UITableView animations! (╯°□°)╯︵ ┻━┻
A simpler way to do cool UITableView animations! (╯°□°)╯︵ ┻━┻

TableFlip (╯°□°)╯︵ ┻━┻ ┬──┬ ノ( ゜-゜ノ) Animations are cool. UITableView isn't. So why not make animating UITableView cool? The entire API for TableFlip

A UITableView extension that enables cell insertion from the bottom of a table view.
A UITableView extension that enables cell insertion from the bottom of a table view.

ReverseExtension UITableView extension that enabled to insert cell from bottom of tableView. Concept It is difficult to fill a tableview content from

A declarative wrapper approach to UITableView

Thunder Table Thunder Table is a useful framework which enables quick and easy creation of table views in iOS, making the process of creating complex

Use Yelp API to fetch restuarants around a location and show them in a table view
Use Yelp API to fetch restuarants around a location and show them in a table view

Yelp Use Yelp API to fetch restuarants around a location and show them in a table view - Infinite scrolling, Prefetching, Image Caching. Design Patter

a TableView have thumbnail cell only, and you can use gesture let it expands other expansionView, all diy
a TableView have thumbnail cell only, and you can use gesture let it expands other expansionView, all diy

ZYThumbnailTableView #####可展开型预览TableView,开放接口,完全自由定制 #####An expandable preview TableView, custom-made all the modules completely with open API you c

An easy to use UITableViewCell subclass that allows to display swippable buttons with a variety of transitions.
An easy to use UITableViewCell subclass that allows to display swippable buttons with a variety of transitions.

MGSwipeTableCell MGSwipeTableCell is an easy to use UITableViewCell subclass that allows to display swipeable buttons with a variety of transitions. T

An easy-to-use UITableViewCell subclass that implements a swippable content view which exposes utility buttons (similar to iOS 7 Mail Application)
An easy-to-use UITableViewCell subclass that implements a swippable content view which exposes utility buttons (similar to iOS 7 Mail Application)

SWTableViewCell An easy-to-use UITableViewCell subclass that implements a swipeable content view which exposes utility buttons (similar to iOS 7 Mail

Simple static table views for iOS in Swift.
Simple static table views for iOS in Swift.

Simple static table views for iOS in Swift. Static's goal is to separate model data from presentation. Rows and Sections are your “view models” for yo

PreviewTransition is a simple preview gallery UI controller with animated tranisitions.
PreviewTransition is a simple preview gallery UI controller with animated tranisitions.

PreviewTransition is a simple preview gallery UI controller with animated tranisitions. Swift UI library made by @Ramotion

Comments
  • Resize rows

    Resize rows

    Hey,

    How can i easily resize rows with your lib? Maybe can you implement it ? ;)

    If you do not have time, i can make a pull request when i've got some times for this. later,

    opened by gorbat-o 7
  • Item selection

    Item selection

    Hey, very cool work but how do you retrieve an item index click ? I mean i want to perform a segue retrieving the index item and its label title ? Thx :)

    opened by sebastienboulogne 3
  • Manual Installation

    Manual Installation

    CocoaPods and Carthage are awesome tools and make our life really easier, but there are some devs who still don't know how to use them.

    It would be cool to add the Manual installation guide in your README.md. You can take a look at my iOS Readme Template to see how you can do it.

    opened by lfarah 1
Owner
Viktor Braun
Viktor Braun
A pixel perfect replacement for UITableView section index, written in Swift

MYTableViewIndex MYTableViewIndex is a re-implementation of UITableView section index. This control is usually seen in apps displaying contacts, track

Yury 520 Oct 27, 2022
A PageView, which supporting scrolling to transition between a UIView and a UITableView

YXTPageView ##A Page View, which support scrolling to transition between a UIView and a UITableView UIView (at the top) UITableView (at the bottom) In

Hanton Yang 68 May 25, 2022
A simple way to create a UITableView for settings in Swift.

QuickTableViewController A simple way to create a table view for settings, including: Table view cells with UISwitch Table view cells with center alig

Cheng-Yao Lin 525 Dec 20, 2022
Simple single-selection or multiple-selection checklist, based on UITableView

SelectionList Simple single-selection or multiple-selection checklist, based on UITableView. Usage let selectionList = SelectionList() selectionList.i

Yonat Sharon 111 Oct 6, 2022
Easy UITableView drag-and-drop cell reordering

SwiftReorder NOTE: Some users have encountered compatibility issues when using this library with recent versions of iOS. For apps targeting iOS 11 and

Adam Shin 378 Dec 13, 2022
A cells of UITableView can be rearranged by drag and drop.

TableViewDragger This is a demo that uses a TableViewDragger. Appetize's Demo Requirements Swift 4.2 iOS 8.0 or later How to Install TableViewDragger

Kyohei Ito 515 Dec 28, 2022
Protocol-oriented UITableView management, powered by generics and associated types.

DTTableViewManager Features Powerful mapping system between data models and cells, headers and footers Automatic datasource and interface synchronizat

Denys Telezhkin 454 Nov 9, 2022
INTUZ is presenting an interesting a Multilevel Expand/Collapse UITableView App Control to integrate inside your native iOS-based application

INTUZ is presenting an interesting a Multilevel Expand/Collapse UITableView App Control to integrate inside your native iOS-based application. MultilevelTableView is a simple component, which lets you use the tableview with multilevel tree view in your project.

INTUZ 3 Oct 3, 2022
A declarative api for working with UITableView.

⚡️ Lightning Table Lightning Table provides a powerful declarative API for working with UITableView's. Table views are the foundation of almost every

Electric Kangaroo 28 Aug 25, 2021
A subclass of UITableView that styles it like Settings.app on iPad

TORoundedTableView As of iOS 13, Apple has released an official version of this table view style called UITableViewStyleInsetGrouped! Yay! In order to

Tim Oliver 162 Nov 2, 2022