Customizable Picker for Mobile OS

Download
Features

Code Foundation

AnyPicker is built using HTML, CSS & jQuery. Library source code is well structured & has elaborate naming conventions reducing learning curve to use AnyPicker.

Native UX & Performance

A truly native UI experience. Pixel perfect design, handcrafted for iOS & Android. Also included a clean default theme for custom design. Well suited for all mobile device orientations with smooth performance & touch gesture interactions.

iOS Special

Seamless automatic view conversion for iOS devices. View picker as a dialog box on iPhone & as a popover on iPad without writing a single line of extra code.

Android Special

Built with special attention to high resolution devices like Kindle HDX & Galaxy S4. AnyPicker renders correctly on such devices for both type of orientations, giving a perfect native feel for your app or mobile website. Another android specialty included is up & down spinner buttons for tap navigation.

Windows Phone Special

Precise gesture calibrations using Microsoft prescribed pointer-based events. Appreciate perfectly designed full-screen Windows Phone styled picker layout.

Title Configuration

Configure picker title to display different types of label value. Fixed label, change label as per scrolling picker value or write your own function for title label using any picker value.

Ready To Use Pickers

Embed pre-built pickers in your application for quick turnaround. Date Picker, Time Picker, Date Time Picker, Month-Year Picker, Star Rating Picker, Currency Picker & Country Picker.

Core Includes

AnyPicker includes basic features like RTL support, Localization support enabled, common layouts (Dialog box, Relative, Inline, Popover, Fixed-Top & Fixed-Bottom), change input value on scroll, default set of buttons (Done/Set, Cancel, Clear, Now), etc.

Cross Platform

Works smoothly on iOS 7+, Android 4+ & Windows Phone 8+ webview. Need a mobile site with native pickers? No worries, AnyPicker supports Chrome, Firefox, Opera & IE11+ browsers on both desktop & mobile.

Demo
Date Picker Pure Native
iOS
Android
Default
configure: min-max date, user-defined date formats, disable date or date range (invalid dates), short & long month names, RTL support
Time Picker Pure Native
iOS
Android
Default
configure: 12/24 hour format, RTL support, user-defined time formats, disable time or time range
DateTime Picker Pure Native
iOS
Android
Default
Clean segmented tab design gives a consistent experience in portrait & landscape orientation.
Content Section Customizable
iOS
Android
Default
configure: top section, bottom section
Provision to embed content in 2 different sections of picker. Each section can be individually customized to show any styled UI component (text, buttons, check box etc) as per user specific design.
Multi-Component & Style Customizable
iOS
Android
Default
configure: number of components, component label, width, alignment, value range, custom button
Create your own custom styled picker. Set component label, style the component, include content section etc to create any kind of picker you want, e.g. Day-Hour-Min picker having human readable output format (in-built function).
Component Logic Customizable
iOS
Android
Default
Provision to write conditional component logic for any type of picker you want to create, eg Show countries from Asia. Control behavior of one component from another on change event.
Select Customizable
iOS
Android
Default
Create any type of single select picker using <select>, <ul> & <ol> tags. Configure rowView to create different picker layouts using values from any of these 3 html tags, e.g. use webfont icons with text.
Windows Phone 8+ Pure Native
Windows
Windows
Windows
Windows Phone styled full-screen picker layout, with gesture carefully calibrated using Microsoft prescribed pointer-based events. Example above shows placement of segmented tab, single select component, component label & provision to write text at top & bottom inside picker.

CalenStyle - Event Calendar

Responsive Calendar Library for Web & Mobile

Explore
Quick Start

Installations

npm - 

npm install anypicker

bower - 

bower install anypicker

CDN

<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/anypicker@latest/dist/anypicker-all.min.css" />
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/anypicker@latest/dist/anypicker.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/anypicker@latest/dist/i18n/anypicker-i18n.js"></script>