Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Please add support for adding a custom icon before the text #123

Open
KaranChimple opened this issue Apr 23, 2020 · 12 comments
Open

Please add support for adding a custom icon before the text #123

KaranChimple opened this issue Apr 23, 2020 · 12 comments

Comments

@KaranChimple
Copy link

No description provided.

@Yandamuri
Copy link

Yes, I am also looking for this feature

@kilisoria
Copy link

Hi Guys! I had the same issue but I tried to add an React element in the message and it works.

return Toast.show(
    <>
      <MessageIcon type="FontAwesome" ios={icon} android={icon} />
      <MessageText>{` ${message}`}</MessageText>
    </>,
    {`

@Yandamuri
Copy link

@kilisoria this is custom View is rendering inside the actual Toast View As shown in the below image

Screenshot_1613478193

here background black View is Actual Toast View. Is it possible to remove this actual Toast View?

@kilisoria
Copy link

I'm not sure but I think you can try to modify the styles for Toast main container, there is a property for that, and set same background color or modify margin/padding sizes.

@Yandamuri
Copy link

@kilisoria This is how I achieved my requirement

const toastMainContianer = {
	height: 41,
	paddingLeft: 13.5,
	paddingRight: 18,
	paddingVertical: 11,
	backgroundColor: '#4B5460',
	borderRadius: 10
}

Toast.show(<View style={toastMainContianer}><Text style={{color: '#FFFFFF'}}>{message}</Text></View>, {
	duration: 1000,
	position: -99, 
	shadow: false,
	animation: true,
	hideOnPress: true,
	delay: 0,
	backgroundColor: 'F2F8FF' //This is my app background color. So that Toast main container background color will be mixed with app background color.
});

BTW, I didn't find Toast main container prop. Can you let me know the prop name and where is it mentioned in the documentation?

@kilisoria
Copy link

kilisoria commented Feb 17, 2021

Hi! You have the following props:

.......
 containerStyle: {
      
},
textStyle: {
        
},
......

image

@Yandamuri
Copy link

Hey This is Awesome!. In fact, containerStyle and textStyle are not mentioned in the documentation. Can you tell me how to find out all the available props?

usually package maintainers are not mentioning all the available props in the documentation. Is there any way to find out through VScode editor?

@stanislav-sidorov-empeek

please update types from msg: string to ReactNode

@AndreasA
Copy link

AndreasA commented Nov 26, 2021

Created PR to adjust type for message: https://github.com/magicismight/react-native-root-toast/pull/150/files

EDIT: I also just found this PR: #111 which fixes the type and does additional stuff regarding RectNode support. Not sure if that is necessary as apparently it already works, so only the type should be wrong but maybe there are some specific components that make it necessary?

@vladhelios
Copy link

Any updates? Support react node type is really much needed

@felipejh
Copy link

Waiting for this. It would be very usefull.

@augusthjerrild
Copy link

Is this feature something that is planned? Or is this library not maintained anymore? :-)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

8 participants