Class LengthCorners<All, TopLeft, TopRight, BottomLeft, BottomRight>
A base class that can be used to create mixin aliases for styles that have 'corners', such as borderRadius. To use
the base class five ViewStyle interfaces need to be created; one for each corner and one that represents all
corners:
example
Style Interfaces
```ts
import { ViewStyle } from 'react-native';
export interface ITopLeft extends ViewStyle {
borderTopLeftRadius: number;
}
export interface ITopRight extends ViewStyle {
borderTopRightRadius: number;
}
export interface IBottomLeft extends ViewStyle {
borderBottomLeftRadius: number;
}
export interface IBottomRight extends ViewStyle {
borderBottomRightRadius: number;
}
export interface IAll extends ViewStyle {
borderRadius: number;
}
```
A function must then be created that can convert the corner and value into a style mixin:
example
Example Conversion function
```ts
import { LengthCornersCorner } from '@ef-carbon/react-native-style';
function convert(corner: LengthCornersCorner, value: number): IAll | ITop | ILeft | IRight | IBottom {
switch (corner) {
case 'all': return { borderRadius: value };
case 'topLeft': return { borderTopLeftRadius: value };
case 'topRight': return { borderTopRightRadius: value };
case 'bottomLeft': return { borderBottomLeftRadius: value };
case 'bottomRight': return { borderBottomRightRadius: value };
default: return assertNever(corner);
}
}
```
Then the base class can be extended:
A base class that can be used to create mixin aliases for styles that have 'corners', such as
borderRadius. To use the base class fiveViewStyleinterfaces need to be created; one for each corner and one that represents all corners: