React-native-talk-balloon NPM

React Native Talk Balloon

This is a component of talk balloons for React Native.

Install

`npm -i react-native-talk-balloon` or `yarn add react-native-talk-balloon`

How to use

import TalkBalloon from "react-native-talk-balloon";

<TalkBalloon
  backgroundColor="#D6EAF8"
  borderColor="#000000"
  borderRadius={17}
  triangleSize={17}
  triangleOffSet="22%"
  onPress={() => {
    Alert.alert('Hello!', 'You Pressed Me.');
  }}>
    <Text>
      You Message Here :)
    </Text>
</TalkBalloon>

API

Prop	Type	Default	Description
`triangleDirection`	`string`	`left`	set the direction from triangle `top`/`bottom`/`left`/`right`.
`triangleOffSet`	`string`	`20%`	set percentage offset of triangle position from top or left .
`triangleSize`	`number`	`10`	set the triangle size
`borderColor`	`string`	`#000000`	color of border
`borderWidth`	`number`	`1`	width of border
`containerStyle`	`object`	`null`	set the style of balloon container.
`onPress`	`function`	`null`	triggered on pressed the talk balloon.
`onLongPress`	`function`	`null`	triggered on long pressed talk balloon.
`borderRadius`	`number`	`10`	radius of border
`backgroundColor`	`string`	`#FFFFFF`	color of background
`width`	`number`	`300`	width of talk balloon
`height`	`number`	`50`	height of talk balloon
`children`	`node`	`<View />`	Content of `<TalkBalloon />`