Giter Club home page Giter Club logo

cppickerview's Introduction

Description

A custom, configurable, horizontal version of UIPickerView.

Also included is CPPickerViewCell, a UITableViewCell sublcass that adds a CPPickerView to the right side of the cell. This cell was envisioned for a settings-type view, allowing a multi-option setting to be handled in a single table row (whereas normally it would require a disclosure or multiple rows).

If you're interested in a vertical custom UIPickerView controller, check out AFPickerView by Arkady Fraerman! This code is essentially forked from his project.

CPPickerView screenshot

CPPickerView is currently in use by at least one approved app in the App Store (Hipmunk for iPhone/iPad!).

Usage

General

To customize the appearance, replace the following images with your own:

  • wheelBackground.png
  • stretchableGlass.png
  • shadowOverlay.png

NOTE: CPPickerView uses - (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets (for iOS 5.0 and up) or - (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets (for below iOS 5.0) to stretch wheelBackground.png and stretchableGlass.png. Be sure to look at the sample images in relation to the cap sizes set in CPPickerView.m's initWithFrame: before changing the sizing of the images, as you may need to adjust the caps. shadowOverlay.png is currently simply stretched to fit the frame.

Several appearance options are settable via properties:

  • BOOL showGlass - defines whether or not to show the "glass" overlay over the selected item.
  • UIEdgeInsets peekInset - defines the amount the item to the left and right of the currently selected item "peek" into view. This can be used as an indication to the user that there are other items, if desired. NOTE: You most likely want to leave the top and bottom inset values at 0, and adjust the left and right values. Larger inset values mean more peek.

You can also enable/disable the ability for the user to change the picker via the enabled property. The default state is YES.

Standard Usage

Create a CPPickerView instance and configure it:

pickerView = [[CPPickerView alloc] initWithFrame:CGRectMake(30.0, 250.0, 126.0, 197.0)];
pickerView.rowFont = [UIFont boldSystemFontOfSize:19.0];
pickerView.rowIndent = 10.0;
pickerView.showGlass = YES;

Set the dataSource, delegate, and call [pickerView reloadData]:

pickerView.dataSource = self;
pickerView.delegate = self;
[pickerView reloadData];

Then implement CPPickerViewDataSource and CPPickerViewDelegate in your controller.

CPPickerViewCell Usage

Use CPPickerViewCell like a normal UITableViewCell. Inside tableView:cellForRowAtIndexPath:, dequeue or create the cell:

CPPickerViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
    cell = [[CPPickerViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
}

Set the data source and the delegate for the cell, and inform it of it's index path:

cell.dataSource = self;
cell.delegate = self;
cell.currentIndexPath = indexPath;

NOTE: CPPickerViewCells MUST be informed of their index path in the table, or you won't be able to distinguish between them in your datasource and delegate methods!

And implement CPPickerViewCellDataSource and CPPickerViewCellDelegate per the protocols. In the included example the TableViewController (i.e. self) is set up as the data source and delegate for all cells.

The data source/delegate methods for CPPickerViewCell convert the normal CPPickerView data source/delegate methods to refer to the requests for data by NSIndexPath rather than the CPPickerView object (to match the typical way table cells are identified).

Finally, reload the cell (aka the CPPickerView, the items in the picker will be requested again) and then reconfigure it with any specific settings for the given row if you're recalling some previously stored settings. Then return the cell.

[cell reloadData];
// Reconfigure
cell.showGlass = YES;
cell.peekInset = UIEdgeInsetsMake(0, 18, 0, 18);
NSInteger *storedSelectedIndex = [[AnArrayOfStoredStuff objectAtIndex:indexPath.row] intValue];
[cell selectItemAtIndex:storedSelectedIndex animated:NO];  //Unanimated, because this should be immediate
return cell;

Todo

  • Any ideas?

About

Charles Powell

Give me a shout if you're using this in your project!

cppickerview's People

Contributors

cbpowell avatar panyam avatar adamcoulombe avatar brianpseudo avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.