Skip to content

Fix adjacent views polishing #1289

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 14 commits into
base: master
Choose a base branch
from
Open

Fix adjacent views polishing #1289

Changes from 1 commit
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
38da28b
fix-adjacent-views
AdityaPahilwani Jun 22, 2021
0b1a4db
Loop jumping fixed
AdityaPahilwani Jun 24, 2021
33086fe
Fixed blank jumps and index changes
AdityaPahilwani Jun 26, 2021
fbef115
Near to perfect
AdityaPahilwani Jun 27, 2021
ac1f6b2
Fix to get proper index value
AdityaPahilwani Jun 28, 2021
c948a76
loadMinimalSize fixes
AdityaPahilwani Jun 29, 2021
f8a0667
loop shuffle and button placement fix
AdityaPahilwani Jul 1, 2021
435c0c5
Moving declarationRate to constant
AdityaPahilwani Jul 2, 2021
43d3ba3
adjacent views for vertical slider added
AdityaPahilwani Jul 4, 2021
c0ad7f6
Added examples for adjacent views
AdityaPahilwani Jul 4, 2021
89fc9e3
Moved decelerationRate to props
AdityaPahilwani Jul 4, 2021
6ff80d6
Adjacent views are polished
AdityaPahilwani Jul 4, 2021
57a8189
Changed some naming conventions
AdityaPahilwani Jul 5, 2021
d99ede8
Fix mount offset issue
AdityaPahilwani Jul 13, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
loadMinimalSize fixes
  • Loading branch information
@AdityaPahilwani
AdityaPahilwani committed Jun 29, 2021
commit c948a767fdda33d2504047dbc76669b88da62aaa
22 changes: 11 additions & 11 deletions src/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -551,7 +551,7 @@ export default class extends Component {
// If swiping hard to from orignal 0 element user might end up seeing first duplicate element,
// which is actually second last element of array so we manually scroll to particular that element
// otherwise we will scroll to 0 element
if (offset[dir] < 0) {
if (offset[dir] <= 0) {
index = total - 2;
offset[dir] = step * total;
loopJump = true;
Expand All @@ -570,7 +570,7 @@ export default class extends Component {
// If swiping hard to from orignal last element user might end up seeing last duplicate element,
// which is actually second element of array so we manually scroll to particular that element
// otherwise we will scroll to last element
if (offset[dir] >= totalOffsetScreen + width) {
if (offset[dir] > totalOffsetScreen + width) {
index = 1;
offset[dir] = step * 3 - diffOffset;
loopJump = true;
Expand Down Expand Up @@ -902,7 +902,7 @@ export default class extends Component {
} = this.props
// let dir = state.dir
// let key = 0
const loopVal = loop ? 1 : 0
const loopVal = loop ? 2 : 0
let pages = []
let paddingHorizontal = showAdjacentViews ? adjacentViewsPadding : 0;

Expand Down Expand Up @@ -935,14 +935,14 @@ export default class extends Component {
if (
(i >= index + loopVal - loadMinimalSize &&
i <= index + loopVal + loadMinimalSize) ||
// We make sure our duplicate elements which are added in
// start and end of swiper are always visible along with real first and last element
(loop && i === 0) ||
(loop && i === 1) ||
(loop && i === 2) ||
(loop && i === pages.length - 1) ||
(loop && i === pages.length - 2) ||
(loop && i === pages.length - 3)
// when at 0 index we will force render the real last element and first duplicate element of end list so we don't see any blank jumps when looping,
// also when we are at last index value, we will force render the real first element and first duplicate element of start list so we don't see any blank jumps when looping.
// this approach will give less re-renders and we can lazy load more elements
(loop && i === pages.length - 3 && index === 0) ||
(loop && i === pages.length - 2 && index === 0) ||
(loop && i === 2 && index === total - 1) ||
(loop && i === 1 && index === total - 1) ||
(loop && i === 1 && index === 0)
) {
return (
<View style={pageStyle} key={i}>
Expand Down