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.

Sign up for GitHub

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

fix(rn): toast #11625

Closed
wants to merge 2 commits into from
+7 −1
Closed

fix(rn): toast #11625

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
77d73cd
fix: toast
Apr 12, 2022
4236cd9
Merge branch 'next' into feature-fix-toast
zhiqingchen Apr 13, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added packages/taro-rn/src/lib/showModal/error.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
8 changes: 7 additions & 1 deletion packages/taro-rn/src/lib/showModal/toast.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import PropTypes from 'prop-types'
import { View, Text, Image, StyleSheet, ActivityIndicator } from 'react-native'
import RootSiblings from 'react-native-root-siblings'
import successPng from './success.png'
import errorPng from './error.png'
import { errorHandler, shouldBeObject, successHandler } from '../../utils'

const globalAny: any = global
Expand All @@ -18,6 +19,11 @@ const styles = StyleSheet.create({
width: 55,
height: 55
},
toastErrorIcon: {
width: 42,
height: 42,
marginBottom: 10,
},
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

1、为什么不和 success 一样用 toastIcon？
2、加了 marginBottom，要是没有 title 时，是不是多余？

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

因为success是一个对勾，本身和title之间看起来是有一个间距的，但是error的icon是一个圆形，和title之间没有间距，看起来很丑，这个margin-bottom可以不加，加的目的就是为了好看

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

换个 error icon吧，和 success icon 大小、边距等尽量保持一致。然后也是不需要 margin-bottom

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

可以的，我找设计师设计一个，换上改一下这个pr

toastContent: {
color: '#FFFFFF',
textAlign: 'center'
Expand Down Expand Up @@ -148,7 +154,7 @@ function showToast (options: Taro.showToast.Option): Promise<TaroGeneral.Callbac
ToastView = <View style={maskStyle}>
<View style={styles.grayBlock}>
<View style={styles.toastView}>
<Image source={successPng} style={styles.toastIcon} />
<Image source={icon === 'error' ? errorPng : successPng} style={icon === 'error' ? styles.toastErrorIcon : styles.toastIcon} />
<Text style={styles.toastContent}>{title || ''}</Text>
</View>
</View>
Expand Down