'When i copy paste text from browser to my Rich Text Editor TextInput , the view drops down a bit in Android. It adds a small black bar at top
When I paste text:
Top shows a small bar of black color:
Here is my code for the above Video. I have used react-native-pell-rich-editor and it contains a scrollview where Rich Editor is used with TextInput. I've tried all props of ScrollView but issue still persists. When I copy paste text from the browser to my Rich Text Editor TextInput View drops
<ParentContainer color={assets.colors.APP_BACKGROUND_COLOR}>
<View style={[palette.containerview.superParent]}>
<View style={styles.actionContainer}>
<Pressable
accessibilityLabel={
assets.localized_strings["SEND_MESSAGE.SUBMIT"]
}
accessibilityRole="button"
style={styles.sendButton}
onPress={isApiOnProgress ? null : submit}
>
<Text
maxFontSizeMultiplier={HEADING_FONT_MAX}
style={styles.sendButtonText}
>
{assets.localized_strings["SEND_MESSAGE.SUBMIT"]}
</Text>
</Pressable>
<Pressable
accessibilityLabel={
assets.localized_strings["SEND_MESSAGE.CANCEL"]
}
accessibilityRole="button"
style={styles.cancelButton}
onPress={goBack}
>
<Text
maxFontSizeMultiplier={HEADING_FONT_MAX}
style={styles.cancelText}
>
{assets.localized_strings["SEND_MESSAGE.CANCEL"]}
</Text>
</Pressable>
</View>
{/* )} */}
<View
style={[
palette.containerview.noMargincardView,
styles.marginBottom,
{ backgroundColor: assets.colors.WHITE_COLOR },
]}
>
<Header
title={assets.localized_strings["SEND_MESSAGE.NEW_MESSAGE"]}
onClose={goBack}
/>
<View style={styles.messageContainerScrollView}>
<ScrollView
nestedScrollEnabled={true}
ref={scroll}
style={{ flex: 1 }}
// keyboardDismissMode="dismiss"
keyboardDismissMode="none"
onContentSizeChange={() =>
scroll.current.scrollToEnd({ animated: false })
}
>
<View>
<RichEditor
disabled={false}
scrollEnabled={false}
style={styles.messageContainer}
returnKeyType={assets.localized_strings["SEND_MESSAGE.DONE"]}
ref={richText}
placeholder={
assets.localized_strings["SEND_MESSAGE.COMMENT"]
}
actions={[
actions.setBold,
actions.setItalic,
actions.setUnderline,
]}
// onChange={(text) => setMessage(encodeURI(text.toString().trim()))}
onChange={setMessage_}
/>
<TextInput
ref={setCloseKeyboardHackElement}
underlineColorAndroid="transparent"
style={{ height: 0, margin: 0, padding: 0 }}
/>
</View>
</ScrollView>
</View>
<View style={styles.toolbarContainer}>
{((status && status !== ARTWORK_STATUS.DENIED && status !== ARTWORK_STATUS.ARCHIVED && status !== ARTWORK_STATUS.REJECTED && status !== ARTWORK_STATUS.FULLY_APPOROVED) || isReSubmit) &&
<Pressable
accessibilityLabel={
assets.localized_strings["SEND_MESSAGE.UPLOAD_FILE"]
}
accessibilityRole="button"
style={{
justifyContent: "center",
flexDirection: "row",
alignItems: "center",
//padding: 10,
paddingVertical: DW(20)
}}
onPress={
Platform.OS === "ios" ? chooseFileIOS : chooseFileAndroid
}
>
<Image source={assets.images.disclosure.upload_image} />
<Text
maxFontSizeMultiplier={HEADING_FONT_MAX}
style={styles.uploadButtonText}
>
{assets.localized_strings["SEND_MESSAGE.UPLOAD_FILE"]}
</Text>
</Pressable>
}
<RichToolbar
style={[styles.richBarDark, { marginTop: 10, right: 10, }]}
flatContainerStyle={styles.flatStyle}
editor={richText}
actions={[
actions.setBold,
actions.setItalic,
actions.setUnderline,
]}
selectedIconTint={"#2095F2"}
disabledIconTint={"#bfbfbf"}
/>
</View>
{/* {loading === LOADING_TYPES.LOADING ? (
<SpinnerUi
spinner={true}
content={assets.localized_strings["COMMON.LOADING"]}
iscancelable={true}
></SpinnerUi>
) : (
<List data={AttachmentList} deleteItem={deleteItem} />
)} */}
{((status && status !== ARTWORK_STATUS.DENIED && status !== ARTWORK_STATUS.ARCHIVED && status !== ARTWORK_STATUS.REJECTED && status !== ARTWORK_STATUS.FULLY_APPOROVED) || isReSubmit) && <Text
maxFontSizeMultiplier={HEADING_FONT_MAX}
accessible={true}
accessibilityLabel={
assets.localized_strings["SEND_MESSAGE.ALLOWED_TYPES"]
}
style={{
fontSize: 12,
color: assets.colors.LIGHT_TEXT_COLOR,
fontFamily: assets.fonts.REGULAR,
}}
>
{assets.localized_strings["SEND_MESSAGE.ALLOWED_TYPES"]}
</Text>}
<List data={AttachmentList} deleteItem={deleteItem} />
{loading === LOADING_TYPES.LOADING && (
<SpinnerUi
spinner={true}
content={assets.localized_strings["COMMON.LOADING"]}
iscancelable={true}
></SpinnerUi>
)}
</View>
{Platform.OS === "ios" && (
<KeyboardAccessoryNavigation
nextHidden={true}
previousHidden={true}
doneDisabled={false}
onDone={closekeyboardhack}
/>
)}
</View>
</ParentContainer>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|


