mayqiyue / Ocskeleton
Licence: mit
[OCSkeleton] - Make your loading view a little difference.
Stars: ✭ 184
Projects that are alternatives of or similar to Ocskeleton
Rhplaceholder
Show pleasant loading view for your users 😍
Stars: ✭ 238 (+29.35%)
Mutual labels: loader, placeholder, gradient, loading-animations
Skeleton
💀 An easy way to create sliding CAGradientLayer animations! Works great for creating skeleton screens for loading content.
Stars: ✭ 587 (+219.02%)
Mutual labels: skeleton, loader, loading-animations
Skeletonview
☠️ An elegant way to show users that something is happening and also prepare them to which contents they are awaiting
Stars: ✭ 10,804 (+5771.74%)
Mutual labels: skeleton, placeholder, loading-animations
Skeleton Elements
Skeleton elements - UI for improved perceived performance
Stars: ✭ 27 (-85.33%)
Mutual labels: skeleton, loader, placeholder
Tabanimated
A skeleton screen framework based on native for iOS. (一个由iOS原生组件映射出骨架屏的框架，包含快速植入，低耦合，兼容复杂视图等特点，提供国内主流骨架屏动画的加载方案，同时支持上拉加载更多、自定制动画。)
Stars: ✭ 2,909 (+1480.98%)
Mutual labels: skeleton, placeholder, loading-animations
Skeletonui
☠️ Elegant skeleton loading animation in SwiftUI and Combine
Stars: ✭ 275 (+49.46%)
Mutual labels: skeleton, placeholder, gradient
Vue Content Loading
Vue component to easily build (or use presets) SVG loading cards Facebook like.
Stars: ✭ 729 (+296.2%)
Mutual labels: skeleton, placeholder, loading-animations
Ngx Skeleton Loader
Make beautiful, animated loading skeletons that automatically adapt to your Angular apps
Stars: ✭ 278 (+51.09%)
Mutual labels: skeleton, loader, loading-animations
React Content Loader
⚪ SVG-Powered component to easily create skeleton loadings.
Stars: ✭ 11,830 (+6329.35%)
Mutual labels: skeleton, loader, placeholder
React Native Shimmer Placeholder
Placeholder/ Skeleton of React Native
Stars: ✭ 679 (+269.02%)
Mutual labels: skeleton, placeholder
Whirl
CSS loading animations with minimal effort!
Stars: ✭ 774 (+320.65%)
Mutual labels: loader, loading-animations
React Native Loading Placeholder
React Native Loading Placeholder
Stars: ✭ 176 (-4.35%)
Mutual labels: loader, placeholder
Ybhud
A simple Hud with DGActivityIndicatorView
Stars: ✭ 81 (-55.98%)
Mutual labels: loader, loading-animations
Gradientloadingbar
⌛️A customizable animated gradient loading bar.
Stars: ✭ 569 (+209.24%)
Mutual labels: gradient, loading-animations
Shimmerlayout
Memory efficient, simple yet highly customizable shimmer effect for Android.
Stars: ✭ 81 (-55.98%)
Mutual labels: placeholder, loading-animations
Waitme
jquery plugin for easy creating loading css3/images animations
Stars: ✭ 302 (+64.13%)
Mutual labels: loader, loading-animations
React Shimmer
🌠 Async loading, performant Image component for React.js
Stars: ✭ 990 (+438.04%)
Mutual labels: loader, placeholder
React Native Skeleton Content Nonexpo
A customizable skeleton-like loading placeholder for react native projects not using expo.
Stars: ✭ 92 (-50%)
Mutual labels: skeleton, loader
Vue Content Placeholders
Composable components for rendering fake (progressive) content like facebook in vue
Stars: ✭ 1,547 (+740.76%)
Mutual labels: skeleton, loader
The library is inspired by Skeleton
👩💻 Usage
import the OCSkeleton: #import <OCSkeleton.h>
You can use the OCGradientLayer directly:
@interface OCGradientLayer : CAGradientLayer
- (void)slideToDir:(OCDirection)direction animations:(void (^)(CAAnimationGroup *))group;
- (void)stopSliding;
@end
Or you can use the OCGradientContainerView to intergate with autolayout:
- Make your view confrom to OCGradientsOwner protocol
- Use the API
@interface UIView (OCGradientsOwner)
- (void)slideToDir:(OCDirection)direction animations:(void (^)(CAAnimationGroup *))group;
- (void)stopSliding;
@end
Check out the example for more.
📚 Example
To run the example project, clone the repo, and run pod install from the Example directory first.
🛠 Installation
OCSkeleton is available through CocoaPods. To install it, simply add the following line to your Podfile:
pod 'OCSkeleton'
Author
mayqiyue, [email protected]
License
OCSkeleton is available under the MIT license. See the LICENSE file for more info.
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].