Giter Site home page Giter Site logo

nl.fokkezb.pulltorefresh's Introduction

Alloy Pull to Refresh Widget

gitTio NPM René Pot

NOTE: Starting TiSDK 6.2 this widget is no longer needed as RefreshControl is build in for Android like previously for iOS, you can stick with the Ti.UI.RefreshControl

The Alloy Pull to Refresh widget is a cross-platform no-brainer wrapper of Ti.UI.RefreshControl for iOS and Ivan's fork of Ti.SwipeRefreshLayout for Android.

Before version 2.0.0 this widget emulated the native Pull to Refresh concept for Ti.UI.TableView on both platforms. Since 2.0.0 it uses the native controls now available in Titanium Core and through Ivan's module for both Ti.UI.TableView and Ti.UI.ListView.

Also take a look at the Infinite Scroll widget.

Examples

Android

Android

iOS

iOS

Usage

  1. Download and install the distribution 0.4.1 or later of Ivan's fork of Ti.SwipeRefreshLayout.

  2. Install the widget via gitTio: gitTio

    gittio install nl.fokkezb.pullToRefresh

Or NPM: NPM

`npm i --save nl.fokkezb.pulltorefresh`
  1. Wrap the widget around your <ListView> or <TableView> in the view:

     <Alloy>
     	<Collection src="myCollection" />
     	<Window>
     		<Widget id="ptr" src="nl.fokkezb.pullToRefresh" onRelease="myRefresher">
     			<ListView>
     				<ListSection dataCollection="myCollection">
     					<ListItem title="{title}" />
     				</ListSection>
     			</ListView>
     		</Widget>
     	</Window>
     </Alloy>
    

    NOTE: The <Widget /> tag can't be the root element due to an Alloy limitation!

  2. Add your myRefresher function to the controller and call the e.hide() callback when you're done:

     function myRefresher(e) {
     	myCollection.fetch({
     		success: e.hide,
     		error: e.hide
     	});
     }
    
  3. Call the widget's refresh() to programmatically trigger the (initial) refresh:

     $.ptr.refresh();
    
  4. To pass arguments to Ti.UI.createRefreshControl and createSwipeRefresh() simply pass them to the widget as attributes of <Widget> or second arguments of createWidget().

Methods

Both platforms share the same API:

Function Parameters Usage
refresh Manually trigger pull + release
show Show the loading indicator
hide Hide the loading indicator
getList Get the list the widget is bound to
getControl Get the refresh control

Changelog

  • 3.0
    • Removes setTitle().
    • Passes all arguments/attributes on to Ti.UI.createRefreshControl() for iOS (e.g. to set title or tintColor) and createSwipeRefresh() for Android.
  • 2.2
  • 2.1
  • 2.0
    • Rewritten to use native API's.
  • 1.5
    • Workaround for regression in Alloy 1.3.0-cr
    • Closes #17 by checking source of events
    • New top option for compatibility with Ti.UI.Window.extendEdges on iOS7
    • Arrow now properly hidden on Android, using opacity
    • Default style updated to match Twitter on iOS7
  • 1.4
    • Now compatible with Android and other OS!
  • 1.3
    • From now on declared in the XML view instead of the controller!
    • Splitted init into setOptions and attach
    • Renamed remove to dettach
    • Renamed trigger to refresh to not interfere with BackBone
  • 1.2
    • Retina arrow images, including new (default) grey one
    • Removed text showing last update for more clear view
    • Easier styling
  • 1.1
    • Exposed new API functions to show/hide the view, set the date and trigger the widget manually.
    • Renamed load parameter to loader in line with upcomming widgets.
  • 1.0
    • Initial version

License

Copyright 2013-2015 Fokke Zandbergen

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

nl.fokkezb.pulltorefresh's People

Contributors

fokkezb avatar topener avatar wiltonkkw avatar adesugbaa avatar stereoket avatar mcongrove avatar 0x6e69636f avatar angelkbrown avatar felipeconti avatar jasonkneen 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.