Блог

Я хочу, чтобы карта расширялась и сжималась с течением времени

 const renderNote = (item) => {
    if (item.id === noteId) {
      if (item.note) {
        return (
          <View>
            <Title style={{ alignSelf: "center", paddingVertical: 10, color: colors.primary,fontSize:17 }}>Your Note</Title>
            <Text style={{ paddingLeft: 10 ,backgroundColor:colors.background,paddingVertical:10,borderRadius:5}}>{item.note}</Text>
          </View>
        );
      }
      return (
        <View>
          <Title style={{ alignSelf: "center", paddingVertical: 10, color: colors.primary ,fontSize:17}}>Your Note</Title>
          <Text style={{ paddingLeft: 10 ,backgroundColor:colors.background,paddingVertical:10,borderRadius:5}}>There is no note</Text>
        </View>
      );
    }
  };
  return (
    <View style={{ marginTop: 20 }}>
      <Title style={{ alignSelf: "center" }}>{AppointmentTitle}</Title>
      <ScrollView style={{ minHeight: 100 }}>
        {Appointment.slice(0, 2).map((item) => {
          return (
            <View key={item.id}>
              {item ? (
                <TouchableWithoutFeedback
                  onPress={() => {
                    noteId === item.id ?
                        setNoteId(null):
                        setNoteId(item.id)
                  }}
                >
                  <Card style={[{ margin: 10, borderRadius: 10 }, styles.shadow]}>
                    <Card.Content>
                      <Text style={{ fontSize: 16 }}>
                        You have an appontment with <Text style={{ color: colors.primary }}>{item.patinetName}</Text>
                      </Text>
                      {isTime ? renderFutureTime(item.dateTime) : renderTime(item.dateTime)}
                      {renderNote(item)}
                  
 

при отображении карты разверните как анимировать этот код

…………………………………………………………………………………………..