Skip to content

Commit

Permalink
added in snapAlignment for horizontal android scrollView
Browse files Browse the repository at this point in the history
Summary:
<!--
  Required: Write your motivation here.
  If this PR fixes an issue, type "Fixes #issueNumber" to automatically close the issue when the PR is merged.
-->
`snapToAlignment` is available on iOS but not android yet. This PR is to add support for `snapToAlignment` on android as `snapToInterval` was recently added to android and they are very useful together.

Make a `Flatlist` in android with `pagingEnabled`, `horizontal`, `snapToInterval` and `snapToAlignment` set and see how adjusting between the three values of `snapToAlignment` aligns just like it does in iOS.

<!--
  Required.
  Help reviewers and the release process by writing your own release notes. See below for an example.
-->

[ANDROID] [MINOR] [ScrollView] - On Android, **ScrollView** now takes snapToAlignment like iOS

<!--
  **INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.**

    CATEGORY
  [----------]      TYPE
  [ CLI      ] [-------------]    LOCATION
  [ DOCS     ] [ BREAKING    ] [-------------]
  [ GENERAL  ] [ BUGFIX      ] [ {Component} ]
  [ INTERNAL ] [ ENHANCEMENT ] [ {Filename}  ]
  [ IOS      ] [ FEATURE     ] [ {Directory} ]   |-----------|
  [ ANDROID  ] [ MINOR       ] [ {Framework} ] - | {Message} |
  [----------] [-------------] [-------------]   |-----------|

 EXAMPLES:

 [IOS] [BREAKING] [FlatList] - Change a thing that breaks other things
 [ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput
 [CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with
 [DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word
 [GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position
 [INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see
-->
Closes facebook#18648

Differential Revision: D7473762

Pulled By: mdvacca

fbshipit-source-id: ad4778b83f9fd1352455b2ed28a5f37229d9d8c7
  • Loading branch information
philvasseur authored and facebook-github-bot committed Apr 5, 2018
1 parent 490f22a commit 3ed076b
Show file tree
Hide file tree
Showing 2 changed files with 25 additions and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,7 @@ public class ReactHorizontalScrollView extends HorizontalScrollView implements
private @Nullable Drawable mEndBackground;
private int mEndFillColor = Color.TRANSPARENT;
private int mSnapInterval = 0;
private String mSnapAlignment = "start";
private ReactViewBackgroundManager mReactBackgroundManager;

public ReactHorizontalScrollView(Context context) {
Expand Down Expand Up @@ -96,6 +97,13 @@ public void setPagingEnabled(boolean pagingEnabled) {

public void setSnapInterval(int snapInterval) {
mSnapInterval = snapInterval;
if(snapInterval != 0) {
mPagingEnabled = true;
}
}

public void setSnapAlignment(String snapAlignment) {
mSnapAlignment = snapAlignment;
}

public void flashScrollIndicators() {
Expand Down Expand Up @@ -236,6 +244,17 @@ private int getSnapInterval() {
return getWidth();
}

private int getAlignmentOffset() {
int width = getWidth();
int snapInterval = getSnapInterval();
if (mSnapAlignment.equals("center")) {
return (width - snapInterval)/2;
} else if(mSnapAlignment.equals("end")) {
return (width - snapInterval);
}
return 0;
}

public void setEndFillColor(int color) {
if (color != mEndFillColor) {
mEndFillColor = color;
Expand Down Expand Up @@ -349,7 +368,7 @@ private void smoothScrollToPage(int velocity) {
if (predictedX > page * width + width / 2) {
page = page + 1;
}
smoothScrollTo(page * width, getScrollY());
smoothScrollTo(page * width - getAlignmentOffset(), getScrollY());
}

@Override
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,11 @@ public void setSnapToInterval(ReactHorizontalScrollView view, float snapToInterv
view.setSnapInterval((int) (snapToInterval * screenDisplayMetrics.density));
}

@ReactProp(name = "snapToAlignment")
public void setSnapToAlignment(ReactHorizontalScrollView view, String snapToAlignment) {
view.setSnapAlignment(snapToAlignment);
}

@ReactProp(name = ReactClippingViewGroupHelper.PROP_REMOVE_CLIPPED_SUBVIEWS)
public void setRemoveClippedSubviews(ReactHorizontalScrollView view, boolean removeClippedSubviews) {
view.setRemoveClippedSubviews(removeClippedSubviews);
Expand Down

0 comments on commit 3ed076b

Please sign in to comment.