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

hiddenItem height can't change #519

Closed
huurray opened this issue Oct 20, 2020 · 3 comments
Closed

hiddenItem height can't change #519

huurray opened this issue Oct 20, 2020 · 3 comments

Comments

@huurray
Copy link

huurray commented Oct 20, 2020

image

i tried to swipe list with basic example

but i couldn't change hidden item's height.
if i put static height to button, it disapeared..
i want to set full height like rowFront.
help me!!

        <SwipeListView
          data={records}
          inverted
          keyExtractor={(item) => item.id}
          disableRightSwipe
          renderItem={(data, rowMap) => (
            <View style={styles.rowFront}>
              <Text>{data.item.text}</Text>
            </View>
          )}
          renderHiddenItem={(data, rowMap) => (
            <View style={styles.rowBack}>
              <Text>Left</Text>
              <TouchableOpacity
                style={[styles.backRightBtn, styles.backRightBtnLeft]}
                onPress={() => closeRow(rowMap, data.item.id)}>
                <Text>Close</Text>
              </TouchableOpacity>
              <TouchableOpacity
                style={[styles.backRightBtn, styles.backRightBtnRight]}
                onPress={() => {}}>
                <Text>Delete</Text>
              </TouchableOpacity>
            </View>
          )}
          rightOpenValue={-150}
          style={{flex: 1}}
          contentContainerStyle={{
            justifyContent: 'flex-end',
            marginHorizontal: sizes.SIDE_PADDING,
            paddingTop: sizes.SIDE_PADDING,
          }}
        />
const styles = StyleSheet.create({
  rowFront: {
    backgroundColor: '#CCC',
    justifyContent: 'center',
    padding: 20,
  },
  rowBack: {
    alignItems: 'center',
    backgroundColor: '#DDD',
    flex: 1,
    flexDirection: 'row',
    justifyContent: 'space-between',
    paddingLeft: 30,
  },
  backRightBtn: {
    alignItems: 'center',
    top: 0,
    bottom: 0,
    justifyContent: 'center',
    position: 'absolute',
    width: 75,
  },
  backRightBtnLeft: {
    backgroundColor: 'blue',
    right: 75,
  },
  backRightBtnRight: {
    backgroundColor: 'red',
    right: 0,
  },
});
@huurray huurray closed this as completed Oct 21, 2020
@dl-husky73
Copy link

Huurrray, wondering how you fixed this problem. I am new to this component and having the same issue.

@AnatolyMakarovKHM
Copy link

recalculateHiddenLayout={true}

@KaneDenzil
Copy link

Having the same issue even while using recalculateHiddenLayout={true}

detailed info posted here also

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

4 participants