Skip to content

feat: Add Android support for progress-view #58

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.

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

Merged
merged 6 commits into from
Apr 18, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
24 changes: 12 additions & 12 deletions .flowconfig
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,12 @@
.*/*[.]android.js
.*/*[.]windows.js

; Ignore "BUCK" generated dirs
<PROJECT_ROOT>/\.buckd/

; Ignore polyfills
node_modules/react-native/Libraries/polyfills/.*

; These should not be required directly
; require from fbjs/lib instead: require('fbjs/lib/warning')
.*/node_modules/warning/.*
Expand All @@ -19,8 +25,8 @@
.*/node_modules/.*

[libs]
interface.js
flow/
node_modules/react-native/interface.js
node_modules/react-native/flow/

[options]
emoji=true
Expand All @@ -36,19 +42,15 @@ module.file_ext=.ios.js

munge_underscores=true

module.name_mapper='^react-native$' -> '<PROJECT_ROOT>/node_modules/react-native/Libraries/react-native/react-native-implementation'
module.name_mapper='^react-native/\(.*\)$' -> '<PROJECT_ROOT>/node_modules/react-native/\1'
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '<PROJECT_ROOT>/node_modules/react-native/Libraries/Image/RelativeImageStub'
module.name_mapper='^react-native/\(.*\)$' -> '<PROJECT_ROOT>/node_modules/react-native/\1'
module.name_mapper='^@?[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '<PROJECT_ROOT>/node_modules/react-native/Libraries/Image/RelativeImageStub'

suppress_type=$FlowIssue
suppress_type=$FlowFixMe
suppress_type=$FlowFixMeProps
suppress_type=$FlowFixMeState
suppress_type=$FlowFixMeEmpty

experimental.well_formed_exports=true
experimental.types_first=true
experimental.abstract_locations=true
sharedmemory.heap_size=4000000000

[lints]
sketchy-null-number=warn
Expand All @@ -60,8 +62,6 @@ deprecated-type=warn
unsafe-getters-setters=warn
unnecessary-invariant=warn
signature-verification-failure=warn
deprecated-utility=error
unsafe-addition=error

[strict]
deprecated-type
Expand All @@ -73,4 +73,4 @@ untyped-import
untyped-type-import

[version]
^0.127.0
^0.137.0
10 changes: 5 additions & 5 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ jobs:
runs-on: ubuntu-18.04
strategy:
matrix:
node-version: [10]
node-version: [12]
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
Expand All @@ -27,7 +27,7 @@ jobs:
runs-on: ubuntu-18.04
strategy:
matrix:
node-version: [10]
node-version: [12]
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
Expand All @@ -48,7 +48,7 @@ jobs:
runs-on: ubuntu-18.04
strategy:
matrix:
node-version: [10]
node-version: [12]
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
Expand All @@ -69,7 +69,7 @@ jobs:
runs-on: ubuntu-18.04
strategy:
matrix:
node-version: [10]
node-version: [12]
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
Expand All @@ -90,7 +90,7 @@ jobs:
runs-on: macos-latest
strategy:
matrix:
node-version: [10]
node-version: [12]
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
Expand Down
8 changes: 4 additions & 4 deletions android/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -12,12 +12,12 @@ buildscript {
apply plugin: 'com.android.library'

android {
compileSdkVersion 28
buildToolsVersion "28.0.3"
compileSdkVersion 30
buildToolsVersion "29.0.3"

defaultConfig {
minSdkVersion 16
targetSdkVersion 28
minSdkVersion 21
targetSdkVersion 30
versionCode 1
versionName "1.0"
}
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
package com.reactnativecommunity.progressview;

import android.content.res.ColorStateList;
import android.widget.ProgressBar;

import androidx.annotation.NonNull;

import com.facebook.react.uimanager.SimpleViewManager;
import com.facebook.react.uimanager.ThemedReactContext;
import com.facebook.react.uimanager.annotations.ReactProp;

public class RNCProgressViewManager extends SimpleViewManager<ProgressBar> {
private static final int MAX_PROGRESS_VALUE = 1000;

@NonNull
@Override
public String getName() {
return "RNCProgressView";
}

@NonNull
@Override
protected ProgressBar createViewInstance(@NonNull ThemedReactContext reactContext) {
ProgressBar bar = new ProgressBar(
reactContext,
null,
android.R.attr.progressBarStyleHorizontal
);
bar.setMax(MAX_PROGRESS_VALUE);
return bar;
}

@ReactProp(name = "progress")
public void setProgress(ProgressBar bar, double progress) {
bar.setProgress((int) (MAX_PROGRESS_VALUE * progress));
}

@ReactProp(name = "progressTintColor", customType = "Color")
public void setProgressTintColor(ProgressBar bar, int color) {
bar.setIndeterminateTintList(ColorStateList.valueOf(color));
bar.setProgressTintList(ColorStateList.valueOf(color));
}

@ReactProp(name = "trackTintColor", customType = "Color")
public void setTrackTintColor(ProgressBar bar, int color) {
bar.setProgressBackgroundTintList(ColorStateList.valueOf(color));
}

@ReactProp(name = "isIndeterminate")
public void setIsIndeterminate(ProgressBar bar, boolean isIndeterminate) {
bar.setIndeterminate(isIndeterminate);
}
}

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,28 +1,25 @@

package com.reactnativecommunity.progressview;

import java.util.Arrays;
import java.util.Collections;
import java.util.List;
import androidx.annotation.NonNull;

import com.facebook.react.ReactPackage;
import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.uimanager.ViewManager;
import com.facebook.react.bridge.JavaScriptModule;

import java.util.Collections;
import java.util.List;

public class RNCProgressViewPackage implements ReactPackage {
@NonNull
@Override
public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
return Arrays.<NativeModule>asList(new RNCProgressViewModule(reactContext));
}

// Deprecated from RN 0.47
public List<Class<? extends JavaScriptModule>> createJSModules() {
return Collections.emptyList();
public List<NativeModule> createNativeModules(@NonNull ReactApplicationContext reactContext) {
return Collections.emptyList();
}

@NonNull
@Override
public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
return Collections.emptyList();
public List<ViewManager> createViewManagers(@NonNull ReactApplicationContext reactContext) {
return Collections.<ViewManager>singletonList(new RNCProgressViewManager());
}
}
}
2 changes: 1 addition & 1 deletion example/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ export class App extends React.Component<Props, State> {
/* $FlowFixMe(>=0.85.0 site=react_native_fb) This comment suppresses an error
* found when Flow v0.85 was deployed. To see the error, delete this comment
* and run Flow. */
getProgress = offset => {
getProgress = (offset) => {
const progress = this.state.progress + offset;
return Math.sin(progress % Math.PI) % 1;
};
Expand Down
2 changes: 1 addition & 1 deletion example/android/app/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -190,6 +190,7 @@ dependencies {

implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"


debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
exclude group:'com.facebook.fbjni'
}
Expand All @@ -210,7 +211,6 @@ dependencies {
} else {
implementation jscFlavor
}

// used for example
implementation project(':progressview')
}
Expand Down
3 changes: 3 additions & 0 deletions example/android/settings.gradle
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
rootProject.name = 'example'
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
include ':app'

include ':progressview'
project(':progressview').projectDir = new File(rootProject.projectDir, '../../android')
42 changes: 13 additions & 29 deletions js/ProgressView.android.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,35 +9,19 @@
'use strict';

import * as React from 'react';
import {Text, View, StyleSheet} from 'react-native';
import {requireNativeComponent} from 'react-native';

class DummyProgressViewIOS extends React.Component {
render() {
return (
<View style={[styles.dummy, this.props.style]}>
<Text style={styles.text}>
ProgressViewIOS is not supported on this platform!
</Text>
</View>
);
}
}
const RNCProgressView = requireNativeComponent('RNCProgressView');

const styles = StyleSheet.create({
dummy: {
width: 120,
height: 20,
backgroundColor: '#ffbcbc',
borderWidth: 1,
borderColor: 'red',
alignItems: 'center',
justifyContent: 'center',
},
text: {
color: '#333333',
margin: 5,
fontSize: 10,
},
});
export default function ProgressView(props) {
const nativeProps = {
testID: props.testID,
progress: props.progress,
progressTintColor: props.progressTintColor,
trackTintColor: props.trackTintColor,
isIndeterminate: props.isIndeterminate,
style: [{height: 20}, props.style],
};

export default DummyProgressViewIOS;
return <RNCProgressView {...nativeProps} />;
}
2 changes: 1 addition & 1 deletion js/ProgressView.ios.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ import {StyleSheet} from 'react-native';
import RNCProgressViewNativeComponent from './RNCProgressViewNativeComponent';

import type {ImageSource} from 'react-native/Libraries/Image/ImageSource';
import type {ColorValue} from 'react-native/Libraries/StyleSheet/StyleSheetTypes';
import type {ColorValue} from 'react-native/Libraries/StyleSheet/StyleSheet';
import type {ViewProps} from 'react-native/Libraries/Components/View/ViewPropTypes';

type Props = $ReadOnly<{|
Expand Down
2 changes: 1 addition & 1 deletion js/ProgressView.macos.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ import {StyleSheet} from 'react-native';

import RNCProgressViewNativeComponent from './RNCProgressViewNativeComponent';
import type {ImageSource} from 'react-native/Libraries/Image/ImageSource';
import type {ColorValue} from 'react-native/Libraries/StyleSheet/StyleSheetTypes';
import type {ColorValue} from 'react-native/Libraries/StyleSheet/StyleSheet';
import type {ViewProps} from 'react-native/Libraries/Components/View/ViewPropTypes';

type Props = $ReadOnly<{|
Expand Down
2 changes: 1 addition & 1 deletion js/RNCProgressViewNativeComponent.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import {requireNativeComponent} from 'react-native';

import type {HostComponent} from 'react-native/Libraries/Renderer/shims/ReactNativeTypes';
import type {ImageSource} from 'react-native/Libraries/Image/ImageSource';
import type {ColorValue} from 'react-native/Libraries/StyleSheet/StyleSheetTypes';
import type {ColorValue} from 'react-native/Libraries/StyleSheet/StyleSheet';
import type {ViewProps} from 'react-native/Libraries/Components/View/ViewPropTypes';

type NativeProps = $ReadOnly<{|
Expand Down
2 changes: 1 addition & 1 deletion metro.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
* @format
*/

module.exports = {
module.exports = {
transformer: {
getTransformOptions: async () => ({
transform: {
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@
"babel-jest": "^26.6.3",
"babel-plugin-module-resolver": "^3.2.0",
"eslint": "^7.14.0",
"flow-bin": "^0.127.0",
"flow-bin": "0.137.0",
"jest": "^26.6.3",
"metro-react-native-babel-preset": "^0.64.0",
"react": "17.0.1",
Expand Down
1 change: 1 addition & 0 deletions tsconfig.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
"jsx": "react" /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */,
/* Strict Type-Checking Options */
"strict": true /* Enable all strict type-checking options. */,
"skipLibCheck": true,
"esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
}
}
8 changes: 4 additions & 4 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -5387,10 +5387,10 @@ flatted@^2.0.0:
resolved "https://registry.yarnpkg.com/flatted/-/flatted-2.0.2.tgz#4575b21e2bcee7434aa9be662f4b7b5f9c2b5138"
integrity sha512-r5wGx7YeOwNWNlCA0wQ86zKyDLMQr+/RB8xy74M4hTphfmjlijTSSXGuH8rnvKZnfT9i+75zmd8jcKdMR4O6jA==

flow-bin@^0.127.0:
version "0.127.0"
resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.127.0.tgz#0614cff4c1b783beef1feeb7108d536e09d77632"
integrity sha512-ywvCCdV4NJWzrqjFrMU5tAiVGyBiXjsJQ1+/kj8thXyX15V17x8BFvNwoAH97NrUU8T1HzmFBjLzWc0l2319qg==
flow-bin@0.137.0:
version "0.137.0"
resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.137.0.tgz#322a15b3744195af1e02bf1fec0a716296aee7d5"
integrity sha512-ytwUn68fPKK/VWVpCxJ4KNeNIjCC/uX0Ll6Z1E98sOXfMknB000WtgQjKYDdO6tOR8mvXBE0adzjgCrChVympw==

flow-parser@0.*:
version "0.149.0"
Expand Down