Comments (5)
The gif only shows 3 items. I wonder how it will work if there're more than 3 in the list.
from animatedcollectionviewlayout.
I think this kind of thing is possible with custom animation layouts but I haven't had a lot of luck with controlling the z-axis for overlapping.
from animatedcollectionviewlayout.
Hey guys, to be honest, I copied the gif from Gravity Slider. This library is good but not useful.. In gravity slider, you can't set index programmatically and you can't find current index.. And if you change cell size, animation going worse. So if you can add a new animation type like gif, it will be perfect.. if not I will use "LinearCard" animation :)
from animatedcollectionviewlayout.
@invisible66
you can't set index programmatically and you can't find current index
I don't really understand what this means sorry.
Give the following animator a try and let me know how you like it. Play around with these parameters as well to make sure the animation works best for your scenario.
import Foundation
public struct SwapOutAttributesAnimator: LayoutAttributesAnimator {
private let maxWidthRadio: CGFloat
private let minDistanceRadio: CGFloat
private let scaleRate: CGFloat
public init(maxWidthRadio: CGFloat = 0.7, minDistanceRadio: CGFloat = 0.5, scaleRate: CGFloat = 0.5) {
self.maxWidthRadio = maxWidthRadio
self.minDistanceRadio = minDistanceRadio
self.scaleRate = scaleRate
}
public func animate(collectionView: UICollectionView, attributes: AnimatedCollectionViewLayoutAttributes) {
let position = attributes.middleOffset
// guard let contentView = attributes.contentView else { return }
let contentOffset = collectionView.contentOffset
let period = CGFloat.pi - asin(minDistanceRadio / maxWidthRadio)
attributes.frame = CGRect(origin: contentOffset, size: attributes.frame.size)
switch Double(position) {
case -2.0...2.0:
let offsetFromCenter = CGFloat(sin(period * position))
let translationTransform: CGAffineTransform
if attributes.scrollDirection == .horizontal {
let offset = offsetFromCenter * maxWidthRadio * collectionView.bounds.width
translationTransform = CGAffineTransform(translationX: offset, y: 0)
} else {
let offset = offsetFromCenter * maxWidthRadio * collectionView.bounds.height
translationTransform = CGAffineTransform(translationX: 0, y: offset)
}
let scaleFactor = max(scaleRate - 0.2 * abs(position), 0.0)
let scaleTransform = CGAffineTransform(scaleX: scaleFactor, y: scaleFactor)
attributes.transform = translationTransform.concatenating(scaleTransform)
let zIndex = -pow(abs(position), 2.0) + 1.0
attributes.zIndex = Int(zIndex * 1000)
attributes.alpha = 1
default:
attributes.alpha = 0
}
}
}
from animatedcollectionviewlayout.
you can't set index programmatically and you can't find current index
I don't really understand what this means sorry.
Gravity Slider library using UICollectionView
. If you want to change item in code, you can't do this. Sorry for my bad English :)
Edit : SwapOutAttributesAnimator
is perfect :) Thank you so much..
from animatedcollectionviewlayout.
Related Issues (20)
- How to make parallax cell not effect text? HOT 3
- How to adjust collectionView Cell size appropriately when in landscape? HOT 6
- Hello, I would like to ask how to write the following layout.
- The cell is set to the screen width, and the current cell position is constantly shifted
- RotateInOut - Cells are not vertical @ center
- CubeAttributesAnimator screen display is strange. HOT 8
- Blinking parallax on iPhone 8 plus HOT 2
- RTL Support HOT 1
- Layout wrong on iOS 10
- Is it possible with infinite scrolling?
- Scroll by button tap HOT 1
- iOS 14 break CubeLayout HOT 9
- Having trouble with Cube Animator w/ programmatic cells HOT 10
- Cell scroll with scrollToItem does not work HOT 4
- index path is not corrrect.
- On vertical scroll with sections, unexpected behaviour. Cells appear in front of others
- CrossFade Animation alpha is not changed to 1.0
- Importing this library has no effect
- Automatic page jumping would be better
- CubeAttributesAnimator Bug
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from animatedcollectionviewlayout.