React Native 中的主体变得可滚动

Question

我对滚动视图有一个小问题。

我希望标题变得粘性，标题后面意味着消息正文变得可滚动。

我已经尝试过以下一种实现方式。

HelpComponentContainer：---

 <View style={{ height: "100%" }}>
            <ScrollView
              style={{ flexGrow: 0 }}
            >
              <View>
                <Title>{messageTitle}</Title>

                <MessageBody>{messageBody}</MessageBody>
              </View>
            </ScrollView>
          </View>
const MessageBody = styled(Text)`
  color: #2d3e58;
  text-align: right;
  align-self: center;
  width: 90%;
`;

中使用这个组件

我在message-widget-card

 <RBSheet
        ref={helpSheet}
        closeOnDragDown={true}
        closeOnPressMask={true}
        height={hp(60)}
        customStyles={{
          wrapper: {
            backgroundColor: "rgba(52,52,52,0.8)",
          },
          draggableIcon: {
            backgroundColor: "#d3d6dc",
          },
          container: {
            borderRadius: 15,
          },
        }}
      >
        <Container>
          <HelpComponentContainer
            isHelpForMessage={true}
            messageTitle={helpMessageTitle}
            messageBody={helpMessage}
          />
        </Container>
      </RBSheet>

：--我已经尝试过这个。

但卷轴不起作用。

只是我希望蓝色标题应该是粘性的并且正文可以滚动。

我该如何解决这个问题？

谢谢！！

Answer 1

尝试像这样实现将标题保留在 ScrollView 之外。

const HelpComponentContainer = () => {
  return (
    <View style={{flex: 1}}>
      <Title>{messageTitle}</Title>
      <ScrollView style={{flex: 1}}>
        <MessageBody>{messageBody}</MessageBody>
      </ScrollView>
    </View>
  );
};

export default HelpComponentContainer;