Support percentage border-radius values (Fix #1154)

This commit is contained in:
Niklas von Hertzen 2017-08-04 20:41:36 +08:00
parent e380e2c873
commit adb1f50f00
2 changed files with 17 additions and 18 deletions

View File

@ -194,40 +194,39 @@ export const parseBoundCurves = (
borders: Array<Border>,
borderRadius: Array<BorderRadius>
): BoundCurves => {
// TODO support percentage borderRadius
const HALF_WIDTH = bounds.width / 2;
const HALF_HEIGHT = bounds.height / 2;
const tlh =
borderRadius[CORNER.TOP_LEFT][H].value < HALF_WIDTH
? borderRadius[CORNER.TOP_LEFT][H].value
borderRadius[CORNER.TOP_LEFT][H].getAbsoluteValue(bounds.width) < HALF_WIDTH
? borderRadius[CORNER.TOP_LEFT][H].getAbsoluteValue(bounds.width)
: HALF_WIDTH;
const tlv =
borderRadius[CORNER.TOP_LEFT][V].value < HALF_HEIGHT
? borderRadius[CORNER.TOP_LEFT][V].value
borderRadius[CORNER.TOP_LEFT][V].getAbsoluteValue(bounds.height) < HALF_HEIGHT
? borderRadius[CORNER.TOP_LEFT][V].getAbsoluteValue(bounds.height)
: HALF_HEIGHT;
const trh =
borderRadius[CORNER.TOP_RIGHT][H].value < HALF_WIDTH
? borderRadius[CORNER.TOP_RIGHT][H].value
borderRadius[CORNER.TOP_RIGHT][H].getAbsoluteValue(bounds.width) < HALF_WIDTH
? borderRadius[CORNER.TOP_RIGHT][H].getAbsoluteValue(bounds.width)
: HALF_WIDTH;
const trv =
borderRadius[CORNER.TOP_RIGHT][V].value < HALF_HEIGHT
? borderRadius[CORNER.TOP_RIGHT][V].value
borderRadius[CORNER.TOP_RIGHT][V].getAbsoluteValue(bounds.height) < HALF_HEIGHT
? borderRadius[CORNER.TOP_RIGHT][V].getAbsoluteValue(bounds.height)
: HALF_HEIGHT;
const brh =
borderRadius[CORNER.BOTTOM_RIGHT][H].value < HALF_WIDTH
? borderRadius[CORNER.BOTTOM_RIGHT][H].value
borderRadius[CORNER.BOTTOM_RIGHT][H].getAbsoluteValue(bounds.width) < HALF_WIDTH
? borderRadius[CORNER.BOTTOM_RIGHT][H].getAbsoluteValue(bounds.width)
: HALF_WIDTH;
const brv =
borderRadius[CORNER.BOTTOM_RIGHT][V].value < HALF_HEIGHT
? borderRadius[CORNER.BOTTOM_RIGHT][V].value
borderRadius[CORNER.BOTTOM_RIGHT][V].getAbsoluteValue(bounds.height) < HALF_HEIGHT
? borderRadius[CORNER.BOTTOM_RIGHT][V].getAbsoluteValue(bounds.height)
: HALF_HEIGHT;
const blh =
borderRadius[CORNER.BOTTOM_LEFT][H].value < HALF_WIDTH
? borderRadius[CORNER.BOTTOM_LEFT][H].value
borderRadius[CORNER.BOTTOM_LEFT][H].getAbsoluteValue(bounds.width) < HALF_WIDTH
? borderRadius[CORNER.BOTTOM_LEFT][H].getAbsoluteValue(bounds.width)
: HALF_WIDTH;
const blv =
borderRadius[CORNER.BOTTOM_LEFT][V].value < HALF_HEIGHT
? borderRadius[CORNER.BOTTOM_LEFT][V].value
borderRadius[CORNER.BOTTOM_LEFT][V].getAbsoluteValue(bounds.height) < HALF_HEIGHT
? borderRadius[CORNER.BOTTOM_LEFT][V].getAbsoluteValue(bounds.height)
: HALF_HEIGHT;
const topWidth = bounds.width - trh;

View File

@ -4,7 +4,7 @@ import Length from '../Length';
const SIDES = ['top-left', 'top-right', 'bottom-right', 'bottom-left'];
export type BorderRadius = Array<Length>;
export type BorderRadius = [Length, Length];
export const parseBorderRadius = (style: CSSStyleDeclaration): Array<BorderRadius> => {
return SIDES.map(side => {