Badge

A basic badge component that should render nicely on any platform. Supports a good level of customization.

You can customization Button component with the Props

Usage#

import React, {FC} from 'react';
import {Body, Badge} from 'qdmrncomponents';

const App: FC = () => {
  return (
    <Body>
      <Badge status={'success'} />
    </Body>
  );
};

Reference#

Props#

here all the list of Props you can use for Badge Component and it Inherits all ViewProps Props, from React Native

status#

this props gives you 3 different status like 'success' | 'error' | 'primary' | 'warning' type string

Value#

props for adding the text and type string

import * as React from 'react';
import {Body, Badge} from 'qdmrncomponents';

const App: FC = () => {
  return (
    <Body>
      <Badge status={'success'} value={'yes'} />
    </Body>
  );
};

export default MyComponent;

width#

props for adding the badge width and type number by default it will 40px be in Badge

import * as React from 'react';
import {Body, Badge} from 'qdmrncomponents';

const App: FC = () => {
  return (
    <Body>
      <Badge status={'success'} width={100} />
    </Body>
  );
};

borderRadius#

props for adding the badge border radius and type number by default it will 100px be in Badge

import * as React from 'react';
import {Body, Badge} from 'qdmrncomponents';

const App: FC = () => {
  return (
    <Body>
      <Badge status={'success'} value={'yes'} borderRadius={120} />
    </Body>
  );
};

textColor#

props for textColor for value of the badge by default it white string

textSize#

props for textsize for value of the badge by default it 12 number

containerStyle#

props give addition props to the badge element type Object

TextStyle#

props give addition props to the badge Value element type Object