Repository files navigation

CBStoreHouseRefreshControl License MIT

VersionPlatform

What is it?

A fully customizable pull-to-refresh control for iOS inspired by Storehouse iOS app

![screenshot1] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl1.gif)

You can use any shape through a plist file, like this one:

![screenshot2] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl2.gif)

Which files are needed?

CBStoreHouseRefreshControl is available through CocoaPods, to install it simply add the following line to your Podfile:

pod 'CBStoreHouseRefreshControl'

Alternatively, you can just drag CBStoreHouseRefreshControl (.h .m) and BarItem (.h .m) into your own project.

How to use it

You can attach it to any UIScrollView like UITableView or UICollectionView using following simple static method:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"];

Or, using this method for more configurable options:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist
color:(UIColor *)color
lineWidth:(CGFloat)lineWidth
dropHeight:(CGFloat)dropHeight
scale:(CGFloat)scale
horizontalRandomness:(CGFloat)horizontalRandomness
reverseLoadingAnimation:(BOOL)reverseLoadingAnimation
internalAnimationFactor:(CGFloat)internalAnimationFactor;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"color:[UIColor whiteColor] lineWidth:1.5dropHeight:80scale:1horizontalRandomness:150reverseLoadingAnimation:YESinternalAnimationFactor:0.5];

Then, implement UIScrollViewDelegate in your UIViewController if you haven't already, and pass the calls through to the refresh control:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
[self.storeHouseRefreshControl scrollViewDidScroll];
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
[self.storeHouseRefreshControl scrollViewDidEndDragging];
}

Lastly, make sure you've implemented the refreshAction you passed it earlier to listen for refresh triggers:

- (void)refreshTriggered
{
//call your loading method here//Finshed loading the data, reset the refresh control
[self.storeHouseRefreshControl finishingLoading];
}

For more details, please check out the demo app's code.

How to use your own shape

The CBStoreHouseRefreshControl's shape contains bunch of BarItem for animation, each BarItem is running its own animation, you need to provide startPoint and endPoint through a plist file.

All BarItem will share one coordinate system whose origin is at the top-left corner. For example if you want to draw a square, the plist will look like this:

![screenshot2] (https://s3.amazonaws.com/suyu.test/square.png)

The result will look like this:

![screenshot3] (https://s3.amazonaws.com/suyu.test/square.gif)

Notes:

  • Make sure you put the right key which are startPoints and endPoints.
  • Make sure you are using the right format ({x,y}) for coordinates.
  • The highlight/loading animation will highlight each bar item in the same order you declare them in plist, use reverseLoadingAnimation to reverse the animation.

Easy way to generate startPoint and endPoint?

@isaced mentions that it's easier to use PaintCode to generate startPoint and endPoint:

![screenshot4] (https://cloud.githubusercontent.com/assets/2088605/4948694/0ce2da74-667f-11e4-8ce7-a2067f15558d.png)

Result:

![screenshot5] (https://cloud.githubusercontent.com/assets/2088605/4948707/3b76afb4-667f-11e4-91a4-9509d17356fa.gif)

You can get more info here.

Configuration

Play with following parameters to configure CBStoreHouseRefreshControl's view and animation:

  • Set the bar color with the color parameter
  • Set the bar width with the lineWidth parameter
  • Set the height of control with the dropHeight parameter
  • Set the scale of control with the scale parameter
  • Adjust how disperse the bar items appear/disappear by changing the horizontalRandomness parameter
  • Set if reversing the loading animation with the reverseLoadingAnimation parameter, if set to YES, the last bar item will be highlighted firstly.
  • Adjust the time offset of the appear/disappear animation by changing the internalAnimationFactor parameter, for example if internalAnimationFactor is 1 all bar items will appear/disappear all together.

Who's using it?

We've a wiki page for that, feel free to add your projects there!

Author

Suyu Zhang
suyu_zhang@hotmail.com
suyuzhang.com

License

Copyright (c) 2014 Suyu Zhang suyu_zhang@hotmail.com. See the LICENSE file for license rights and limitations (MIT).

About

Fully customizable pull-to-refresh control inspired by Storehouse iOS app

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content

Repository files navigation

CBStoreHouseRefreshControl License MIT

VersionPlatform

What is it?

A fully customizable pull-to-refresh control for iOS inspired by Storehouse iOS app

![screenshot1] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl1.gif)

You can use any shape through a plist file, like this one:

![screenshot2] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl2.gif)

Which files are needed?

CBStoreHouseRefreshControl is available through CocoaPods, to install it simply add the following line to your Podfile:

pod 'CBStoreHouseRefreshControl'

Alternatively, you can just drag CBStoreHouseRefreshControl (.h .m) and BarItem (.h .m) into your own project.

How to use it

You can attach it to any UIScrollView like UITableView or UICollectionView using following simple static method:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"];

Or, using this method for more configurable options:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist
color:(UIColor *)color
lineWidth:(CGFloat)lineWidth
dropHeight:(CGFloat)dropHeight
scale:(CGFloat)scale
horizontalRandomness:(CGFloat)horizontalRandomness
reverseLoadingAnimation:(BOOL)reverseLoadingAnimation
internalAnimationFactor:(CGFloat)internalAnimationFactor;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"color:[UIColor whiteColor] lineWidth:1.5dropHeight:80scale:1horizontalRandomness:150reverseLoadingAnimation:YESinternalAnimationFactor:0.5];

Then, implement UIScrollViewDelegate in your UIViewController if you haven't already, and pass the calls through to the refresh control:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
[self.storeHouseRefreshControl scrollViewDidScroll];
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
[self.storeHouseRefreshControl scrollViewDidEndDragging];
}

Lastly, make sure you've implemented the refreshAction you passed it earlier to listen for refresh triggers:

- (void)refreshTriggered
{
//call your loading method here//Finshed loading the data, reset the refresh control
[self.storeHouseRefreshControl finishingLoading];
}

For more details, please check out the demo app's code.

How to use your own shape

The CBStoreHouseRefreshControl's shape contains bunch of BarItem for animation, each BarItem is running its own animation, you need to provide startPoint and endPoint through a plist file.

All BarItem will share one coordinate system whose origin is at the top-left corner. For example if you want to draw a square, the plist will look like this:

![screenshot2] (https://s3.amazonaws.com/suyu.test/square.png)

The result will look like this:

![screenshot3] (https://s3.amazonaws.com/suyu.test/square.gif)

Notes:

  • Make sure you put the right key which are startPoints and endPoints.
  • Make sure you are using the right format ({x,y}) for coordinates.
  • The highlight/loading animation will highlight each bar item in the same order you declare them in plist, use reverseLoadingAnimation to reverse the animation.

Easy way to generate startPoint and endPoint?

@isaced mentions that it's easier to use PaintCode to generate startPoint and endPoint:

![screenshot4] (https://cloud.githubusercontent.com/assets/2088605/4948694/0ce2da74-667f-11e4-8ce7-a2067f15558d.png)

Result:

![screenshot5] (https://cloud.githubusercontent.com/assets/2088605/4948707/3b76afb4-667f-11e4-91a4-9509d17356fa.gif)

You can get more info here.

Configuration

Play with following parameters to configure CBStoreHouseRefreshControl's view and animation:

  • Set the bar color with the color parameter
  • Set the bar width with the lineWidth parameter
  • Set the height of control with the dropHeight parameter
  • Set the scale of control with the scale parameter
  • Adjust how disperse the bar items appear/disappear by changing the horizontalRandomness parameter
  • Set if reversing the loading animation with the reverseLoadingAnimation parameter, if set to YES, the last bar item will be highlighted firstly.
  • Adjust the time offset of the appear/disappear animation by changing the internalAnimationFactor parameter, for example if internalAnimationFactor is 1 all bar items will appear/disappear all together.

Who's using it?

We've a wiki page for that, feel free to add your projects there!

Author

Suyu Zhang
suyu_zhang@hotmail.com
suyuzhang.com

License

Copyright (c) 2014 Suyu Zhang suyu_zhang@hotmail.com. See the LICENSE file for license rights and limitations (MIT).

About

Fully customizable pull-to-refresh control inspired by Storehouse iOS app

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Repository files navigation

CBStoreHouseRefreshControl License MIT

VersionPlatform

What is it?

A fully customizable pull-to-refresh control for iOS inspired by Storehouse iOS app

![screenshot1] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl1.gif)

You can use any shape through a plist file, like this one:

![screenshot2] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl2.gif)

Which files are needed?

CBStoreHouseRefreshControl is available through CocoaPods, to install it simply add the following line to your Podfile:

pod 'CBStoreHouseRefreshControl'

Alternatively, you can just drag CBStoreHouseRefreshControl (.h .m) and BarItem (.h .m) into your own project.

How to use it

You can attach it to any UIScrollView like UITableView or UICollectionView using following simple static method:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"];

Or, using this method for more configurable options:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist
color:(UIColor *)color
lineWidth:(CGFloat)lineWidth
dropHeight:(CGFloat)dropHeight
scale:(CGFloat)scale
horizontalRandomness:(CGFloat)horizontalRandomness
reverseLoadingAnimation:(BOOL)reverseLoadingAnimation
internalAnimationFactor:(CGFloat)internalAnimationFactor;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"color:[UIColor whiteColor] lineWidth:1.5dropHeight:80scale:1horizontalRandomness:150reverseLoadingAnimation:YESinternalAnimationFactor:0.5];

Then, implement UIScrollViewDelegate in your UIViewController if you haven't already, and pass the calls through to the refresh control:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
[self.storeHouseRefreshControl scrollViewDidScroll];
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
[self.storeHouseRefreshControl scrollViewDidEndDragging];
}

Lastly, make sure you've implemented the refreshAction you passed it earlier to listen for refresh triggers:

- (void)refreshTriggered
{
//call your loading method here//Finshed loading the data, reset the refresh control
[self.storeHouseRefreshControl finishingLoading];
}

For more details, please check out the demo app's code.

How to use your own shape

The CBStoreHouseRefreshControl's shape contains bunch of BarItem for animation, each BarItem is running its own animation, you need to provide startPoint and endPoint through a plist file.

All BarItem will share one coordinate system whose origin is at the top-left corner. For example if you want to draw a square, the plist will look like this:

![screenshot2] (https://s3.amazonaws.com/suyu.test/square.png)

The result will look like this:

![screenshot3] (https://s3.amazonaws.com/suyu.test/square.gif)

Notes:

  • Make sure you put the right key which are startPoints and endPoints.
  • Make sure you are using the right format ({x,y}) for coordinates.
  • The highlight/loading animation will highlight each bar item in the same order you declare them in plist, use reverseLoadingAnimation to reverse the animation.

Easy way to generate startPoint and endPoint?

@isaced mentions that it's easier to use PaintCode to generate startPoint and endPoint:

![screenshot4] (https://cloud.githubusercontent.com/assets/2088605/4948694/0ce2da74-667f-11e4-8ce7-a2067f15558d.png)

Result:

![screenshot5] (https://cloud.githubusercontent.com/assets/2088605/4948707/3b76afb4-667f-11e4-91a4-9509d17356fa.gif)

You can get more info here.

Configuration

Play with following parameters to configure CBStoreHouseRefreshControl's view and animation:

  • Set the bar color with the color parameter
  • Set the bar width with the lineWidth parameter
  • Set the height of control with the dropHeight parameter
  • Set the scale of control with the scale parameter
  • Adjust how disperse the bar items appear/disappear by changing the horizontalRandomness parameter
  • Set if reversing the loading animation with the reverseLoadingAnimation parameter, if set to YES, the last bar item will be highlighted firstly.
  • Adjust the time offset of the appear/disappear animation by changing the internalAnimationFactor parameter, for example if internalAnimationFactor is 1 all bar items will appear/disappear all together.

Who's using it?

We've a wiki page for that, feel free to add your projects there!

Author

Suyu Zhang
suyu_zhang@hotmail.com
suyuzhang.com

License

Copyright (c) 2014 Suyu Zhang suyu_zhang@hotmail.com. See the LICENSE file for license rights and limitations (MIT).

About

Fully customizable pull-to-refresh control inspired by Storehouse iOS app

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Repository files navigation

CBStoreHouseRefreshControl License MIT

VersionPlatform

What is it?

A fully customizable pull-to-refresh control for iOS inspired by Storehouse iOS app

![screenshot1] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl1.gif)

You can use any shape through a plist file, like this one:

![screenshot2] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl2.gif)

Which files are needed?

CBStoreHouseRefreshControl is available through CocoaPods, to install it simply add the following line to your Podfile:

pod 'CBStoreHouseRefreshControl'

Alternatively, you can just drag CBStoreHouseRefreshControl (.h .m) and BarItem (.h .m) into your own project.

How to use it

You can attach it to any UIScrollView like UITableView or UICollectionView using following simple static method:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"];

Or, using this method for more configurable options:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist
color:(UIColor *)color
lineWidth:(CGFloat)lineWidth
dropHeight:(CGFloat)dropHeight
scale:(CGFloat)scale
horizontalRandomness:(CGFloat)horizontalRandomness
reverseLoadingAnimation:(BOOL)reverseLoadingAnimation
internalAnimationFactor:(CGFloat)internalAnimationFactor;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"color:[UIColor whiteColor] lineWidth:1.5dropHeight:80scale:1horizontalRandomness:150reverseLoadingAnimation:YESinternalAnimationFactor:0.5];

Then, implement UIScrollViewDelegate in your UIViewController if you haven't already, and pass the calls through to the refresh control:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
[self.storeHouseRefreshControl scrollViewDidScroll];
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
[self.storeHouseRefreshControl scrollViewDidEndDragging];
}

Lastly, make sure you've implemented the refreshAction you passed it earlier to listen for refresh triggers:

- (void)refreshTriggered
{
//call your loading method here//Finshed loading the data, reset the refresh control
[self.storeHouseRefreshControl finishingLoading];
}

For more details, please check out the demo app's code.

How to use your own shape

The CBStoreHouseRefreshControl's shape contains bunch of BarItem for animation, each BarItem is running its own animation, you need to provide startPoint and endPoint through a plist file.

All BarItem will share one coordinate system whose origin is at the top-left corner. For example if you want to draw a square, the plist will look like this:

![screenshot2] (https://s3.amazonaws.com/suyu.test/square.png)

The result will look like this:

![screenshot3] (https://s3.amazonaws.com/suyu.test/square.gif)

Notes:

  • Make sure you put the right key which are startPoints and endPoints.
  • Make sure you are using the right format ({x,y}) for coordinates.
  • The highlight/loading animation will highlight each bar item in the same order you declare them in plist, use reverseLoadingAnimation to reverse the animation.

Easy way to generate startPoint and endPoint?

@isaced mentions that it's easier to use PaintCode to generate startPoint and endPoint:

![screenshot4] (https://cloud.githubusercontent.com/assets/2088605/4948694/0ce2da74-667f-11e4-8ce7-a2067f15558d.png)

Result:

![screenshot5] (https://cloud.githubusercontent.com/assets/2088605/4948707/3b76afb4-667f-11e4-91a4-9509d17356fa.gif)

You can get more info here.

Configuration

Play with following parameters to configure CBStoreHouseRefreshControl's view and animation:

  • Set the bar color with the color parameter
  • Set the bar width with the lineWidth parameter
  • Set the height of control with the dropHeight parameter
  • Set the scale of control with the scale parameter
  • Adjust how disperse the bar items appear/disappear by changing the horizontalRandomness parameter
  • Set if reversing the loading animation with the reverseLoadingAnimation parameter, if set to YES, the last bar item will be highlighted firstly.
  • Adjust the time offset of the appear/disappear animation by changing the internalAnimationFactor parameter, for example if internalAnimationFactor is 1 all bar items will appear/disappear all together.

Who's using it?

We've a wiki page for that, feel free to add your projects there!

Author

Suyu Zhang
suyu_zhang@hotmail.com
suyuzhang.com

License

Copyright (c) 2014 Suyu Zhang suyu_zhang@hotmail.com. See the LICENSE file for license rights and limitations (MIT).

About

Fully customizable pull-to-refresh control inspired by Storehouse iOS app

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content

Repository files navigation

CBStoreHouseRefreshControl License MIT

VersionPlatform

What is it?

A fully customizable pull-to-refresh control for iOS inspired by Storehouse iOS app

![screenshot1] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl1.gif)

You can use any shape through a plist file, like this one:

![screenshot2] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl2.gif)

Which files are needed?

CBStoreHouseRefreshControl is available through CocoaPods, to install it simply add the following line to your Podfile:

pod 'CBStoreHouseRefreshControl'

Alternatively, you can just drag CBStoreHouseRefreshControl (.h .m) and BarItem (.h .m) into your own project.

How to use it

You can attach it to any UIScrollView like UITableView or UICollectionView using following simple static method:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"];

Or, using this method for more configurable options:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist
color:(UIColor *)color
lineWidth:(CGFloat)lineWidth
dropHeight:(CGFloat)dropHeight
scale:(CGFloat)scale
horizontalRandomness:(CGFloat)horizontalRandomness
reverseLoadingAnimation:(BOOL)reverseLoadingAnimation
internalAnimationFactor:(CGFloat)internalAnimationFactor;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"color:[UIColor whiteColor] lineWidth:1.5dropHeight:80scale:1horizontalRandomness:150reverseLoadingAnimation:YESinternalAnimationFactor:0.5];

Then, implement UIScrollViewDelegate in your UIViewController if you haven't already, and pass the calls through to the refresh control:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
[self.storeHouseRefreshControl scrollViewDidScroll];
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
[self.storeHouseRefreshControl scrollViewDidEndDragging];
}

Lastly, make sure you've implemented the refreshAction you passed it earlier to listen for refresh triggers:

- (void)refreshTriggered
{
//call your loading method here//Finshed loading the data, reset the refresh control
[self.storeHouseRefreshControl finishingLoading];
}

For more details, please check out the demo app's code.

How to use your own shape

The CBStoreHouseRefreshControl's shape contains bunch of BarItem for animation, each BarItem is running its own animation, you need to provide startPoint and endPoint through a plist file.

All BarItem will share one coordinate system whose origin is at the top-left corner. For example if you want to draw a square, the plist will look like this:

![screenshot2] (https://s3.amazonaws.com/suyu.test/square.png)

The result will look like this:

![screenshot3] (https://s3.amazonaws.com/suyu.test/square.gif)

Notes:

  • Make sure you put the right key which are startPoints and endPoints.
  • Make sure you are using the right format ({x,y}) for coordinates.
  • The highlight/loading animation will highlight each bar item in the same order you declare them in plist, use reverseLoadingAnimation to reverse the animation.

Easy way to generate startPoint and endPoint?

@isaced mentions that it's easier to use PaintCode to generate startPoint and endPoint:

![screenshot4] (https://cloud.githubusercontent.com/assets/2088605/4948694/0ce2da74-667f-11e4-8ce7-a2067f15558d.png)

Result:

![screenshot5] (https://cloud.githubusercontent.com/assets/2088605/4948707/3b76afb4-667f-11e4-91a4-9509d17356fa.gif)

You can get more info here.

Configuration

Play with following parameters to configure CBStoreHouseRefreshControl's view and animation:

  • Set the bar color with the color parameter
  • Set the bar width with the lineWidth parameter
  • Set the height of control with the dropHeight parameter
  • Set the scale of control with the scale parameter
  • Adjust how disperse the bar items appear/disappear by changing the horizontalRandomness parameter
  • Set if reversing the loading animation with the reverseLoadingAnimation parameter, if set to YES, the last bar item will be highlighted firstly.
  • Adjust the time offset of the appear/disappear animation by changing the internalAnimationFactor parameter, for example if internalAnimationFactor is 1 all bar items will appear/disappear all together.

Who's using it?

We've a wiki page for that, feel free to add your projects there!

Author

Suyu Zhang
suyu_zhang@hotmail.com
suyuzhang.com

License

Copyright (c) 2014 Suyu Zhang suyu_zhang@hotmail.com. See the LICENSE file for license rights and limitations (MIT).

About

Fully customizable pull-to-refresh control inspired by Storehouse iOS app

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Repository files navigation

CBStoreHouseRefreshControl License MIT

VersionPlatform

What is it?

A fully customizable pull-to-refresh control for iOS inspired by Storehouse iOS app

![screenshot1] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl1.gif)

You can use any shape through a plist file, like this one:

![screenshot2] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl2.gif)

Which files are needed?

CBStoreHouseRefreshControl is available through CocoaPods, to install it simply add the following line to your Podfile:

pod 'CBStoreHouseRefreshControl'

Alternatively, you can just drag CBStoreHouseRefreshControl (.h .m) and BarItem (.h .m) into your own project.

How to use it

You can attach it to any UIScrollView like UITableView or UICollectionView using following simple static method:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"];

Or, using this method for more configurable options:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist
color:(UIColor *)color
lineWidth:(CGFloat)lineWidth
dropHeight:(CGFloat)dropHeight
scale:(CGFloat)scale
horizontalRandomness:(CGFloat)horizontalRandomness
reverseLoadingAnimation:(BOOL)reverseLoadingAnimation
internalAnimationFactor:(CGFloat)internalAnimationFactor;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"color:[UIColor whiteColor] lineWidth:1.5dropHeight:80scale:1horizontalRandomness:150reverseLoadingAnimation:YESinternalAnimationFactor:0.5];

Then, implement UIScrollViewDelegate in your UIViewController if you haven't already, and pass the calls through to the refresh control:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
[self.storeHouseRefreshControl scrollViewDidScroll];
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
[self.storeHouseRefreshControl scrollViewDidEndDragging];
}

Lastly, make sure you've implemented the refreshAction you passed it earlier to listen for refresh triggers:

- (void)refreshTriggered
{
//call your loading method here//Finshed loading the data, reset the refresh control
[self.storeHouseRefreshControl finishingLoading];
}

For more details, please check out the demo app's code.

How to use your own shape

The CBStoreHouseRefreshControl's shape contains bunch of BarItem for animation, each BarItem is running its own animation, you need to provide startPoint and endPoint through a plist file.

All BarItem will share one coordinate system whose origin is at the top-left corner. For example if you want to draw a square, the plist will look like this:

![screenshot2] (https://s3.amazonaws.com/suyu.test/square.png)

The result will look like this:

![screenshot3] (https://s3.amazonaws.com/suyu.test/square.gif)

Notes:

  • Make sure you put the right key which are startPoints and endPoints.
  • Make sure you are using the right format ({x,y}) for coordinates.
  • The highlight/loading animation will highlight each bar item in the same order you declare them in plist, use reverseLoadingAnimation to reverse the animation.

Easy way to generate startPoint and endPoint?

@isaced mentions that it's easier to use PaintCode to generate startPoint and endPoint:

![screenshot4] (https://cloud.githubusercontent.com/assets/2088605/4948694/0ce2da74-667f-11e4-8ce7-a2067f15558d.png)

Result:

![screenshot5] (https://cloud.githubusercontent.com/assets/2088605/4948707/3b76afb4-667f-11e4-91a4-9509d17356fa.gif)

You can get more info here.

Configuration

Play with following parameters to configure CBStoreHouseRefreshControl's view and animation:

  • Set the bar color with the color parameter
  • Set the bar width with the lineWidth parameter
  • Set the height of control with the dropHeight parameter
  • Set the scale of control with the scale parameter
  • Adjust how disperse the bar items appear/disappear by changing the horizontalRandomness parameter
  • Set if reversing the loading animation with the reverseLoadingAnimation parameter, if set to YES, the last bar item will be highlighted firstly.
  • Adjust the time offset of the appear/disappear animation by changing the internalAnimationFactor parameter, for example if internalAnimationFactor is 1 all bar items will appear/disappear all together.

Who's using it?

We've a wiki page for that, feel free to add your projects there!

Author

Suyu Zhang
suyu_zhang@hotmail.com
suyuzhang.com

License

Copyright (c) 2014 Suyu Zhang suyu_zhang@hotmail.com. See the LICENSE file for license rights and limitations (MIT).

About

Fully customizable pull-to-refresh control inspired by Storehouse iOS app

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Repository files navigation

CBStoreHouseRefreshControl License MIT

VersionPlatform

What is it?

A fully customizable pull-to-refresh control for iOS inspired by Storehouse iOS app

![screenshot1] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl1.gif)

You can use any shape through a plist file, like this one:

![screenshot2] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl2.gif)

Which files are needed?

CBStoreHouseRefreshControl is available through CocoaPods, to install it simply add the following line to your Podfile:

pod 'CBStoreHouseRefreshControl'

Alternatively, you can just drag CBStoreHouseRefreshControl (.h .m) and BarItem (.h .m) into your own project.

How to use it

You can attach it to any UIScrollView like UITableView or UICollectionView using following simple static method:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"];

Or, using this method for more configurable options:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist
color:(UIColor *)color
lineWidth:(CGFloat)lineWidth
dropHeight:(CGFloat)dropHeight
scale:(CGFloat)scale
horizontalRandomness:(CGFloat)horizontalRandomness
reverseLoadingAnimation:(BOOL)reverseLoadingAnimation
internalAnimationFactor:(CGFloat)internalAnimationFactor;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"color:[UIColor whiteColor] lineWidth:1.5dropHeight:80scale:1horizontalRandomness:150reverseLoadingAnimation:YESinternalAnimationFactor:0.5];

Then, implement UIScrollViewDelegate in your UIViewController if you haven't already, and pass the calls through to the refresh control:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
[self.storeHouseRefreshControl scrollViewDidScroll];
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
[self.storeHouseRefreshControl scrollViewDidEndDragging];
}

Lastly, make sure you've implemented the refreshAction you passed it earlier to listen for refresh triggers:

- (void)refreshTriggered
{
//call your loading method here//Finshed loading the data, reset the refresh control
[self.storeHouseRefreshControl finishingLoading];
}

For more details, please check out the demo app's code.

How to use your own shape

The CBStoreHouseRefreshControl's shape contains bunch of BarItem for animation, each BarItem is running its own animation, you need to provide startPoint and endPoint through a plist file.

All BarItem will share one coordinate system whose origin is at the top-left corner. For example if you want to draw a square, the plist will look like this:

![screenshot2] (https://s3.amazonaws.com/suyu.test/square.png)

The result will look like this:

![screenshot3] (https://s3.amazonaws.com/suyu.test/square.gif)

Notes:

  • Make sure you put the right key which are startPoints and endPoints.
  • Make sure you are using the right format ({x,y}) for coordinates.
  • The highlight/loading animation will highlight each bar item in the same order you declare them in plist, use reverseLoadingAnimation to reverse the animation.

Easy way to generate startPoint and endPoint?

@isaced mentions that it's easier to use PaintCode to generate startPoint and endPoint:

![screenshot4] (https://cloud.githubusercontent.com/assets/2088605/4948694/0ce2da74-667f-11e4-8ce7-a2067f15558d.png)

Result:

![screenshot5] (https://cloud.githubusercontent.com/assets/2088605/4948707/3b76afb4-667f-11e4-91a4-9509d17356fa.gif)

You can get more info here.

Configuration

Play with following parameters to configure CBStoreHouseRefreshControl's view and animation:

  • Set the bar color with the color parameter
  • Set the bar width with the lineWidth parameter
  • Set the height of control with the dropHeight parameter
  • Set the scale of control with the scale parameter
  • Adjust how disperse the bar items appear/disappear by changing the horizontalRandomness parameter
  • Set if reversing the loading animation with the reverseLoadingAnimation parameter, if set to YES, the last bar item will be highlighted firstly.
  • Adjust the time offset of the appear/disappear animation by changing the internalAnimationFactor parameter, for example if internalAnimationFactor is 1 all bar items will appear/disappear all together.

Who's using it?

We've a wiki page for that, feel free to add your projects there!

Author

Suyu Zhang
suyu_zhang@hotmail.com
suyuzhang.com

License

Copyright (c) 2014 Suyu Zhang suyu_zhang@hotmail.com. See the LICENSE file for license rights and limitations (MIT).

About

Fully customizable pull-to-refresh control inspired by Storehouse iOS app

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content

Repository files navigation

CBStoreHouseRefreshControl License MIT

VersionPlatform

What is it?

A fully customizable pull-to-refresh control for iOS inspired by Storehouse iOS app

![screenshot1] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl1.gif)

You can use any shape through a plist file, like this one:

![screenshot2] (https://s3.amazonaws.com/suyu.test/CBStoreHouseRefreshControl2.gif)

Which files are needed?

CBStoreHouseRefreshControl is available through CocoaPods, to install it simply add the following line to your Podfile:

pod 'CBStoreHouseRefreshControl'

Alternatively, you can just drag CBStoreHouseRefreshControl (.h .m) and BarItem (.h .m) into your own project.

How to use it

You can attach it to any UIScrollView like UITableView or UICollectionView using following simple static method:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"];

Or, using this method for more configurable options:

+ (CBStoreHouseRefreshControl*)attachToScrollView:(UIScrollView *)scrollView
target:(id)target
refreshAction:(SEL)refreshAction
plist:(NSString *)plist
color:(UIColor *)color
lineWidth:(CGFloat)lineWidth
dropHeight:(CGFloat)dropHeight
scale:(CGFloat)scale
horizontalRandomness:(CGFloat)horizontalRandomness
reverseLoadingAnimation:(BOOL)reverseLoadingAnimation
internalAnimationFactor:(CGFloat)internalAnimationFactor;
self.storeHouseRefreshControl = [CBStoreHouseRefreshControl attachToScrollView:self.tableView target:selfrefreshAction:@selector(refreshTriggered:) plist:@"storehouse"color:[UIColor whiteColor] lineWidth:1.5dropHeight:80scale:1horizontalRandomness:150reverseLoadingAnimation:YESinternalAnimationFactor:0.5];

Then, implement UIScrollViewDelegate in your UIViewController if you haven't already, and pass the calls through to the refresh control:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
[self.storeHouseRefreshControl scrollViewDidScroll];
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
[self.storeHouseRefreshControl scrollViewDidEndDragging];
}

Lastly, make sure you've implemented the refreshAction you passed it earlier to listen for refresh triggers:

- (void)refreshTriggered
{
//call your loading method here//Finshed loading the data, reset the refresh control
[self.storeHouseRefreshControl finishingLoading];
}

For more details, please check out the demo app's code.

How to use your own shape

The CBStoreHouseRefreshControl's shape contains bunch of BarItem for animation, each BarItem is running its own animation, you need to provide startPoint and endPoint through a plist file.

All BarItem will share one coordinate system whose origin is at the top-left corner. For example if you want to draw a square, the plist will look like this:

![screenshot2] (https://s3.amazonaws.com/suyu.test/square.png)

The result will look like this:

![screenshot3] (https://s3.amazonaws.com/suyu.test/square.gif)

Notes:

  • Make sure you put the right key which are startPoints and endPoints.
  • Make sure you are using the right format ({x,y}) for coordinates.
  • The highlight/loading animation will highlight each bar item in the same order you declare them in plist, use reverseLoadingAnimation to reverse the animation.

Easy way to generate startPoint and endPoint?

@isaced mentions that it's easier to use PaintCode to generate startPoint and endPoint:

![screenshot4] (https://cloud.githubusercontent.com/assets/2088605/4948694/0ce2da74-667f-11e4-8ce7-a2067f15558d.png)

Result:

![screenshot5] (https://cloud.githubusercontent.com/assets/2088605/4948707/3b76afb4-667f-11e4-91a4-9509d17356fa.gif)

You can get more info here.

Configuration

Play with following parameters to configure CBStoreHouseRefreshControl's view and animation:

  • Set the bar color with the color parameter
  • Set the bar width with the lineWidth parameter
  • Set the height of control with the dropHeight parameter
  • Set the scale of control with the scale parameter
  • Adjust how disperse the bar items appear/disappear by changing the horizontalRandomness parameter
  • Set if reversing the loading animation with the reverseLoadingAnimation parameter, if set to YES, the last bar item will be highlighted firstly.
  • Adjust the time offset of the appear/disappear animation by changing the internalAnimationFactor parameter, for example if internalAnimationFactor is 1 all bar items will appear/disappear all together.

Who's using it?

We've a wiki page for that, feel free to add your projects there!

Author

Suyu Zhang
suyu_zhang@hotmail.com
suyuzhang.com

License

Copyright (c) 2014 Suyu Zhang suyu_zhang@hotmail.com. See the LICENSE file for license rights and limitations (MIT).

About

Fully customizable pull-to-refresh control inspired by Storehouse iOS app

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages