status-im
/
react-native-linear-gradient
mirror of https://github.com/status-im/react-native-linear-gradient.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge pull request #75 from andreialecu/patch-1 

Fix per corner border radius on android.
This commit is contained in:
Dmitry Gladkov 2016-04-20 18:19:56 +03:00
parent 895cb02d31 5cbf3ab137
commit abc05f8d4e
3 changed files with 30 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
android/src/main/java/com/BV/LinearGradient/LinearGradientManager.java
View File

@ -15,7 +15,7 @@ public class LinearGradientManager extends SimpleViewManager<LinearGradientView>
public static final String PROP_LOCATIONS = "locations";
public static final String PROP_START_POS = "start";
public static final String PROP_END_POS = "end";
public static final String PROP_BORDER_RADIUS = "borderRadius";
public static final String PROP_BORDER_RADII = "borderRadii";
@Override
public String getName() {
@ -49,8 +49,8 @@ public class LinearGradientManager extends SimpleViewManager<LinearGradientView>
// temporary solution until following issue is resolved:
// https://github.com/facebook/react-native/issues/3198
@ReactProp(name=PROP_BORDER_RADIUS, defaultFloat = 0f)
public void setBorderRadius(LinearGradientView gradientView, float borderRadius) {
gradientView.setBorderRadius(PixelUtil.toPixelFromDIP(borderRadius));
@ReactProp(name=PROP_BORDER_RADII)
public void setBorderRadii(LinearGradientView gradientView, ReadableArray borderRadii) {
gradientView.setBorderRadii(borderRadii);
}
}

15
android/src/main/java/com/BV/LinearGradient/LinearGradientView.java
View File

@ -1,6 +1,7 @@
package com.BV.LinearGradient;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.uimanager.PixelUtil;
import android.content.Context;
import android.graphics.Canvas;
@ -23,7 +24,7 @@ public class LinearGradientView extends View {
private float[] mEndPos = {0, 1};
private int[] mColors;
private int[] mSize = {0, 0};
private float mBorderRadius = 0f;
private float[] mBorderRadii = {0, 0, 0, 0, 0, 0, 0, 0};
public LinearGradientView(Context context) {
@ -60,8 +61,13 @@ public class LinearGradientView extends View {
drawGradient();
}
public void setBorderRadius(float borderRadius) {
mBorderRadius = borderRadius;
public void setBorderRadii(ReadableArray borderRadii) {
float[] _radii = new float[borderRadii.size()];
for (int i=0; i < _radii.length; i++)
{
_radii[i] = PixelUtil.toPixelFromDIP((float) borderRadii.getDouble(i));
}
mBorderRadii = _radii;
updatePath();
drawGradient();
}
@ -98,8 +104,7 @@ public class LinearGradientView extends View {
mTempRectForBorderRadius.set(0f, 0f, (float) mSize[0], (float) mSize[1]);
mPathForBorderRadius.addRoundRect(
mTempRectForBorderRadius,
mBorderRadius,
mBorderRadius,
mBorderRadii,
Path.Direction.CW);
}

18
index.android.js
View File

@ -16,7 +16,21 @@ var LinearGradient = React.createClass({
// inherit container borderRadius until this issue is resolved:
// https://github.com/facebook/react-native/issues/3198
var borderRadius = style && flattenStyle(style).borderRadius || 0;
var flatStyle = style && flattenStyle(style);
var borderRadius = flatStyle.borderRadius || 0;
// this is the format taken by:
// http://developer.android.com/reference/android/graphics/Path.html#addRoundRect(android.graphics.RectF, float[], android.graphics.Path.Direction)
var borderRadiiPerCorner = [
flatStyle.borderTopLeftRadius || borderRadius,
flatStyle.borderTopLeftRadius || borderRadius,
flatStyle.borderTopRightRadius || borderRadius,
flatStyle.borderTopRightRadius || borderRadius,
flatStyle.borderBottomRightRadius || borderRadius,
flatStyle.borderBottomRightRadius || borderRadius,
flatStyle.borderBottomLeftRadius || borderRadius,
flatStyle.borderBottomLeftRadius || borderRadius
];
return (
<View {...otherProps} style={style}>
@ -26,7 +40,7 @@ var LinearGradient = React.createClass({
start={start}
end={end}
locations={locations}
borderRadius={borderRadius}
borderRadii={borderRadiiPerCorner}
/>
{ children }
</View>