Giter Site home page Giter Site logo

trendingtechnology / tabanimated Goto Github PK

View Code? Open in Web Editor NEW

This project forked from tigerandbull/tabanimated

0.0 2.0 0.0 4.19 MB

A skeleton screen framework based on native for iOS. (原生骨架屏,网络加载过渡动画)

License: MIT License

Objective-C 99.49% Ruby 0.51%

tabanimated's Introduction

如果你此时看到这里你必须要知道, 将在五一期间发布一个比较重要的版本,合并当前两大模式。

the lastest version is 2.0.3.2 中文文档

About TABAnimated

The origin of TABAnimated by imitating jianshu animation in chinese palform early, i was attracted by its dynamics in Mid 2018. But i remove it over version 2.0, because i changed the realization principle of TABAnimated to cut coupling.

Realization Principle

TABAnimated needs a control view, the view used to start or end animations. all subviews onto the control view added to the animation queue acquiescently. Of course, you can remove specific views without the animation queue. TABAnimated create a group of TABLayer according to their position. (TABLayer is the subclass of CALayer.)

Almost all views can be resolved by TABAnimated.

When views have not enough condition to know position with none data, TABAnimated can use default data to fill them up.

TABAnimated has two patterns

Which two kinds?

Nomal pattern and template pattern.

Why?

First, for a normal view, there is no distinction between patterns. you do not care it. The concept of the template pattern is for tableView and collectionView only.

In most cases, if TABAnimated create animations by origin views' position, the animation is not beautiful, but you just need to make the right adjustments to look good by TABAnimated. so, if you don't care coupling in your project, you can use normal pattern. If you care coupling, you can use normal pattern. Meanwhile, you need create a new template file.

Features

  • Use three seconds to integrate it
  • Zero coupling
  • High Performance
  • All views you can see
  • Fully customized
  • Code is beautiful

Install

Using CocoaPods

pod 'TABAnimated'

Manually

Drag the folder named by TABAnimated to your project

Effect Drawing

Template - card Template - bin Template - shimmer Template - segment Normal - skeleton

How to use

you need only 4 steps

  1. import 'TABAnimated.h', advise you to set it on .pch
  2. init TABAimated on didFinishLaunchingWithOptions
// init `TABAnimated`, and set the properties you need.
[[TABViewAnimated sharedAnimated] initWithOnlySkeleton];
// demo changes the pattern quietly.
// you can change the pattern in different views.
[TABViewAnimated sharedAnimated].isUseTemplate = YES;
// open log
[TABViewAnimated sharedAnimated].openLog = YES;
// set gobal cornerRadius
[TABViewAnimated sharedAnimated].animatedCornerRadius = 3.f;
  1. [self.rootControlView tab_startAnimation];
  2. [self.rootControlView tab_endAnimation];

But evevryone have different views, TABAnimated used to solve the problem better.

Use Template Pattern

Template pattern on UITableView and UICollectionView only. Normal view looks like a superfluous move when useing template pattern.

1.set TABAnimatedObject properties

_collectionView.tabAnimated = [TABAnimatedObject animatedWithTemplateClass:[TABTemplateCollectionViewCell class] animatedCount:4];

TABAnimatedObject init methods

/**
 one section
 animation count full contentSize
 
 @param templateClass
 @return TABAnimatedObject.new
 */
+ (instancetype)animatedWithTemplateClass:(Class)templateClass;

/**
 one section
 specific animation count
 
 @param templateClass TABAnimatedObject.new
 @param animatedCount
 @return object
 */
+ (instancetype)animatedWithTemplateClass:(Class)templateClass
                            animatedCount:(NSInteger)animatedCount;

/**
 sections

 @param templateClassArray
 @param animatedCountArray
 @return object
 */
+ (instancetype)animatedWithTemplateClassArray:(NSArray <Class> *)templateClassArray
                            animatedCountArray:(NSArray <NSNumber *> *)animatedCountArray;

the array has security handling:

when animatedCountArray.count > section.count,the extra on animatedCountArray is not effective. when animatedCountArray.count < section.count,the financial departments load by animatedCountArray.lastobject.

  1. create template

UITableViewCell

  • create new cell,inherit TABBaseTableViewCell
  • override + (NSNumber *)cellHeight to set cellHeight
  • init subviews on it,and set positions

UICollectionViewCell

  • create new cell,inherit 继承自TABBaseCollectionViewCell
  • override + (NSValue *)cellSize to set cellSize
  • init subviews on it,and set positions
  1. [self.collectionView tab_startAnimation];
  2. [self.collectionView tab_endAnimation];
tips: TABAnimatedObject have more properties, you can find them on TABAnimatedObject.h.

Use Normal Pattern

  1. set properties
TABAnimatedObject *tabAnimated = TABAnimatedObject.new;
tabAnimated.animatedCount = 3;
_tableView.tabAnimated = tabAnimated;
  1. use loadStyle - TABViewLoadAnimationRemove, cancel add
UILabel *lab = [[UILabel alloc]init];
[lab setFont:tab_kFont(15)];
lab.loadStyle = TABViewLoadAnimationRemove;   // remove it
[lab setTextColor:[UIColor blackColor]];    
self.titleLab = lab;
[self.contentView addSubview:lab];
  1. [self.collectionView tab_startAnimation];
  2. [self.collectionView tab_endAnimation];

Tips

when using on normal pattern

  1. specificing when having none data.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    
    static NSString *str = @"TestTableViewCell";
    TestTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:str];
    if (!cell) {
        cell = [[TestTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:str];
        cell.selectionStyle = UITableViewCellSelectionStyleNone;
    }
    
    if (!_tableView.tabAnimated.isAnimating) {
        [cell initWithData:dataArray[indexPath.row]];
    }

    return cell;
}
  1. same as 1, you can also do by the following method.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    
    static NSString *str = @"TestTableViewCell";
    TestTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:str];
    if (!cell) {
        cell = [[TestTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:str];
        cell.selectionStyle = UITableViewCellSelectionStyleNone;
    }
    return cell;
}

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    TestTableViewCell *myCell = (TestTableViewCell *)cell;
    [myCell initWithData:dataArray[indexPath.row]];
}
  1. set animatedDelegate or set animatedCountArray

(1) UITableViewAnimatedDelegate and UICollectionViewAnimatedDelegate

_mainTV.animatedDelegate = self;
- (NSInteger)tableView:(UITableView *)tableView numberOfAnimatedRowsInSection:(NSInteger)section {
    if (section == 0) {
        return 5;
    }
    return 3;
}

(2) self.tableView.tabAnimated.animatedCountArray = @[@(3),@(3)];

  1. nest about tableView or collectionView
_collectionView.tabAnimated.isNest = YES;

More Global Properties

init methods name
initWithOnlySkeleton only Skeleton
initWithBinAnimation bin Animation
initWithShimmerAnimated Shimmer Animation

If you set the control view superAnimationType, the animation type of the control view according to superAnimationType.

name pattern animation default
animatedColor common common 0xEEEEEE
animatedDurationShimmer common shimmer animation 1.5
animatedHeightCoefficient common common 0.75
animatedCornerRadius common common 0.
templateTableViewCell pattern common 0.
templateCollectionViewCell pattern common 0.

Author

email:[email protected]

Hope

Demo is just a simple example I wrote, you can use the framework to play a more attractive effect. It has gone through many projects. This framework can solve all the problems in your project, conquer it quickly!

If you have any questions or suggestions, you can contact me by email. I'm looking forward to it. Surely, you can also push your code to me on this.

License

MIT License

Copyright (c) 2017 Juanpe Catalán

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

tabanimated's People

Contributors

tigerandbull avatar

Watchers

 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.